Google折线图'dragToZoom'属性在版本45上不起作用

问题描述 投票:0回答:2

在Google折线图中,当我使用当前版本时>

google.charts.load('current', {
            packages: ['corechart']
 })

选项中的拖动以缩放属性不起作用

  var options = {
            animation: {
                duration: 800,
                startup: true
            },
            pointSize: 2,
            hAxis: {
                title: xAxisKey,
                format: 'HH:mm (dd-MMM)',
                textStyle: {
                    fontSize: 11,
                }
                // slantedText: true,  /* Enable slantedText for horizontal axis */
                // slantedTextAngle: 0 /* Define slant Angle */
            },
            vAxis: {
                title: yAxisKey
            },
            timeline: {
                groupByRowLabel: true
            },
            explorer: {
                actions: ['dragToZoom', 'rightClickToReset'],
                axis: 'horizontal',
                keepInBounds: true,
                maxZoomIn: 4.0
            },
            colors: ['#47acb1', '#f26522', '#f9aa7b', '#a5a8aa', '#676766', '#add5d7'],
            crosshair: {
                color: '#000',
                trigger: 'selection'
            }
        };

但是当我用]进行相同操作时>

 google.charts.load('45', {
            packages: ['corechart']
 })

正在运行。

但是“当前”版本的问题是我无法绘制单点数据。它引发错误无法读取null的getTime()属性

在google折线图中,当我使用当前版本google.charts.load('current',{包:['corechart']})时,选项中的zoom拖动属性不起作用var options ...] >

      google.charts.load('45', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
         ['Year', 'Sales'],
          [new Date(2001,01,01),  30],
          [new Date(2002,01,01),  70],
          [new Date(2003,01,01),  45],
          [new Date(2004,01,01),  99],
          [new Date(2005,01,01),  22],
          [new Date(2006,01,01),  0],
          [new Date(2007,01,01),  89],
          [new Date(2008,01,01),  30],
          [new Date(2009,01,01),  32],
          [new Date(2010,01,01),  77],
          [new Date(2011,01,01),  67],
          [new Date(2012,01,01),  22],
          [new Date(2013,01,01),  23],
          [new Date(2014,01,01),  25],
          [new Date(2015,01,01),  9],
          [new Date(2016,01,01),  10],
          [new Date(2017,01,01),  77],
          [new Date(2018,01,01),  47],
          [new Date(2019,01,01),  22],
          [new Date(2020,01,01),  23],
          [new Date(2022,01,01),  12],
          [new Date(2023,01,01),  9],
          [new Date(2024,01,01),  10],
          [new Date(2025,01,01),  10],
          [new Date(2026,01,01),  77],
          [new Date(2027,01,01),  67],
          [new Date(2028,01,01),  22],
          [new Date(2029,01,01),  23],
          [new Date(2030,01,01),  34],
          [new Date(2031,01,01),  9],
          [new Date(2032,01,01),  10],
          [new Date(2033,01,01),  22],
          [new Date(2034,01,01),  23],
          [new Date(2035,01,01),  19],
          [new Date(2036,01,01),  12],
          [new Date(2037,01,01),  10],
          [new Date(2038,01,01),  17],
          [new Date(2039,01,01),  6],
          [new Date(2040,01,01),  6],
          [new Date(2041,01,01),  22],
          [new Date(2042,01,01),  23],
          [new Date(2043,01,01),  71],
          [new Date(2044,01,01),  9],
          [new Date(2045,01,01),  10],
          [new Date(2046,01,01),  78],
          [new Date(2047,01,01),  67],
          [new Date(2048,01,01),  22],
          [new Date(2049,01,01),  23],
          [new Date(2050,01,01),  12],
          [new Date(2051,01,01),  13],
          [new Date(2052,01,01),  10],
          [new Date(2053,01,01),  77],
          [new Date(2054,01,01),  47],
          [new Date(2055,01,01),  22],
          [new Date(2056,01,01),  23],
          [new Date(2057,01,01),  12],
          [new Date(2058,01,01),  9],
          [new Date(2059,01,01),  10],
          [new Date(2060,01,01),  10],
          [new Date(2061,01,01),  76],
          [new Date(2062,01,01),  67],
          [new Date(2063,01,01),  22],
          [new Date(2064,01,01),  23],
          [new Date(2065,01,01),  34],
          [new Date(2066,01,01),  9],
          [new Date(2067,01,01),  10],
          [new Date(2068,01,01),  22],
          [new Date(2069,01,01),  23],
          [new Date(2070,01,01),  19],
          [new Date(2071,01,01),  12],
          [new Date(2072,01,01),  10],
          [new Date(2073,01,01),  17],
          [new Date(2074,01,01),  6],
          [new Date(2075,01,01),  6],
          [new Date(2076,01,01),  22],
          [new Date(2077,01,01),  23],
          [new Date(2078,01,01),  70],
          [new Date(2079,01,01),  9],
          [new Date(2080,01,01),  10],
          [new Date(2081,01,01),  72],
          [new Date(2082,01,01),  67],
          [new Date(2083,01,01),  22],
          [new Date(2084,00,04),  23],
          [new Date(2085,01,01),  12],
          [new Date(2086,01,01),  13]
        ]);

        var options = {
          title: 'Company Performance',
          hAxis: {title: 'Year',  titleTextStyle: {color: '#333'},
                   slantedText:true, slantedTextAngle:80},
          vAxis: {minValue: 0},
          explorer: { 
            actions: ['dragToZoom', 'rightClickToReset'],
            axis: 'horizontal',
            keepInBounds: true,
            maxZoomIn: 4.0},
          colors: ['#D44E41'],
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
       <div id="chart_div" style="width: 500px; height: 300px;"></div>
   

我找到了解决问题的方法。我改变了,

google.charts.load('45', {
            packages: ['corechart']
})

to,

google.charts.load('45.2', {
                packages: ['corechart']
})

在版本45.2中,两个问题均已解决

angular charts google-visualization
2个回答
0
投票


0
投票

我找到了解决问题的方法。我改变了,

© www.soinside.com 2019 - 2024. All rights reserved.