CODEWITHSUNDEEP
amchartsamcharts4
muuvmuuv
muuvmuuv

Reputation: 953

Change border color for each data in amchart separately

I saw there is an option to change the background color of each data entry in a pie chart but can not find a option to change the border color.

    memoryChartSeries.colors.list = [
      am4core.color('rgba(54, 162, 235, 0.2)'), // blue

What I have found is memoryChartSeries.slices.template.stroke but I don't know if this can hold more than one color. I would expect something like:

    memoryChartSeries.border.colors.list = [
      am4core.color('rgba(54, 162, 235, 0.2)'), // blue

Upvotes: 2

Views: 3000

Answers (2)

Asif vora
Asif vora

Reputation: 3347

You need to define your custom color code array and set with the theme.

const colors = [
    am4core.color('#18020A'),
    am4core.color('#730154'),
    am4core.color('#E77624'),
    am4core.color('#7E5109'),
    am4core.color('#34495E'),
    am4core.color('#B3B6B7'),
    am4core.color('#232555'),
    am4core.color('#196F3D'),
    am4core.color('#6C3483'),           
]

const am4themes_myTheme = (target) => {
    if (target instanceof am4core.ColorSet) {       
        target.list =  themeModeChange(themeMode)
    }
}

am4core.useTheme(am4themes_myTheme);

series.columns.template.adapter.add("stroke", function (fill, target) {
    return chart.colors.getIndex(target.dataItem.index);
});

yo can change border color for each data in amchart separately.

Upvotes: 1

Samuel Philipp
Samuel Philipp

Reputation: 11050

You can just set pieSeries.slices.template.stroke:

pieSeries.slices.template.stroke = am4core.color('rgba(54, 162, 235, 0.2)');

This will set the border color for all slices of your pie chart.

If you want to set the border color for each slice individually you might want to use an adapter for that:

pieSeries.slices.template.adapter.add("stroke", (value, target, key) => {
    // return what color you want here...
    return value;
});

Upvotes: 2

Related Questions