我正在使用JavaScript创建折线图,但无法在Y轴上显示日期...它只能显示数字。有人可以看看我的代码,然后告诉我如何解决它吗?



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

function drawBackgroundColor() {
      var data = new google.visualization.DataTable();
      data.addColumn('number', 'X');
      data.addColumn('number', 'Daily Data Usage');

      data.addRows([
        [0, 0],   [1, 10],  [2, 23],  [3, 17],  [4, 18],  [5, 9],
        [6, 11],
      ]);

      var options = {
        hAxis: {
          title: 'Date'
        },
        vAxis: {
          title: 'Total Data Usage (GB)'
        },
        backgroundColor: '#f1f8e9'
      };

      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"></div>
      

最佳答案

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

function drawBackgroundColor() {
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'X');
      data.addColumn('number', 'Daily Data Usage');

      data.addRows([
        ["Jan 1st, 2016", 0],   ["Jan 2nd, 2016", 10],  ["Jan 3rd, 2016", 23],  ["Jan 4th, 2016", 17],  ["Jan 5th, 2016", 18],  ["Jan 6th, 2016", 9],
        ["Jan 7th, 2016", 11],
      ]);

      var options = {
        hAxis: {
          title: 'Date'
        },
        vAxis: {
          title: 'Total Data Usage (GB)'
        },
        backgroundColor: '#f1f8e9'
      };

      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"></div>
      





您必须解决的是将第一种类型更改为字符串而不是数字。

09-30 22:42