具有数据库值的Highcharts动态图

时间:2016-11-22 11:32:55

标签: javascript json highcharts

我正在使用Highchart。我想用数据库值绘制动态图。我用的是json格式。 这是我的json文件:

<?php
// Set the JSON header
header("Content-type: text/json");       
include"../veri_ayar.php";


                $sql = "SELECT Guc FROM Urun ORDER BY KayitTarihi DESC LIMIT 1";
        $result = mysqli_query($conn, $sql);
        $data = array();
        if ($result->num_rows > 0) { 
            while($row = $result->fetch_assoc()) {
                $data[] = $row;
            }
        }
$x = time() * 1000;
foreach($data as $dat)
{
$date .= $dat['Guc'];
}
mysqli_close($conn);

$ret=array($x, $date);
echo json_encode($ret);            
?>

我的输出是:[1479814215000,"43"]

当我写入$ date的控件时,它看起来像:只有43但是当我写入json格式时,它看起来像&#34; 43&#34;。

当我想绘制图形时,我的图形向左移动但图形中没有数据。转移到左边。 这是我的图表脚本:

<script>
var chart;
function requestData() {
    $.ajax({
        url: 'veri-json.php',
        success: function(point) {
            var series = chart.series[0],
                shift = series.data.length > 20; // shift if the series is 
                                                 // longer than 20

            // add the point
            chart.series[0].addPoint(point, true, shift);

            // call it again after one second
            setTimeout(requestData, 1000);    
        },
        cache: false
    });
}

$(document).ready(function() {
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            defaultSeriesType: 'spline',
            events: {
                load: requestData
            }
        },
        title: {
            text: 'Live random data'
        },
        xAxis: {
            type: 'datetime',
            tickPixelInterval: 150,
            maxZoom: 20 * 1000
        },
        yAxis: {
            minPadding: 0.2,
            maxPadding: 0.2,
            title: {
                text: 'Value',
                margin: 80
            }
        },
        series: [{
            name: 'Random data',
            data: []
        }]
    });        
});

</script>

0 个答案:

没有答案