如何使 Google 图表上的线条从点 0、0 开始（angular-google-图表）

Question

我想让折线图的线条从图表的左下部分开始，然后上升到第一项（右），而不是仅仅从第一项（左）开始。

我尝试添加 [null, 0, 0]，但这只会创建一个新列，在 HAxis 的开头和行的开头之间添加一些 space。

Answer 1

为了使直线从零开始，at 点必须存在于 0, 0

但我认为使用连续（数字）与离散（字符串）的 x 轴会有更好的运气

我们可以使用对象表示法在显示字符串的同时提供数值
其中 v 是值，f 是格式化值

{v: 1, f: 'Value 1'}

我们可以在数据 table 值和轴刻度中使用它。

请参阅以下工作片段...

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['Values', 'Line 1', 'Line 2'],
    [{v: 0, f: ''}, 0, 0],
    [{v: 1, f: 'Value 1'}, 20, 10],
    [{v: 2, f: 'Value 2'}, 40, 50],
    [{v: 3, f: 'Value 3'}, 50, null]
  ]);

  var options = {
    hAxis: {
      ticks: [  // ticks to display on the x-axis
        {v: 0, f: ''},
        {v: 1, f: 'Value 1'},
        {v: 2, f: 'Value 2'},
        {v: 3, f: 'Value 3'},
        {v: 4, f: ''}
      ],
      title: 'HAxis'
    },
    vAxis: {
      title: 'VAxis'
    },
    curveType: 'function'
  };

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

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>

（显然，上面的代码片段不是 angular，但效果相同...）

如何使 Google 图表上的线条从点 0、0 开始（angular-google-图表）

How to makes lines on Google Charts Linechart to start from point 0, 0 (angular-google-charts)

charts

google-visualization