Запустить событие из временной шкалы - PullRequest
0 голосов
/ 14 декабря 2018

Мне не удалось успешно создать событие, щелкнув диаграмму Google Timelien.Ошибка, которую я получаю - диаграмма не определена.Я попробовал несколько ответов на Google.

Пожалуйста, дайте мне знать, если вы можете выяснить ошибку.Если вы понимаете, как использовать метод getselection или как распечатать результаты таблицы.Это также будет полезно.На странице временной шкалы Google нет примеров выбора из временной шкалы.он имеет только выбор из таблицы, гистограммы или круговой диаграммы

<html>
<head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['timeline']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var container = document.getElementById('timeline');
        var chart = new google.visualization.Timeline(container);
        var primaryDataTable = new google.visualization.DataTable();

        primaryDataTable.addColumn({ type: 'string' , id: 'LaborID' });
        primaryDataTable.addColumn({ type: 'string' , id: 'WOID' });
        primaryDataTable.addColumn({ type: 'string' , role: 'tooltip', p : {html:true}});
        primaryDataTable.addColumn({ type: 'date' , id: 'Start' });
        primaryDataTable.addColumn({ type: 'date' , id: 'End' });
        primaryDataTable.addRows([
          [ 'labor1', 'WO-1001' , '<b>Test</b>', new Date(2019, 3, 4), new Date(2019, 3, 5) ],
          [ 'labor1', 'WO-1002' , '<b>Test123</b>', new Date(2019, 3, 5),  new Date(2019, 3, 7) ],
          [ 'labor2', 'WO-2001' , '<i>Test123</i>', new Date(2019, 3, 4),  new Date(2019, 3, 5) ]

          ]);

         var primaryOptions = {
            title : 'Labor Assignment',
            tooltip: {isHtml: true },
            legend: 'none'
         }


        chart.draw(primaryDataTable, primaryOptions);
        google.visualization.events.addListener(chart, 'select', myClickHandler);
      }

    function myClickHandler(){
  var selection = chart.getSelection();
  var message = '';

  for (var i = 0; i < selection.length; i++) {
    var item = selection[i];
    if (item.row != null && item.column != null) {
      message += '{row:' + item.row + ',column:' + item.column + '}';
    } else if (item.row != null) {
      message += '{row:' + item.row + '}';
    } else if (item.column != null) {
      message += '{column:' + item.column + '}';
    }
  }
  if (message == '') {
    message = 'nothing';
  }
  alert('You selected ' + message);
}


    </script>
  </head>
  <body>
  <td><div id="timeline" style="height: 380px; width: 900px"></div></td>
  </body>
  </html>
...