Hi Team, I'm currently stuck at a point and would appreciate your input. I need to display different colors for different countries in a column chart. Below is the database structure I'm working with
country ListId(pK),
.countryId(int),
isAllowed(boolean)
Note: I want to show only allowed countries data in column chart.
I grouped the data by countryId, and I want to display different colors for different ranges of country IDs in a column chart. For example: Country IDs 1, 2, 3, and 4 should be shown in blue Country IDs 5, 6, 7, and 8 in yellow Country IDs 9 and 10 in another color These colors are just examples. If this approach is feasible, I will apply it to the actual requirement.
Discussion posts and replies are publicly visible
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" ) }
Zakary Melvin Thanks for reply, but link parameter is not working for above code in all bars in chart.
What exactly do you mean with "not working", and how does you code look like?
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.
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.