Visually indicate threshold for graph

[Cody-G-G]

Hello, I was wondering whether there is any way to make it visually clear on the graph that a certain data point has gone over / under a specified threshold? To expand on this, what I would like would be something like the ability to individually color bars in the bar chart (red for ones that go over / under a threshold that I maintain, green for others within "accepted ranges"), or like a way to draw horizontal lines over the stockline graph, indicating clearly what the threshold range is, so the user can see when those are exceeded, etc.

If there's no established way to achieve this (which I believe might be the case after a quick look over examples and code), is there a hacky way, or maybe something that I could implement if pointed in the right direction?

Thank you

[marzolfb]

Have you seen either of the "SmoohLineChartRegion" charts in the example app? Those examples are very similar to what you describe above. If you have seen those examples and it is not what you are looking for, how does it differ from what you describe above?

[Cody-G-G]

The issue with those is that the x and y axes are dependent on the dataset. What I'm looking for is a way to configure the x and y axes, and plot some points on the graph, but without the plot lines starting from the x axis minimum, and ending at the maximum, but "inside" the graph.

That's probably not terribly clear, so to be more specific, I am looking to use X axis as the hours of the current day, and the Y axis as some integer values. So for example if my dataset consists of 3 points say at 8am, 12pm, and 5pm, then the plot would be more in the center of the graph, and would not extend all the way to the minimum of the X axis (00:00) and the maximum of the X axis (12 midnight).

Although I might be able to give up on this requirement if infeasible, the more important part is that I have a requirement for the data points to be actually visible on the graph in some way, or to be able to be interpreted easy (such as in a bar graph), rather than just the plotting between them (the data points are actually blood glucose levels, and it's important to see how many data points are actually plotted, as opposed to just the "trend" of the glucose over time). This is why I mentioned the stockline graph, since the datapoints are actually visible (to some extent, although I'd love to have an option to actually display them as little circles or something), but as far as I could tell there is no "region" feature implemented for the stockline graph as well?

[marzolfb]

Re "The issue with those is that the x and y axes are dependent on the dataset", the SmoothLineChartRegionsExtended shows an example of using min max vales to display axes lengths independent of the dataset. Both SmoothLine and StockLine charts are derived from the same Line chart src file, so (though I havent tried this yet), my guess is anything you can do with SmoothLine you should also be able to do with StockLine.

So give it a shot and see if you can make it work. Might be interesting to see whatever you come up with as another example to add to the example app. If you want to do that feel free to submit a PR.

Either that, or it might be interesting to see some more unique chart examples as part of a "chart gallery" either in the wiki section or maybe as a separate static github pages-based site. An idea really anyone can get started. Just throwing it out there.

[Cody-G-G]

I'll give that a try and let you know how it goes. However that brings me back to square one on the actual subject of this issue, which is the threshold visualization, since stockline graphs don't have the region feature I believe? Speaking of which, how hard would it be to also implement it on stockline graphs if I were to borrow from the implementation of the smooth line graph?

[marzolfb]

Stockline does have the regions feature - that's what I was trying to communicate above when I said "Anything you can do with a SmoothLine you should also be able to do with StockLine" (since they are both derivatives of the base line chart and share the same underlying source code) . Sorry if that wasn't clear.

[Cody-G-G]

Ah, I see, that's marvelous, thank you! The only issue now is that the min / max are actually only available for the Y axis...is there any specific reason for it being implemented like this, or has the requirement simply not come up until now? I imagine it would be trivial to implement if there's no reason not to...?

[marzolfb]

I started going down that road knowing that even I would want vertical regions and min/max values that applied to the x-axis instead of the y-axis but I started running into problems based on what was available in the dependent paths-js library we are using.

First, if one passes in min/max values for options to a chart (as we are here in this lib), paths-js only applies these options to the y-axis (see this paths-js PR).

Second, for the regions (which I worked on at the same time I added support for min/max), I ran into issues trying to apply that to the x-axis there too. I don't remember specifically what the issues were there but I suspect again it was oriented towards paths-js insistence of only handling the y-axis for min/max values. My guess is I couldn't scale correctly on the x-axis because paths-js had no direct support for min/max values on the x-axis.

So, I think all of this is doable, it just requires much more work in submitting improvements to paths-js (and getting the PR accepted and merged in) and incorporating those changes into this library.

[Cody-G-G]

I see. Well, thank you very much for the help, I will probably get by with what is provided with a bit of hacking on the side. Feel free to close this issue if you feel it's not relevant to be kept opened at this point (my original issue was actually resolved anyway with you pointing out that I can use regions with StockLine as well). 👍