Colours In Column Chart

RE: Colours In Column Chart

Goddati Venkatesh — Fri, 06 Jun 2025 02:48:04 GMT

Hi Stefan Helzle ,Zakary Melvin ,Thanks for your time

a!localVariables(
  /* Country data */
  local!selectedcountry,
  local!data: {
    a!map(
      country: "Inida",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Berundi",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Bnablooer",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Telangana",
      value: 27,
      continent: "America"
    ),
    a!map(
      country: "Maharashtra",
      value: 27,
      continent: "America"
    ),
    a!map(
      country: "Austria",
      value: 27,
      continent: "Middle East"
    ),
    a!map(
      country: "Uttar",
      value: 27,
      continent: "Middle East"
    ),
    a!map(
      country: "Jammu",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "Kerla",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "Afghanistan",
      value: 10,
      continent: "Oceania"
    ),
    a!map(
      country: "Belgium",
      value: 15,
      continent: "Oceania"
    ),
    a!map(
      country: "China",
      value: 15,
      continent: "Eurasia"
    ),
    a!map(
      country: "Dubai",
      value: 15,
      continent: "Eurasia"
    ),
    a!map(
      country: "Narva",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "odissa",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "mumbai",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "South Korea",
      value: 27,
      continent: "Asia"
    ),
    a!map(
      country: "Nigeria",
      value: 27,
      continent: "Africa"
    ),
    a!map(
      country: "Pooland",
      value: 27,
      continent: "Africa"
    ),
    a!map(
      country: "USSR",
      value: 27,
      continent: "Africa"
    )
  },
  /* Extract country names */
  local!countries: index(local!data, "country", {}),
  /* Define continents */
  local!continents: { "Europe", "Asia", "Africa","America","Eurasia","Oceania","Middle East"},
  /* Define colors for each continent */
  local!continentColors: {
    "Europe": "#4DA6FF",
    /* Light blue */
    "Asia": "#CC6666",
    /* Brownish red */
    "Africa": "#5C6670"/* Dark gray */

  },
  /* Create one chartSeries per continent */
  local!series: 
  a!forEach(
    items: local!continents,
    expression: a!localVariables(
      local!continent: fv!item,
      a!chartSeries(
        label: local!continent,
        data: a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.value,
            null()
          )
        ),
        color: local!continentColors[local!continent]
      )
    )
  ),
  /* Render the chart */
  a!columnChartField(
    label: "All Countries",
    categories: local!countries,
    series:  a!forEach(
      items: local!continents,
      expression: a!localVariables(
        local!continent: fv!item,
        local!datasubset:a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.value,
            null()
          )
        ),
        local!links:a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.country,
            null()
          )
        ),
        
        a!chartSeries(
          label: local!continent,
          data: local!datasubset,
          color: local!continentColors[local!continent],
          links: a!forEach(
            items: local!links,
            expression: a!dynamicLink(
              saveInto: a!save(local!selectedcountry,fv!item)
            )
          )
        )
      )
    ),
    xAxisTitle: "Countries",
    yAxisTitle: "Value",
    showLegend: true
  )
)

RE: Colours In Column Chart

goddativ5526 — Fri, 06 Jun 2025 02:42:36 GMT

a!localVariables(
  /* Country data */
  local!selectedcountry,
  local!data: {
    a!map(
      country: "Inida",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Berundi",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Bnablooer",
      value: 27,
      continent: "Europe"
    ),
    a!map(
      country: "Telangana",
      value: 27,
      continent: "America"
    ),
    a!map(
      country: "Maharashtra",
      value: 27,
      continent: "America"
    ),
    a!map(
      country: "Austria",
      value: 27,
      continent: "Middle East"
    ),
    a!map(
      country: "Uttar",
      value: 27,
      continent: "Middle East"
    ),
    a!map(
      country: "Jammu",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "Kerla",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "Afghanistan",
      value: 10,
      continent: "Oceania"
    ),
    a!map(
      country: "Belgium",
      value: 15,
      continent: "Oceania"
    ),
    a!map(
      country: "China",
      value: 15,
      continent: "Eurasia"
    ),
    a!map(
      country: "Dubai",
      value: 15,
      continent: "Eurasia"
    ),
    a!map(
      country: "Narva",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "odissa",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "mumbai",
      value: 10,
      continent: "Asia"
    ),
    a!map(
      country: "South Korea",
      value: 27,
      continent: "Asia"
    ),
    a!map(
      country: "Nigeria",
      value: 27,
      continent: "Africa"
    ),
    a!map(
      country: "Pooland",
      value: 27,
      continent: "Africa"
    ),
    a!map(
      country: "USSR",
      value: 27,
      continent: "Africa"
    )
  },
  /* Extract country names */
  local!countries: index(local!data, "country", {}),
  /* Define continents */
  local!continents: { "Europe", "Asia", "Africa","America","Eurasia","Oceania","Middle East"},
  /* Define colors for each continent */
  local!continentColors: {
    "Europe": "#4DA6FF",
    /* Light blue */
    "Asia": "#CC6666",
    /* Brownish red */
    "Africa": "#5C6670"/* Dark gray */

  },
  /* Create one chartSeries per continent */
  local!series: 
  a!forEach(
    items: local!continents,
    expression: a!localVariables(
      local!continent: fv!item,
      a!chartSeries(
        label: local!continent,
        data: a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.value,
            null()
          )
        ),
        color: local!continentColors[local!continent]
      )
    )
  ),
  /* Render the chart */
  a!columnChartField(
    label: "All Countries",
    categories: local!countries,
    series:  a!forEach(
      items: local!continents,
      expression: a!localVariables(
        local!continent: fv!item,
        local!datasubset:a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.value,
            null()
          )
        ),
        local!links:a!forEach(
          items: local!data,
          expression: if(
            fv!item.continent = local!continent,
            fv!item.country,
            null()
          )
        ),
        
        a!chartSeries(
          label: local!continent,
          data: local!datasubset,
          color: local!continentColors[local!continent],
          links: a!forEach(
            items: local!links,
            expression: a!dynamicLink(
              saveInto: a!save(local!selectedcountry,fv!item)
            )
          )
        )
      )
    ),
    xAxisTitle: "Countries",
    yAxisTitle: "Value",
    showLegend: true
  )
)

