javascript - Google Charts - how to add a fixed scale on an axis -


i'm having trouble scaling chart correctly. chart represents data every hour of day in 24 hour format, meaning need numbers 0-24 on linechart.

i've tried adding logscale, minvalue , maxvalue properties haxis, nothing working.

as can see on chart, hour axis not spanning fixed axis 0-24 hours, instead 9-15 hours.

the chart

i have 3 rows in data set, reside on hours 9, 14 , 15. despite this, lines spanning 9-14 if have values; there no data there, lines should running along bottom @ 0 between these 2 points.

how can put fixed horizontal scale on chart, , have individual values on lines each hour?

here's code:

google.load('visualization', '1.1', {packages: ['line']}); google.setonloadcallback(drawchart);  function drawchart() {     var json = $.getjson('my json data link', function(data)     {         var chartstructure = new google.visualization.datatable();         var chartdata = [];          chartstructure.addcolumn('number', 'hour');         chartstructure.addcolumn('number', 'pageviews');         chartstructure.addcolumn('number', 'unique pageviews');         chartstructure.addcolumn('number', 'sales');         chartstructure.addcolumn('number', 'earnings in $aud');          (i = 0; < data.length; i++)         {             chartdata[i] = [];             chartdata[i][0] = parseint(data[i].hour);             chartdata[i][1] = parsefloat(data[i].profit);             chartdata[i][2] = parsefloat(data[i].profit);             chartdata[i][3] = parsefloat(data[i].sales);             chartdata[i][4] = parsefloat(data[i].profit);             // these chartdata values not correct because testing              chartstructure.addrows(chartdata);         }          var options = {             haxis: {                 'minvalue': 0,                  'maxvalue': 24             }         };          var chart = new google.charts.line(document.getelementbyid('todays-total-sales'));          chart.draw(chartstructure, options);     }); }  $(window).resize(function() {     drawchart(); }); 

use viewwindow.

haxis: {       title: 'time',       viewwindow:{           max:1000,           min:-100       }     }, 

jsfiddle

update

if using materialcharts please note options have different syntax!

in order able use classic options, need change

chart.draw(data, options);  

to

chart.draw(data, google.charts.line.convertoptions(options)); 

here updated fiddle.


Comments

Popular posts from this blog

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

linux - disk space limitation when creating war file -

How to provide Authorization & Authentication using Asp.net, C#? -