使用PHP和JavaScript对数据进行图形表示_Javascript_Php

使用PHP和JavaScript对数据进行图形表示

javascript php

使用PHP和JavaScript对数据进行图形表示,javascript,php,Javascript,Php,您好，我需要以图形形式（图表形式）表示数据。为此，我使用了一个jQuery插件。我遇到的问题是，当我使用PHP数组执行此操作时，它对我不起作用我使用的代码在这里 <html> <head> <title>JSChart</title> <script type="text/javascript" src="../../../sources/jscharts.js"></script> </head> &l

您好，我需要以图形形式（图表形式）表示数据。为此，我使用了一个jQuery插件。我遇到的问题是，当我使用PHP数组执行此操作时，它对我不起作用

我使用的代码在这里

<html>
<head>

<title>JSChart</title>

<script type="text/javascript" src="../../../sources/jscharts.js"></script>

</head>
<body>

<div id="graph">Loading graph...</div>
<?php
   $phpArray = array("Peter"=>"35","Ben"=>"37","Joe"=>"43");
 $aa= json_encode($phpArray);

?>
<script type="text/javascript">
    var myData =  <?php echo $aa; ?>;
        alert(myData);
    var colors = ['#AF0202', '#EC7A00', '#FCD200', '#81C714'];
    var myChart = new JSChart('graph', 'bar');
    myChart.setDataArray(myData);
    myChart.colorizeBars(colors);
    myChart.setTitle('Year-to-year growth in home broadband penetration in U.S.');
    myChart.setTitleColor('#8E8E8E');
    myChart.setAxisNameX('');
    myChart.setAxisNameY('%');
    myChart.setAxisColor('#C4C4C4');
    myChart.setAxisNameFontSize(16);
    myChart.setAxisNameColor('#999');
    myChart.setAxisValuesColor('#7E7E7E');
    myChart.setBarValuesColor('#7E7E7E');
    myChart.setAxisPaddingTop(60);
    myChart.setAxisPaddingRight(140);
    myChart.setAxisPaddingLeft(150);
    myChart.setAxisPaddingBottom(40);
    myChart.setTextPaddingLeft(105);
    myChart.setTitleFontSize(11);
    myChart.setBarBorderWidth(1);
    myChart.setBarBorderColor('#C4C4C4');
    myChart.setBarSpacingRatio(50);
    myChart.setGrid(false);
    myChart.setSize(616, 321);
    myChart.setBackgroundImage('chart_bg.jpg');
    myChart.draw();
</script>

</body>
</html>


JSChart
正在加载图形。。。
var myData=；
警报（myData）；
变量颜色=['#AF0202'、'#EC7A00'、'#FCD200'、'#81C714']；
var myChart=newjschart（'graph'，'bar'）；
myChart.setDataArray（myData）；
myChart.colorizeBars（颜色）；
myChart.setTitle（“美国家庭宽带普及率的同比增长”）；
myChart.setTitleColor（“#8E8E8E”）；
myChart.setAxisNameX（“”）；
myChart.setAxisNameY（'%'）；
myChart.setAxisColor（'#c4c4'）；
myChart.setAxisNameFontSize（16）；
myChart.setAxisNameColor（'#999'）；
myChart.setAxisValuesColor（“#7E7E7E”）；
myChart.setBarValuesColor（“#7E7E7E”）；
myChart.setAxisPaddingTop（60）；
myChart.setAxisPaddingRight（140）；
myChart.setAxisPaddingLeft（150）；
myChart.setAxisPaddingBottom（40）；
myChart.setTextPaddingLeft（105）；
myChart.setTitleFontSize（11）；
myChart.SetbaborderWidth（1）；
myChart.SetBaborderColor（“#C4C4”）；
我的图表。挫折压缩比（50）；
myChart.setGrid（false）；
myChart.setSize（616321）；
myChart.setBackgroundImage（'chart_bg.jpg'）；
myChart.draw（）；

下面的代码运行良好。（使用javascript数组）


var myData=新数组（['Mar04-Mar05'，21]，'Mar05-Mar06'，28]，'Mar06-Mar07'，12]，'Mar07-Mar08'，17]）；
警报（myData）；
变量颜色=['#AF0202'、'#EC7A00'、'#FCD200'、'#81C714']；
var myChart=newjschart（'graph'，'bar'）；
myChart.setDataArray（myData）；
myChart.colorizeBars（颜色）；
myChart.setTitle（“美国家庭宽带普及率的同比增长”）；
myChart.setTitleColor（“#8E8E8E”）；
myChart.setAxisNameX（“”）；
myChart.setAxisNameY（'%'）；
myChart.setAxisColor（'#c4c4'）；
myChart.setAxisNameFontSize（16）；
myChart.setAxisNameColor（'#999'）；
myChart.setAxisValuesColor（“#7E7E7E”）；
myChart.setBarValuesColor（“#7E7E7E”）；
myChart.setAxisPaddingTop（60）；
myChart.setAxisPaddingRight（140）；
myChart.setAxisPaddingLeft（150）；
myChart.setAxisPaddingBottom（40）；
myChart.setTextPaddingLeft（105）；
myChart.setTitleFontSize（11）；
myChart.SetbaborderWidth（1）；
myChart.SetBaborderColor（“#C4C4”）；
我的图表。挫折压缩比（50）；
myChart.setGrid（false）；
myChart.setSize（616321）；
myChart.setBackgroundImage（'chart_bg.jpg'）；
myChart.draw（）；

图表对象需要一个2D数组（数组中的数组）

如果您查看HTML源代码，您将看到

json\u encode

为您提供了一个对象，该对象如下所示：

{"Peter", "35", "Ben", "37", "Joe", "43"}

尝试使用以下方法：

function create_2d_array($array) {
    if (count($array) == 0)
        return "[]";

    $results = "[";
    foreach ($array as $key => $value) {
        $results .= "[\"$key\", $value], ";
    }

    $results = substr($results, 0, strlen($results) - 2);
    return $results . "]";
}

在javascript领域：

var myData =  <?php echo create_2d_array($phpArray) . ';'; ?>;

var myData=；

不工作=？图表未在页面中显示？@lozadaOmr:作为在警报框中未向我显示数组数据的输出，它显示“object object”。当我打印（echo）$aa时，它正在打印“{”Peter:“35”，“Ben:“37”，“Joe:“43”}”。我已经尝试过你的建议，但它在AlertBox中显示了1d数组。当我测试它时，我得到了一个2D数组，图表/图形可能只接受数字。请尝试从“我的函数”的值中删除引号（“），并将值改为数字，而不是字符串。我编辑了问题并从函数的值中删除了引号。我有一个名为和年龄为的用户表。如何将其转换为2d数组。

var myData =  <?php echo create_2d_array($phpArray) . ';'; ?>;