-1

我正在使用谷歌图表，我需要从 PHP 文件（或 HTML 文件中的 php？）中获取数据以将数据提供给图表。那么我将如何做到这一点，并确保在绘制图表之前获取数据。我已经在研究如何使用 PHP 从 Mysql 数据库中获取数据

这是我需要放入 vars 的代码

<html>
  <head>
    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

      // Load the Visualization API and the piechart package.
      google.load('visualization', '1.0', {'packages':['corechart']});

      // Set a callback to run when the Google Visualization API is loaded.
      google.setOnLoadCallback(drawChart);

      // Callback that creates and populates a data table,
      // instantiates the pie chart, passes in the data and
      // draws it.
      function drawChart() {

        // Create the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Color');
        data.addColumn('number', 'Votees ');
        data.addRows([
          ['Value from Mysql', 3000],
          ['Value2 from Mysql', 13000],

        ]);

        // Set chart options
        var options = {'title':'Table Name From MySql',
                       'width':600,
                       'height':450};

        // Instantiate and draw our chart, passing in some options.
        var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
  </head>

  <body>
    <!--Div that will hold the pie chart-->
      <div id="chart_div"></div> 


  </body>
</html>
4

3 回答 3

1

HTML 中没有这样的变量 - 我认为您的意思是您希望能够将 PHP 值与您用于 Google 图表的代码一起使用。我没有太多使用 Goggle 图表的经验，但据我所知，它使用了一些 JavaScript API。也许您正在寻找一种将您的值转换为 JavaScript 变量的方法，以便您在处理图表插件时可以使用它们。

这正是 PHP 的用途 - 采用静态静态内容并嵌入脚本为其提供动态内容。

例如，你可以让你的 PHP 初始化一个 JavaScript 变量——

<?php
  $some_php_var = 'overflow';
?>

<script type="text/javascript">
  var stack = '<?php echo $some_php_var; ?>';
</script>

现在您将调用一个 JavaScript 变量stack，其值将是“溢出”。

可以在任何地方使用相同的技术——甚至在变量定义的中间。让我们以您的代码为例-

// Set chart options
var options = {
  'title':'<?php echo $dbResult['Table Name'] ?>',
  'width':600,
  'height':450
};

...

data.addRows([
  ['<?php echo $dbResult['value1']; ?>', 3000],
  ['<?php echo $dbResult['value2']; ?>', 13000],
]);
于 2012-07-22T19:35:18.697 回答
1

您可以像这样从 PHP 中插入值：

  <?php echo $myVariableName; ?>
于 2012-07-22T19:35:19.667 回答
0

最简单的例子：在一个 PHP 文件中，比如 index.php

<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<?php
echo $the_data_as_a_string;
?>
</body>

更好的方法是实际打开一个带有 text/plain 类型的脚本标签并在那里转储数据。

<!DOCTYPE>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<script id="the-data" type="text/html" ><?php echo $the_data_as_a_string; ?></script>
<script type="text/javascript" >
    var data = document.getElementById('the-data').innerHTML;
</script>
</body>

顶部的 script 标签不会被浏览器执行，但底部的标签仍然可以作为字符串访问它的内容，并用它做任何需要的事情。

编辑：

优点是您可以安全地编写 .js 文件并将它们包含为静态文件，因此它们将被浏览器缓存。

您还可以包含数据脚本之一，因此即使 html 也是静态的 = 每次都不会更改 = 由浏览器缓存。

请注意，这只是懒人对数据的 ajax 请求，您应该考虑一下。:)

于 2012-07-22T19:35:20.527 回答