Генерация Google Function Chart с PHP Массив данных из MySQL, но функция не визуализирует - PullRequest
0 голосов
/ 02 октября 2018

Я хочу создать функциональную диаграмму из Google Charts с моими данными, поступающими из базы данных MySQL (localhost).Программа не показывает ошибки, которая противоречит этой теме, при компиляции с помощью средства проверки языка онлайн-разметки, хотя она все еще не создает диаграмму функций при просмотре в браузере.Я проверил свой код и онлайн-источники, в том числе несколько сообщений на эту тему с этого форума, но безрезультатно.Код PHP работает точно.Единственное, о чем я могу сразу подумать, это то, что код JavaScript загружен неправильно.

Часть JavaScript - это слегка измененная версия исходного кода sgoogle linechart (функция type) (https://developers.google.com/chart/interactive/docs/gallery/linechart).

).

Код:

<!Doctype html>
<html>
<body>
<?php
    $servername = "localhost";
    $username = "root";
    $password = "";
    $database = "daylight";
    $conn = new mysqli($servername, $username, $password, $database);
    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    }
        $startdate=time()-(time()%(24*3600))-7200;
        $enddate=$startdate+365*24*3600;
        //echo $startdate."<br>".$enddate;
        $s=strftime("%Y-%m-%d", $startdate);
        $e=strftime("%Y-%m-%d", $enddate);

        $Off = 12;  //Offset
        $A = 4;     //Amplidute
        $light=0;

        for($i=$startdate; $i<=$enddate; $i+=$day)  //genData (works)
        {...}

        $sql_request = "SELECT * FROM `db` WHERE `Datum` >= '$s' And `Datum` <= '$e'";
        $daylight_array=array();
        $date_array=array();
        foreach($conn->query($sql_request) as $row)
        {
            $daylight_array[]=$row["Tageslicht"];
            $date_array[]=$row["Datum"];
            //print $row["Tageslicht"];
        }
        // echo json_encode($date_array);
        // echo json_encode($daylight_array);

?>
<div id="chart" style="width: 900px; height: 500px"></div>

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

    var date = <?php echo json_encode($date_array); ?>;
    var daylight = <?php echo json_encode($daylight_array); ?>;

    function drawChart() {
        var data = google.visualization.arrayToDataTable();
        data.addColumn('string', 'Jahr-Monat-Tag');
        data.addColumn('number', 'Sonnenstunden');

        for(i = 0; i < date.length; i++)
            data.addRow([date[i], daylight[i]]);

        var options = {

          title: 'Sonnenstunden über das Jahr',
          curveType: 'function',
          legend: { position: 'bottom' }
        };

        var chart = new google.visualization.LineChart(document.getElementById('chart'));

        chart.draw(data, options);
  }
</script>
</body>
</html>

Ответы [ 2 ]

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

Я полагаю, что ваш метод инициализации DataTable неверен.Как в документах написано , arrayToDatatable создает и заполняет DataTable, используя один вызов.Поэтому вместо этого вам следует инициализировать DataTable примерно так:

var data = new google.visualization.DataTable();

У вас не было времени попробовать его, но, похоже, это так ...

ЕслиВы настаиваете на использовании метода, который использовали, а затем предоставляете метод с массивом данных согласно документации.

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

Во-первых, кажется, что arrayToDataTable требует передачи параметра.

var data = google.visualization.arrayToDataTable([]);

Во-вторых, дата и дневной свет - неправильный тип.В настоящее время они являются строковыми, когда они должны быть массивами.

var date = JSON.parse(<?php echo JSON.stringify($date_array); ?>);
var daylight = JSON.parse(<?php echo JSON.stringify($daylight_array); ?>);

После отправки этих двух обновлений мне кажется, что они работают нормально.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...