php - 如何在 Javascript 中包含 PHP；谷歌图表 API

Question

我正在使用 google 图表可视化 API。

我在 php 中有一个变量:

`$value` 

其中包含以下内容: ['0',0, 0],['1',65, 35],['2',88, 35],['3',66, 35],['4',35, 35], ['5',99, 100]

我想在 data.addRows 中使用下面的 $value，但我得到的输出是空白

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Period');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addRows([ 

   <?php echo $value ?>

            ]);

    var options = {
      width: 400, height: 240,
      title: 'Company Performance'
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script> 

经过一些研究，我似乎正在尝试使用 Ajax。这样对吗？有没有一种简单的方法可以将值 $value 返回给 data.addRow？？

这里是设置$value的过程:

$i = "0";   
$period = "0";
$chartrow = array();
$unitpriceNumR = 3

while ($i<3)

{


$chartrow[$i] = "['".$period."',".$sPrice[$i].", ".$uPrice[$i]."]";


$period++;
$i++;

}

switch ($currentStage)
{

case "0":

$value = $chartrow[0];
    break;



case "1":

$value = $chartrow[0];  
    break;



case "2":

$value = $chartrow[0].",".$chartrow[1];
    break;


}

在此示例中，如果 $currentStage = "2"，则 $value 设置为 ['0',0, 0],['1',65, 35]

好吧，现在我什至尝试将谷歌代码复制并粘贴到我的文件中，但仍然没有成功看到图表。 (代码取自:http://code.google.com/intl/en-EN/apis/chart/interactive/docs/gallery/linechart.html)

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addRows([
      ['2004', 1000, 400],
      ['2005', 1170, 460],
      ['2006',  860, 580],
      ['2007', 1030, 540]
    ]);

    var options = {
      width: 400, height: 240,
      title: 'Company Performance'
    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
 </script>

使用这段代码

$chartrow = array();


for ($i = 0; $i < 3; $i++ )
{
$chartrow[] = array((string) $i, $sPrice[$i], $uPrice[$i]);
echo $chartrow;

}

导致 $chartrow 在屏幕上显示单词“Array”。

Answer 1

请看the JSON encode PHP 提供的函数。这将使您可以echo 或print 输出 JSON 编码 字符串，JavaScript 将其转换为 native 对象。

$value = array(
    array('0', 0, 0),
    array('1', 65, 35),
    array('2', 88, 35),
    ...
);

...
data.addColumn('number', 'Sales');
data.addColumn('number', 'Expenses');
// Change this and the following lines to:
data.addRows(<?php print json_encode($value); ?>);

编辑

$i = 0; 
$chartrow = array();
$unitpriceNumR = 3

for (; $i < 3; $i++ )
    $chartrow[] = array((string) $i, $sPrice[$i], $uPrice[$i]);

switch ($currentStage) {
    case "0":
    case "1":
        $value = $chartrow[0]; 
        break;

    case "2":
        $value = array_slice($chartrow, 0, 2);

    default:
        // You should have some default value, seriously!!!
}

// Then go the json_encode way, it's safer and easier to maintain!
...
data.addColumn('number', 'Sales');
data.addColumn('number', 'Expenses');

// Change this and the following lines to:
data.addRows(<?php print json_encode($value); ?>);