диаграммы Google - когда масштаб одной строки уменьшается - PullRequest
Новая
       8

диаграммы Google - когда масштаб одной строки уменьшается

0 голосов
/ 19 октября 2018

У меня есть диаграмма с одной строкой {"cols":[{"id":"time","label":"Time","type":"datetime"},{"id":"Value","label":"Value","type":"number"}],"rows":[{"c":[{"v":"Date(2018,7,31, 14, 49, 48, 0)"}]}]}.Когда я просматриваю график на своем экране, я присутствую с уменьшенной версией.Я предпочитаю что-то, что будет "увеличено" с правильной датой, отображаемой на оси.Как этого достичь?

Я пытался hAxis.viewWindowMode: 'pretty' без удачи.

enter image description here

1 Ответ

0 голосов
/ 19 октября 2018

Вы можете использовать hAxis.viewWindow.min & max, чтобы установить диапазон оси.
и hAxis.ticks, чтобы контролировать, какие метки оси появляются.

см. Следующий рабочий фрагмент ... 

google.charts.load('current', {
  packages:['corechart']
}).then(function () {
  var data = new google.visualization.DataTable({
    "cols":[
      {"id":"time","label":"Time","type":"datetime"},
      {"id":"Value","label":"Value","type":"number"},
      {"id":"Value","label":"Value","type":"number"},
      {"id":"Value","label":"Value","type":"number"},
      {"id":"Value","label":"Value","type":"number"},
      {"id":"Value","label":"Value","type":"number"},
    ],
    "rows":[
      {"c":[{"v":"Date(2018,7,31, 14, 49, 48, 0)"}, {"v": 50}, {"v": 31}, {"v": 16}, {"v": 14}, {"v": 5}]}
    ]
  });

  var dateRange = data.getColumnRange(0);

  var options = {
    chartArea: {
      height: '100%',
      width: '100%',
      top: 24,
      right: 16,
      bottom: 60,
      left: 60
    },
    hAxis: {
      format: 'MM/dd/yyyy HH:mm:ss',
      viewWindow: {
        min: new Date(dateRange.min.getFullYear(), dateRange.min.getMonth(), dateRange.min.getDate() - 30),
        max: new Date(dateRange.max.getFullYear(), dateRange.max.getMonth(), dateRange.max.getDate() + 30)
      },
      ticks: data.getDistinctValues(0),
      title: 'Time'
    },
    vAxis: {
      ticks: [0, 15, 30, 45, 60]
    },
  };

  var chart = new google.visualization.ScatterChart(document.getElementById('chart_div'));
  chart.draw(data, options);
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
...