Google Charts проблема построение с дата-временем

256

01 августа 2017, 15:24

Дано: построение графика пульса, замеряемого в день по несколько раз. Необходимо: Разбить график на промежуток месяц(или неделя) чтобы было видно сразу дни и время.

<script type="text/javascript">
  google.charts.load("current", {"packages":["corechart"]});
  google.charts.setOnLoadCallback(PulseChart);

  function PulseChart() {
    var data = google.visualization.arrayToDataTable([
      ["Время", "Рабочий пульс", "min пульс", "max пульс", "Пульс"],["2017-07-13 12:15", 72, 59,90, 78],["2017-07-13 15:35", 72, 59,90, 73],["2017-07-14 09:00", 72, 59,90, 72],["2017-07-14 12:00", 72, 59,90, 80],["2017-07-18 10:00", 72, 59,90, 120],["2017-07-19 21:00", 72, 59,90, 75],["2017-07-20 09:55", 72, 59,90, 75],["2017-07-20 15:00", 72, 59,90, 75],
    ]);
    var options = {
      title: "Пульс",
      pointSize: 10,
      legend: { position: "bottom" },
      colors: ["#00FF00", "#3366cc", "#dc3912", "#EF5350"],
      series: {
        0: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
        1: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
        2: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
      },
    };
    var chart = new google.visualization.LineChart(document.getElementById("pulse_chart"));
    chart.draw(data, options);
  }

Заранее спасибо за помощь. ПС. В документации этого не нашел, поэтому и обратился сюда.

Answer 1

Нашел решение, правда есть проблема с локализацией на русский, при применении toLocaleString пропадает данное графическое оформление.

function PulseChart() {
    var data = google.visualization.arrayToDataTable([
      ["Время", "Рабочий пульс", "min пульс", "max пульс", "Пульс"],[new Date(2017,6, 13, 12, 15), 72, 59,90, 78],[new Date(2017,6, 13, 15, 35), 72, 59,90, 73],[new Date(2017,6, 14, 09, 00), 72, 59,90, 72],[new Date(2017,6, 14, 12, 00), 72, 59,90, 80],[new Date(2017,6, 15, 09, 00), 72, 59,90, 75],[new Date(2017,6, 16, 22, 00), 72, 59,90, 85],[new Date(2017,6, 17, 15, 00), 72, 59,90, 85],[new Date(2017,6, 18, 10, 00), 72, 59,90, 120],[new Date(2017,6, 19, 21, 00), 72, 59,90, 75],[new Date(2017,6, 20, 09, 55), 72, 59,90, 75],[new Date(2017,6, 20, 15, 00), 72, 59,90, 75],[new Date(2017,6, 21, 09, 00), 72, 59,90, 75],[new Date(2017,6, 22, 15, 00), 72, 59,90, 90],[new Date(2017,6, 23, 08, 00), 72, 59,90, 88],[new Date(2017,6, 24, 08, 00), 72, 59,90, 90],[new Date(2017,6, 25, 12, 00), 72, 59,90, 88],[new Date(2017,6, 26, 06, 00), 72, 59,90, 88],
    ]);
    var options = {
      title: "Пульс",
      pointSize: 10,
      legend: { position: "bottom" },
      colors: ["#00FF00", "#3366cc", "#dc3912", "#EF5350"],
      series: {
        0: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
        1: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
        2: { 
        lineDashStyle: [10],
        pointSize: 0,
        },
      },
    };
    var chart = new google.visualization.LineChart(document.getElementById("pulse_chart"));
    chart.draw(data, options);
  }