Change Color settings (stroke) dynamically; depends on value
See original GitHub issueHi,
I’m not very fimilar with javascript and I searched for a solution the last few days. Perhaps it’s very easy (it seems so) but I didn’t get it.
I have a bar chart and wan’t to have red for negativ values (< 0) and green for the other ones ( > = 0). The circles should have the same color as the bars. That’s my code:
var Chartist3 = new Chartist.Bar('#chart3', { labels: [], series: [ myDatalast10 ] }, { height: 240, fullWidth: true, showGrid: true, showLabel: true, axisY: { onlyInteger: true, offset: 20 }, axisX: { labelInterpolationFnc: function(value, index) { return index % 2 === 0 ? value : null; } }, plugins: [ Chartist.plugins.tooltip() ] }); Chartist3.on('draw', function(data) { if(data.type === 'bar') { data.group.append(new Chartist.Svg('circle', { cx: data.x2, cy: data.y2, r: Math.abs(Chartist.getMultiValue(data.value)) * 1.2 + 2.5 }, 'ct-slice-pie')); } });
And that’s my actual chart:
Perhaps anybody have a solution for me.
Thanks and greets Maurice
Issue Analytics
- State:
- Created 6 years ago
- Comments:10
You can move your circle code snippet into the upper logic…