LineChart, Dual Y, line up yAxes gridlines and labels

568 views
Skip to first unread message

Jason

unread,
Mar 2, 2016, 3:53:42 PM3/2/16
to Google Visualization API
Hey!!

Is it possible to line up the vertical / Y axes grid lines so that both sides share the same grid lines? The Y axis values are different for each but It would still be nice to have only 3 Y Axis grid lines instead of 5. In addition, when I use the Dual Y chart my Title, and both Y axes appear to get cut off but the gridline values stay as well as the x axis options. Any thoughts to why this is?

I tried setting all the positions to 'out' but did not help them get displayed (I know its the default but thought I'd declare it anyway).
Here are the options I currently use:

var options = {
        title: 'Large number vs Small Number, 1 month',
        titlePosition: 'out',

        width: 1000,
        series: {
            0: {axis: 'Large'},
          1: {axis: 'Large'}
        },
        hAxis: {
          title: 'Date',
          format: 'M/d/yy',
          textStyle: {fontSize: 10},
          gridlines: {count: 31}
          },
         
        axes: {y: {                       
                    0: {label: 'This is big'},
              1: {label: 'This is small',
                      minvalue: 0,
                  maxvalue: 100}}
 }};

Sergey Grabkovsky

unread,
Mar 2, 2016, 3:59:15 PM3/2/16
to Google Visualization API
Hi Jason,

Sadly, this is not currently possible. Both axes will attempt to pick 'nice numbers', so unless you pick those numbers for them and the math works out such that there's the same number of nice ticks, it will not be aligned. If you're not using Material charts, you could get alignment by explicitly specifying the view window as well as the ticks that appear on the axis.

I'm not sure what you mean when you say that "both Y axes appear to get cut off". Could you please either post a screenshot or link to a jsfiddle?

--
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/b921dc05-920a-41c4-9732-a235ebb03658%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
--

unnamed.gif

Sergey Grabkovsky

Software Engineer

Google, Inc

gra...@google.com


J Kline

unread,
Mar 2, 2016, 4:11:24 PM3/2/16
to google-visua...@googlegroups.com


Sergey,

Regarding the Y axis grid line lineup, thanks for the information.

Relating to the Y axis labels and main chart title disappear, see the chart posted above. I cut off the Legend myself, it displays fine. I can not get my Titles and labels to display though. Any guesses? I changed off the 'current' release a bit ago so that is not it. It was working fine before I put a minvalue and maxvalue in for the second Y axis.

--
You received this message because you are subscribed to a topic in the Google Groups "Google Visualization API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/VJn0BIOJd2k/unsubscribe.
To unsubscribe from this group and all its topics, 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.

J Kline

unread,
Mar 2, 2016, 4:14:00 PM3/2/16
to google-visua...@googlegroups.com
Oh you know what I think I need to use axes: x instead of hAxis??

Sergey Grabkovsky

unread,
Mar 2, 2016, 4:31:15 PM3/2/16
to google-visua...@googlegroups.com
Hi Jason,

It appears that you're drawing a Material Chart. Even for a Material Chart, you should not need to use the Material options (as listed in the Dual-Y example). Using google.charts.Line.convertOptions(classicOptions) should yield equivalent results, with a few exceptions (such as subtitles). You should only need to revert to the Material options when using a new feature (such as Dual-X axes).

Our Material Charts are in beta and we're still refining the way the options are structured. This means that options may change from under you and you may need to change your code. Our documentation needs to be clearer about this.


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

Jason

unread,
Mar 2, 2016, 4:55:47 PM3/2/16
to Google Visualization API
Sergey,

You are correct. It works much better now that I went to the standard Line chart. This was my original chart and I can't for the life of me remember why I changed it to material.

Thanks for your time!! You guys run a real nice forum and API! Top notch.
Reply all
Reply to author
Forward
0 new messages