javascript - 尝试在谷歌图表中将 y 轴设置为 0

Question

我尝试在此 Google 图表中以多种方式(在 options4 变量中)将 y 轴的最小值设置为 0: https://jsfiddle.net/kurnosem/qn6nrnah/3/

        var options4 = {
            chart: {
                title: 'Temperatura',
                subtitle: 'Últimas 4 horas'
            },
            vAxes: {
                0: {title: 'Temperatura'},
                1: {title: 'Resto'}
            },
            series: {
                0: {targetAxisIndex: 0},
                1: {targetAxisIndex: 0},
                2: {targetAxisIndex: 1},
                3: {targetAxisIndex: 1},
                4: {targetAxisIndex: 1}
            },
            width: 900,
            height: 500
        };

但我不能...有什么想法吗？

Answer 1

您可以为每个 vAxes 使用 viewWindow.min

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

function drawChart() {
  var data4 = new google.visualization.DataTable();
  data4.addColumn('date', 'Hora');
  data4.addColumn('number', 'Temp Casa');
  data4.addColumn('number', 'Temp Fuera');
  data4.addColumn('number', 'Lluvia');
  data4.addColumn('number', 'Humedad');
  data4.addColumn('number', 'Viento');

  data4.addRows([
    [new Date(2016,02,25,19,45),20.375,10.3,0,48,8],
    [new Date(2016,02,25,20,00),20.312,10.3,0,48,8],
    [new Date(2016,02,25,20,15),20.312,10.3,0,48,8],
    [new Date(2016,02,25,20,30),20.5,10.3,0,48,8],
    [new Date(2016,02,25,20,45),20.562,9,0,55,4],
    [new Date(2016,02,25,21,00),20.562,9,0,55,4],
    [new Date(2016,02,25,21,15),20.5,9,0,55,4],
    [new Date(2016,02,25,21,30),20.437,9,0,55,4],
    [new Date(2016,02,25,21,45),20.5,8.9,0,60,8],
    [new Date(2016,02,25,22,00),20.437,8.9,0,60,8],
    [new Date(2016,02,25,22,15),20.375,8.9,0,60,8],
    [new Date(2016,02,25,22,30),20.312,8.9,0,60,8],
    [new Date(2016,02,25,22,45),20.312,9.3,0,64,9],
    [new Date(2016,02,25,23,00),20.25,9.3,0,64,9],
    [new Date(2016,02,25,23,15),20.187,9.3,0,64,9],
    [new Date(2016,02,25,23,30),20.125,9.3,0,64,9]
  ]);

  var options4 = {
    chart: {
      title: 'Temperatura',
      subtitle: 'Últimas 4 horas'
    },
    vAxes: {
      0: {
        title: 'Temperatura',
        viewWindow: {
          min: 0
        }
      },
      1: {
        title: 'Resto',
        viewWindow: {
          min: 0
        }
      }
    },
    series: {
      0: {targetAxisIndex: 0},
      1: {targetAxisIndex: 0},
      2: {targetAxisIndex: 1},
      3: {targetAxisIndex: 1},
      4: {targetAxisIndex: 1}
    },
    width: 900,
    height: 500
  };

  var chart4 = new google.charts.Line(document.getElementById('chart_div4'));
  chart4.draw(data4, google.charts.Line.convertOptions(options4));
}

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