PMSI-AlignAlytics / dimple

An object-oriented API for business analytics
Other
2.73k stars 556 forks source link

Wish: ability to draw threshold lines #282

Open RichardNeill opened 6 years ago

RichardNeill commented 6 years ago

I have a bar chart showing performance data vs date. There is a threshold (say 80%) above which I consider the performance "good" and colour them green; below 60% is red.

It would also be really nice if I could draw on the chart, some horizontal lines at 60% and 80%, and have them labelled as thresholds or markers. [similar uses may apply to vertical lines]

At the moment, the workaround is just to add extra data-series and treat them as line-graphs. However, then these lines are confusingly labelled, the tooltips indicate the underlying data (rather than saying simply "This is the threshold at 80% for good performance"), and the line will not run the full width of the chart (because the 0th bar does not co-incide with the y-axis). The Threshold styles should also be a bit more like the horizontal grid-lines - perhaps dashed - rather than like a genuine data-series.

Could we have some new function like: dimpleChart.addThreshold (yAxis,yValue,"Threshold Label") ?

Thanks very much

RichardNeill commented 6 years ago

For anyone else looking here at how to make a dashed line, use this bit of d3, after calling myChart.draw():

var path = "path.dimple-" + YOUR_SERIES_NAME.toLowerCase().replace(/ /g, "-").replace(/[^a-z0-9-]+/g, "-"); svg.selectAll(path).style("stroke-dasharray", ("2, 2"));

RichardNeill commented 6 years ago

It may also help to know that if we do: mySeries.interpolation = 'step' then the simulated grid line will now be drawn all the way across the chart, rather than stopping at the mid-point of the first and last bar.