RE: Colours In Column Chart

goddativ5526 — Fri, 06 Jun 2025 02:38:41 GMT

a!localVariables(
/* Country data */
local!selectedcountry,
local!data: {
a!map(
country: "Inida",
value: 27,
continent: "Europe"
),
a!map(
country: "Berundi",
value: 27,
continent: "Europe"
),
a!map(
country: "Bnablooer",
value: 27,
continent: "Europe"
),
a!map(
country: "Telangana",
value: 27,
continent: "America"
),
a!map(
country: "Maharashtra",
value: 27,
continent: "America"
),
a!map(
country: "Austria",
value: 27,
continent: "Middle East"
),
a!map(
country: "Uttar",
value: 27,
continent: "Middle East"
),
a!map(
country: "Jammu",
value: 10,
continent: "Asia"
),
a!map(
country: "Kerla",
value: 10,
continent: "Asia"
),
a!map(
country: "Afghanistan",
value: 10,
continent: "Oceania"
),
a!map(
country: "Belgium",
value: 15,
continent: "Oceania"
),
a!map(
country: "China",
value: 15,
continent: "Eurasia"
),
a!map(
country: "Dubai",
value: 15,
continent: "Eurasia"
),
a!map(
country: "Narva",
value: 10,
continent: "Asia"
),
a!map(
country: "odissa",
value: 10,
continent: "Asia"
),
a!map(
country: "mumbai",
value: 10,
continent: "Asia"
),
a!map(
country: "South Korea",
value: 27,
continent: "Asia"
),
a!map(
country: "Nigeria",
value: 27,
continent: "Africa"
),
a!map(
country: "Pooland",
value: 27,
continent: "Africa"
),
a!map(
country: "USSR",
value: 27,
continent: "Africa"
)
},
/* Extract country names */
local!countries: index(local!data, "country", {}),
/* Define continents */
local!continents: { "Europe", "Asia", "Africa","America","Eurasia","Oceania","Middle East"},
/* Define colors for each continent */
local!continentColors: {
"Europe": "#4DA6FF",
/* Light blue */
"Asia": "#CC6666",
/* Brownish red */
"Africa": "#5C6670"/* Dark gray */

},
/* Create one chartSeries per continent */
local!series:
a!forEach(
items: local!continents,
expression: a!localVariables(
local!continent: fv!item,
a!chartSeries(
label: local!continent,
data: a!forEach(
items: local!data,
expression: if(
fv!item.continent = local!continent,
fv!item.value,
null()
)
),
color: local!continentColors[local!continent]
)
)
),
/* Render the chart */
a!columnChartField(
label: "All Countries",
categories: local!countries,
series: a!forEach(
items: local!continents,
expression: a!localVariables(
local!continent: fv!item,
local!datasubset:a!forEach(
items: local!data,
expression: if(
fv!item.continent = local!continent,
fv!item.value,
null()
)
),
local!links:a!forEach(
items: local!data,
expression: if(
fv!item.continent = local!continent,
fv!item.country,
null()
)
),

a!chartSeries(
label: local!continent,
data: local!datasubset,
color: local!continentColors[local!continent],
links: a!forEach(
items: local!links,
expression: a!dynamicLink(
saveInto: a!save(local!selectedcountry,fv!item)
)
)
)
)
),
xAxisTitle: "Countries",
yAxisTitle: "Value",
showLegend: true
)
)

Actual requirement is to show countries oin the chart and colour should be different for each continent countries,up on clicking on any bar it should save country Name ,Here i acheived all functional requirements but that bar and bottom label is not aligning in same line Can anyone help in this.if any other way to implement this feature please suggest me.

RE: Colours In Column Chart

Zakary Melvin — Wed, 04 Jun 2025 15:18:12 GMT

But to the point of your original question... are you now able to display multiple colors in your column chart?

We'll need some additional information to help with links in the a!chartSeries(). Like the type of link, expected outcome, and actual outcome. The Drilldown Report Pattern has an example of using the links parameter of a!chartSeries() in a column chart field.

RE: Colours In Column Chart

Stefan Helzle — Wed, 04 Jun 2025 10:54:14 GMT

What exactly do you mean with "not working", and how does you code look like?

RE: Colours In Column Chart

goddativ5526 — Wed, 04 Jun 2025 09:38:57 GMT

Zakary Melvin Thanks for reply, but link parameter is not working for above code in all bars in chart.

RE: Colours In Column Chart

Zakary Melvin — Mon, 02 Jun 2025 13:49:13 GMT

You can manage the colors by using multiple a!chartSeries() like below...

{
  a!columnChartField(
    label: "Column Chart",
    categories: {"Category 1", "Category 2", "Category 3"},
    series: {
      a!chartSeries(color: "#f0f0f0", label: "Country One", data: {1, 2, 3}),
      a!chartSeries(color: "ACCENT", label: "Country Two", data: {2, 3, 4}),
    },
    stacking: "NONE",
    showLegend: true,
    showTooltips: true,
    labelPosition: "ABOVE",
    allowImageDownload: true,
    colorScheme: "RAINFOREST",
    height: "MEDIUM",
    xAxisStyle: "STANDARD",
    yAxisStyle: "STANDARD"
  )
}