使用PHP，mySQL的CanvasJs动态数据

Question

Hello i have obstacle for my chart from CanvasJs. 您好，我在CanvasJs的图表中遇到障碍。

I just put simple code to get simple chart with parameter target and actual, i found error in dataPoints: i think the problem just wrong statements. 我只用简单的代码就可以得到带有目标和实际参数的简单图表，但我发现dataPoints中存在错误：我认为问题只是错误的陈述。

this my error code: 这是我的错误代码：

dataPoints: [ 数据点： [

<?PHP $mkmi3= mysql_query("SELECT * FROM monthkpimontindv WHERE idKpiDetIndv='$q'");

    While ($mkmi4= mysql_fetch_assoc($mkmi3)) 

        {

            echo "{ label: ".$mkmi4['period'].", y: ".$mkmi4['actual']." },\n";

        }
?>

Answer 1

Here is how we can display MySQL data in CanvasJS , Try like this. 这是我们如何在CanvasJS显示MySQL数据的CanvasJS ，请尝试这样。

Here, Create a PHP service that returns data in JSON format. 在这里，创建一个以JSON格式返回数据的PHP服务。 HTML page that does AJAX request to the server and fetches the data. 执行AJAX请求到服务器并获取数据的HTML页面。 After getting the data, it renders a Chart. 获取数据后，将呈现一个图表。

PHP Service to return JSON Data PHP服务返回JSON数据

<?php

header('Content-Type: application/json');

$con = mysqli_connect("127.0.0.1","user","password","canvasjssampledb");

// Check connection
if (mysqli_connect_errno($con))
{
    echo "Failed to connect to DataBase: " . mysqli_connect_error();
}else
{
    $data_points = array();

    $result = mysqli_query($con, "SELECT * FROM sales");

    while($row = mysqli_fetch_array($result))
    {        
        $point = array("label" => $row['product'] , "y" => $row['total_sales']);

        array_push($data_points, $point);        
    }

    echo json_encode($data_points, JSON_NUMERIC_CHECK);
}
mysqli_close($con);

?>

HTML Page to Fetch Data and render Chart HTML页面以获取数据并呈现图表

!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script src="jquery.js"></script>
    <script src="canvasjs.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {

            $.getJSON("data.php", function (result) {

                var chart = new CanvasJS.Chart("chartContainer", {
                    data: [
                        {
                            dataPoints: result
                        }
                    ]
                });

                chart.render();
            });
        });
    </script>
</head>
<body>

    <div id="chartContainer" style="width: 800px; height: 380px;"></div>

</body>
</html>

Note:: IE8- is supported in v1.3 and above. 注意：v1.3及更高版本支持IE8-。

使用PHP，mySQL的CanvasJs动态数据

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-02-23 05:30:22

使用PHP，mySQL的CanvasJs动态数据

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-02-23 05:30:22

解决方案1
0 已采纳 2016-02-23 05:30:22