Hi Marc, Glad to hear you are trying the new Material bar chart. I believe you might have missed this section of the docs ( https://developers.google.com/chart/interactive/docs/gallery/barchart):
The Material Charts are in *beta*. The appearance and interactivity are largely final, but the way options are declared is not. If you are converting a Classic Bar Chart to a Material Bar Chart, you'll want to replace this line: *chart.draw(data, options);* ...with this: chart.draw(data, google.charts.Bar.convertOptions(options)); On Fri, Oct 31, 2014 at 7:13 AM, Marc Tober <[email protected]> wrote: > Hi, > > I try to use a Material Chart from the "bar" package to create a simple > vertical bar chart. > > I get the chart displayed, however I am unable to apply even the simplest > configuration options. Most of them simply do not show any effect, not even > an error message. > > I am trying to display the Oil consumption per hour of my heating. > > Here are is part of the coding I am using: > > <script type="text/javascript" src="https://www.google.com/jsapi > "></script> > > google.load("visualization", "1.1", {packages:["bar", "gauge"]}); > > var options_bars = { > width:800, > height:425, > legend: { > position: 'none' > }, > chart: { > title: 'Ölverbrauch', > subtitle: ' Stundengenaue Verteilung des Ölverbrauchs' > } > }; > > var data_bars = new google.visualization.arrayToDataTable([ > ['Zeit', 'Ölverbrauch je Stunde in [l]'], > [0, 1.2], > [1, 1.2], > [2, 1.2], > [3, 1.2], > [4, 1.2], > [5, 2.2] > ]); > > var chart_bars = new > google.charts.Bar(document.getElementById('chart_bar_day')); > > With this I get the basic bar chart, which I want to improve. I am unable > to apply even the simplest options. Here are some examples: > > (1) Try to increase the max value of the y-axis > The chart automatically chooses 2,5 as max value. > I think vAxis.maxValue should be the correct option, so I add this to my > > var options_bars = { > width:800, > height:425, > legend: { > position: 'none' > }, > chart: { > title: 'Ölverbrauch', > subtitle: ' Stundengenaue Verteilung des Ölverbrauchs' > }, > vAxis: { > maxValue:5 > } > }; > > This changes nothing whatsoever in the bar chart. I also tried hAxis. > > (2) try to get a frame around the chart: > chartArea: { > backgroundColor: { > stroke:'#666', > strokeWidth:4 > } > }, > > (3) try to manipulate gridlines: > vAxis: { > gridlines: { > color:'red', > count:10 > } > hAxis: { > gridlines: { > color:'red', > count:10 > } > > This changes nothing whatsoever in the bar chart. > > I am sure, I oversaw some simple syntax or explanation. > Any help or hint is appreciated. > > Thanks a lot! > > -- > 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 [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > For more options, visit https://groups.google.com/d/optout. > -- Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> - 978-394-1058 [email protected] <[email protected]> 5CC, Cambridge MA [email protected] <[email protected]> 9 Juniper Ridge Road, Acton MA -- 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 [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
