data.color function based on d.value does not change chart color
karenmnyv opened this issue · comments
I am working on an area chart where I want the data to have a different color if the value is negative.
I don't have a codepen, but I was testing on the c3 example pages, so it's possible to just paste the code there
When using only d.id, the color of the chart changes
var chart = c3.generate({ data: { columns: [ ['data1', -30, 20, -50, 40, 60, -50], ], types: {data1: 'area'}, color: function (color, d) { if (d.id == "data1") { return '#ff0000' } return color; } } });
But when using value as well, only the data points change color, not the lines or the area
var chart = c3.generate({ data: { columns: [ ['data1', -30, 20, -50, 40, 60, -50], ], types: {data1: 'area'}, color: function (color, d) { if (d.value < 0 && d.id == "data1") { return '#ff0000' } return color; } } });
Edit: this is my first time opening an issue, so please let me know if I need to add any info