比例不显示在谷歌可视化图表中

Question

我需要为两个轴栏添加标签和刻度。但它们在图像中不可见。有时图表不呈现（不是绘图，通常是第一次请求）。

这是我正在使用的代码：

var data=new google.visualization.DataTable();
    data.addColumn('string','Date');
    data.addColumn('number','Distance');
    var finalData=[];

    for(i=0; i<distanceValues.length;i++){
        var keyPair=[(data[i]['Date']),parseInt(data[i]['Distance'])];
        finalData.push(keyPair);
    }

    data.addRows(finalData);

    var options={
            chart:{
                title:'Distance',
                subtitle:'KM'
            },
            legend: {position: 'none'},
            sortAscending: true,
            sortColumn: 0,
            width: 600,
            height:200,
             axes: {
                  y: {
                    Distance: {label: 'Distance (KM)'}
                  }
             }
    };


    var chart=new google.charts.Line(document.getElementById("testChart"));
    chart.draw(data,options);

如有任何帮助，我们将不胜感激。

Answer 1

您正在使用 legend: {position: 'none'} 请求 Google Charts 隐藏标签。根据您要放置图例的位置，将其删除或更改如下。

legend: {position: 'right'} //top, right, bottom or left

要更改比例类型（如果这是您所要求的），请使用

vAxis: {
        scaleType: 'linear' // linear,log etc
  }

看到这个fiddle或下面的代码sn-p -

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

      function drawChart() {
          var data = google.visualization.arrayToDataTable([
              ['Date', 'Distance'],
              ['Service', 168],
              ['NAME 1', 42],
              ['NAME 2', 36],
              ['NAME 3', 35],
              ['NAME 4', 34],
              ['NAME 5', 30],
              ['NAME 6', 24],
              ['NAME 7', 21],
              ['NAME 8', 18]
          ]);
          var options = {
              legend: {
                  position: 'right'
              },
              chartArea: {
                  right: 150,
              },
              vAxis: {
                  scaleType: 'linear'
              },
          };
          var chart = new google.visualization.LineChart(document.getElementById('chart6_div'));
          chart.draw(data, options);
      }

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart6_div"></div>