[英]CanvasJs dynamic Data with PHP, mySQL
您好,我在CanvasJs的圖表中遇到障礙。
我只用簡單的代碼就可以得到帶有目標和實際參數的簡單圖表,但我發現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";
}
?>
]
這是我們如何在CanvasJS
顯示MySQL
數據的CanvasJS
,請嘗試這樣。
在這里,創建一個以JSON格式返回數據的PHP服務。 執行AJAX請求到服務器並獲取數據的HTML頁面。 獲取數據后,將呈現一個圖表。
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頁面以獲取數據並呈現圖表
!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>
注意:v1.3及更高版本支持IE8-。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.