Google Bar Chart Display NaN: NaN при наведении курсора - PullRequest
Новая
       10

Google Bar Chart Display NaN: NaN при наведении курсора

0 голосов
/ 28 ноября 2018

Я создаю столбчатую диаграмму Google, заполняющую ее с помощью данных MYSQL, и кажется, что она заполняется правильно, но когда я нахожу указатель мыши на столбец, он показывает NaN: значение NaN. Я не совсем уверен, почему

Я искал, но не знаюКажется, я не смогу найти кого-то еще с такой проблемой, так что я думаю, что это может быть просто так, как я ее написал,

Я создал sqlfiddle просто для отображения кода, чтобы сохранить ввод его здесь иКартинка внизу показывает, как она выглядит 

<script>
google.charts.load('current', {
  packages: ['bar', 'corechart']
}).then(function () {
 var dataRaw = google.visualization.arrayToDataTable([  
                      ['Location', 'Date', 'Customer Count'],  
                      <?php
    $connect = mysqli_connect("localhost", "user", "password", "test");
if(isset($_POST['but_search'])){
      $fromDate = $_POST['fromDate'];
      $endDate = $_POST['endDate'];

      if(!empty($fromDate) && !empty($endDate)){
         $emp_query .= " and date_of_join 
                      between '".$fromDate."' and '".$endDate."' ";
      }
    }  
    $query = "select date,location,count(location) as customer_count from filter where date between '".$fromDate."' and '".$endDate."' group by date,location";  
    $result = mysqli_query($connect, $query);  
                      while($row = mysqli_fetch_array($result))  
                      {  
                           echo "['".$row["location"]."', '".$row["date"]."', '".$row["customer_count"]."'],"; 
                      }  
                      ?> 
                 ]);


// build new data table
var data = new google.visualization.DataTable();
data.addColumn('string', 'date');

// add columns and rows
var colors = [];
var date = null;
var colIndex;
var rowIndex;
var timeofday;
for (var i = 0; i < dataRaw.getNumberOfRows(); i++) {
// add row date
if (dataRaw.getValue(i, 1) !== date) {
  date = dataRaw.getValue(i, 1);
  rowIndex = data.addRow();
  data.setValue(rowIndex, 0, date);
  colIndex = 1;
}
// add location column
if (data.getNumberOfColumns() === colIndex) {
  data.addColumn('timeofday', dataRaw.getValue(i, 0));
  colors.push(dataRaw.getValue(i, 0));
}
// build timeofday from time string
timeofday = dataRaw.getValue(i, 2).split(':').map(function (time) {
  return parseInt(time);
});
timeofday.push(0);
// add location value
data.setValue(rowIndex, colIndex, timeofday);
colIndex++;
}


// classic chart
var chart = new google.visualization.ColumnChart(document.getElementById('barchart'));
chart.draw(data, {
colors: colors,
theme: 'material',
title: 'data',
backgroundColor: '#E4E4E4',
});
});
</script>

http://sqlfiddle.com/#!9/bcdf69/5 Таблица

...