0

我正在尝试使用 CanvasJS 和 PHP 创建一个范围面积图以从数据库加载数据。

我创建了 php，它从数据库返回值。这是php：

<?php
header('Content-Type: application/json');
$con = mysqli_connect("127.0.0.1","root","pwd1","db");
// 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 (CalYear+1) as CalYear, concat('[',REPLACE(Year1PercWC,',','.'),',',REPLACE(Year1PercBC,',','.'),']') as ResultSet, concat('Sessies: ',calyear) as Help FROM table where cat='1' and (CalYear+1)<year(now())");
    while($row = mysqli_fetch_array($result))
    {        
        $point = array("x" => $row['CalYear'] , "y" => $row['ResultSet'],"name" => $row['Help']);
         array_push($data_points, $point);        
    }
    echo json_encode($data_points);
}
mysqli_close($con);

?>

结果：

[{"x":"2007","y":"[35.94,35.94]","name":"Sessies: 2006"},{"x":"2008","y":"[27.67, 27.67]","name":"Sessies: 2007"},...,...]

问题是 x 和 y 值（=字符串值）中的引号。CanvasJS 只需要数字来创建图表。所以输出应该是这样的：

[{"x":2007,"y":[35.94,35.94],"name":"Sessies 2006"},{"x":2008,"y":[27.67,27.67],"name":" Sessies 2007"},...,...]

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script type="text/javascript" src="jquery-1.11.2.min.js"></script>   
    <script type="text/javascript" src="jquery.canvasjs.min.js"></script> 
    <script type="text/javascript">
         $(document).ready(function () {
            $.getJSON("TestGraf.php", function (result) {
                var chart = new CanvasJS.Chart("chartContainer", {
                    axisX: { 
                        intervalType: "number", 
                        title: "Year", 
                        interval: 1,
                        valueFormatString: "#"
                    }, 
                    data: [
                        {
                            type: "rangeArea",
                            dataPoints: result
[{"x":2007,"y":[35.94,35.94],"name":"Sessies 2006"},{"x":2008,"y":[27.67,27.67],"name":"Sessies 2007"}] -- This is working fine
                        }
                    ]
                });
                chart.render();
            }); 
        });
    </script>
</head>
<body>
    <div id="chartContainer" style="width: 800px; height: 380px;"></div>
</body>
</html>

我确信必须有一种方法来调整我的 php，以便 x 和 y 作为数字而不是字符串传递，但我真的是 php 新手（有史以来第一次）并且找不到解决方案，尤其是对于第二部分（y）。

谁能告诉我要对 php 和/或 html 文件进行哪些调整？

谢谢，

4

3 回答 3

0

我的回答可能为时已晚，但就像亚历克斯回答的那样，您应该使用 echo json_encode($data_points, JSON_NUMERIC_CHECK);

数字检查是一个选项。见http://php.net/manual/en/json.constants.php

然而，更多地了解范围面积图的工作原理似乎是个问题。范围面积图有一个 X 和 2 个 Y 值。绘制范围需要 2 个 Y 值。如果您只是在浏览器中访问 testgraf.php 文件，您的 JSON 结果应该是：[{x: somevalue, y:[low_value, high_value]}]

您可能必须更改 sql 语句才能获得另一个 y 值。你可以用它做你想做的事。无论如何，这是您应该为您的 php 代码执行的操作：

改变

$point = array("x" => $row['CalYear'] , "y" => $row['ResultSet'],"name" => $row['Help']);

至：

$point = array("x" => $row['CalYear'] , "y" => $row['ResultSet', 'some_value'],"name" => $row['Help']);

如果您的 2 Y 值没有改变，您可能看不到显示的图表线。折线图会更合适吗？

于 2015-02-21T02:17:38.673 回答
0

这可能对你有用：

json_encode($arr, JSON_NUMERIC_CHECK);

于 2015-01-20T13:40:49.637 回答
0

经过反复试验，我找到了以下解决方案：

$result1 = mysqli_query($con, "select (CalYear+1) as CalYear, Year1PercWC, Year1PercBC, calyear as Help FROM table_2 where cat='1' and (CalYear+1)<year(now())");
    while($row = mysqli_fetch_array($result1))
    {        
        $point = array("x" => floatval($row['CalYear']),"y" => array(floatval($row['Year1PercWC']),floatval($row['Year1PercBC'])),"name" => floatval($row['Help']));
        array_push($data_points, $point);        
    }
echo json_encode($data_points);

问题是我需要为数据点数组中的 Y 值创建一个数组。在这个数组中，我可以存储图表所需的 2 个值。

完成此操作后，我需要将所有数值转换为 float_val，以便值周围的引号消失。

谢谢大家的帮助:)

于 2015-02-26T10:57:12.637 回答