Google Chart API JavaScript change max hAxis value using a function

Question

I was wondering, once the chart is loaded, is there a way to change Horizontal Max Window value (date range) with a function WITHOUT having to call the drawChart function again?

For example:

function changeWindow(){
    chart.setOptions(hAxis.viewWindow.max = 2);
}

Original Code:

var chart;
function drawChart() {
   var data = google.visualization.arrayToDataTable([
      ['Year', 'Sales', 'Expenses'],
      ['2004',  1000,      400],
      ['2005',  1170,      460],
      ['2006',  660,       1120],
      ['2007',  1030,      540]
    ]);

    var options = {
      title: 'Company Performance',
      hAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
    };

    chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }

jmac · Accepted Answer

When you draw the chart, Google Visualization will populate three different elements in the target

you have. Taking the sample from Google Playground for Line Chart, this is the code that it generates:

In order to change the size of the chart, you would have to adjust the two internal divs, the size of the SVG itself, and the X/Y coordinates of every single element within that chart. You can do this with Javascript, but it is going to be far easier just to call draw() again.

Google Chart API JavaScript change max hAxis value using a function

Answers (1)

Related Questions