annotation chart date range out of whack with chart range

[dunba...@gmail.com]

Hi, 

I have created an annotation chart but the chart range filter display at the bottom is way bigger than the chart x axis itself (see screenshot). Is there a simple way to fix this so that the two are aligned? 

Below are the annotation chart options I am using: 

var chart = new google.visualization.ChartWrapper({

        chartType: 'AnnotationChart',

        containerId: 'chart_div',

        dataTable: lineTable,

options: {legend:'left',

'title': label+' index',

legendPosition: 'newRow',

displayDateBarSeparator: true,

ui: { snapToData: 'true'},

chart: {

vAxis: {format: '#,###', title: label},

hAxis: {textStyle: {fontSize: 10, fontName: 'Times-Roman'}},

colors: [ "violet", "turquoise"],

                      'width':800,

                      'height':500,

backgroundColor: 'transparent',

crosshair: { trigger: 'focus' },

legend: { position: 'right' },

interpolateNulls: true}

}

});

Thank you, 

Nick 

[Daniel LaLiberte]

Hi Nick,

Your chart.width option is causing the main chart to be the size you specified.  If you want the overall AnnotationChart to have a particular width and height, make sure you specify those options at the top level of the options, not inside the 'chart' suboptions.

--
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/21d65fc7-c831-4033-8d14-7914a672c787%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA

[Nick Dunbar]

Hi Dan, 

That fixed it - obvious when you think about it. A big thank you. 

A couple of things possibly related -

 options: {legend:'left',

'title': label+' index',

Don't seem to work - the legend is on the right and there is no title. How do I fix that? 

And do you know how I can change the font size of the legend for the annotation chart? 

Thanks again, 

Nick 

--
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/9yqnV3H6ofw/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.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJOTSV3xDdvvc6w3TJ%3DoDC2ZfEX1mUPS1%2B718iG7pAGDKA%40mail.gmail.com.

[Daniel LaLiberte]

The AnnotationChart legend at the top of the main chart is done with HTML, so you could modify it with CSS, at least for now.

Not all the normal corechart options are available for the AnnotationChart itself, though many are for the 'chart' suboption.  Check the options documented here:  https://developers.google.com/chart/interactive/docs/gallery/annotationchart#configuration-options  

In particular, 'legend' is not supported at the top level, and the legend is actually implemented outside the main chart.  More work in this area is required.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAO5F7csUR5TcK73XjZCrGFBLQggEQshVjzWF%3DjUpd64KCrTrfA%40mail.gmail.com.

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

[Nick Dunbar]

Ok, thank you for clarifying. Is there any way I can set a minimum zoom size, such as 1 day? Chart range filter in dashboards lets you do that, but I don't know if that works here. 

Thanks, 

NIck 

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAOtcSJMG5AJzc66BMpgLyuhftrxqi_qqd2601MdK2hj4s-aAuA%40mail.gmail.com.

[Daniel LaLiberte]

You can specify 'range' options to modify the ChartRangeFilter.  

There are a couple of undocumented options regarding the zoom buttons, if you want to customize them:  https://groups.google.com/d/msg/google-visualization-api/pzZoRUn5oLA/RQs6RSeJXr4J

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/CAO5F7cvhkwQgmsw-Y6yqBAtMiuQQ3gg1eXN6bfwdGiCSFm73UQ%40mail.gmail.com.

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