Stepped Chart with Area - Tooltip does not show in the area.

24 views
Skip to first unread message

Michael Ford

unread,
Mar 25, 2019, 4:39:05 PM3/25/19
to Google Visualization API

 I have a stepped chart built but I have two minor issues I don't see an answer for. 

See an example of the chart here. 
https://jsfiddle.net/michaelcford/71b0ftjz/ 

First issue the tooltip associated shows only in the white space of the chart and not in the area's ( green or blue area ), 
Looked for sometime and have not found an answer.   
I expect I would add something to interval but nothing has worked as of yet. 
           interval: {
             'intAll': {
               'style': 'area',
               'color': 'blue'
             },
             'intLike': {
               'style': 'area',
               'color': 'green'
             },

The other item is the last 1/2 of a interval does not show the area ?? 

Daniel LaLiberte

unread,
Mar 25, 2019, 5:01:46 PM3/25/19
to Google Visualization API
Hi Michael,

It looks like area intervals are being drawn after the step lines or areas.  It is probably a bug that it does that, and it should not be too difficult to fix, but I don't know when we will be able to get around to it.

The last step cutting off the area interval is also another bug, most likely.

I see another bug, which involves the mouseover position.  It seems that when hovering over the left half of each step, it is showing the tooltip for the previous step, as if the transition between steps is the important thing (since that is where the new value is) rather than the step level itself.   

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/722fcc9f-96fb-497e-b579-9c8d775e0235%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


--

Michael Ford

unread,
Mar 26, 2019, 2:08:02 PM3/26/19
to Google Visualization API
So for me there is no fix at this time for these two issues I have defined? 
Should I do anything to have the issues captured as open issues? 

Regards


On Monday, March 25, 2019 at 2:01:46 PM UTC-7, Daniel LaLiberte wrote:
Hi Michael,

It looks like area intervals are being drawn after the step lines or areas.  It is probably a bug that it does that, and it should not be too difficult to fix, but I don't know when we will be able to get around to it.

The last step cutting off the area interval is also another bug, most likely.

I see another bug, which involves the mouseover position.  It seems that when hovering over the left half of each step, it is showing the tooltip for the previous step, as if the transition between steps is the important thing (since that is where the new value is) rather than the step level itself.   

On Mon, Mar 25, 2019 at 4:39 PM Michael Ford <michael...@gmail.com> wrote:

 I have a stepped chart built but I have two minor issues I don't see an answer for. 

See an example of the chart here. 
https://jsfiddle.net/michaelcford/71b0ftjz/ 

First issue the tooltip associated shows only in the white space of the chart and not in the area's ( green or blue area ), 
Looked for sometime and have not found an answer.   
I expect I would add something to interval but nothing has worked as of yet. 
           interval: {
             'intAll': {
               'style': 'area',
               'color': 'blue'
             },
             'intLike': {
               'style': 'area',
               'color': 'green'
             },

The other item is the last 1/2 of a interval does not show the area ?? 

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.

Daniel LaLiberte

unread,
Mar 26, 2019, 2:33:12 PM3/26/19
to Google Visualization API
If you replace your area intervals with lines, then that should avoid the problem with the areas covering your data points.  

But if you need to draw area intervals, since SVG only uses the order of elements to determine the order of drawing and hence which elements end up on top, there is no way for you to fix this other than to change the order of elements.  You might try, after the chart is drawn, to do some surgery on the unlabeled elements to move them around, but that may be fragile workaround.

You could also replace the steppedArea part of your chart with lines you draw yourself, adding points to get the stepped plateaus.  This won't help with the area intervals, but it will probably help with the last interval problem, and the mouseover problem.


To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.

To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/72e35929-78d1-43b3-9293-c5a922e85c31%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.


--
Reply all
Reply to author
Forward
0 new messages