0

I've seen in other posts that googlecharts can be easily zoomed using the option explore. I've been unsuccessfully trying to zoom this chart with the following characteristics: 

google.charts.load('current', {'packages':['corechart']});
        google.charts.setOnLoadCallback(drawChart);
        function drawChart() {
         var data = new google.visualization.DataTable();
          data.addColumn('string', 'time');
          data.addColumn('number', 'value');
          data.addRows([['2001', 12],['2002', 15],['2003', 16],
                        ['2004', 12],['2005', 15],['2006', 19],
                        ['2007', 12],['2008', 25],['2009', 16],
                        ['2010', 22],['2011', 12],['2012', 13]]);

          var options = {
           title: 'Price Chart',
            explorer: {actions: ['dragToZoom', 'rightClickToReset'],axis: 'horizontal',keepInBounds: true,maxZoomIn: 4.0},
             legend: { position: 'bottom' }
             };
          var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
         chart.draw(data, options);
          }
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
        <div id="curve_chart" style="width: 100%; height: 100%"></div>

As shown in the comment of this question, i'm not using the parameter date to pass the data, so the bug doesn't come from here.

I'm guessing that the problem comes ethier from addRows or div.

See fiddle here

Any suggestions?

Alvaro
  • 1,430
  • 2
  • 23
  • 41
  • 1
    the `explorer` option only works with a continuous x-axis (number, date values), not with a discrete x-axis (string values) – WhiteHat Jan 01 '18 at 17:11
  • Totally right @WhiteHat, I didn't lool carefully on the documentation. I just changed it to new Date as [it is suggested](https://developers.google.com/chart/interactive/docs/datesandtimes) and now it works. If you put it as an aswer, I can accep it or I will just close the question ;) – Alvaro Jan 01 '18 at 19:04

0 Answers0