-1

私はグーグルチャートを使用していて、データをチャートにフィードするためにPHPファイル(またはHTMLファイル内のphp?)からデータを取得する必要があります。では、これをどのように行うのでしょうか。グラフを描画する前に、必ずデータを取得してください。PHPを使用してMysqlデータベースからデータを取得する方法をすでに理解しました

これが私が変数を入れる必要があるコードです

<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にはそのような変数はありません。つまり、Googleグラフに使用するコードでPHP値を使用できるようにしたいということだと思います。私はゴーグルチャートを使用した経験があまりありませんが、私が見ることができることから、それはいくつかのJavaScriptAPIを使用しています。おそらくあなたが探しているのは、値を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

最も単純な例:index.phpなどのPHPファイル

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

それを行うためのはるかに良い方法は、実際にテキスト/プレーンのタイプでスクリプトタグを開き、そこにデータをダンプすることです。

<!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>

上のスクリプトタグはブラウザによって実行されませんが、下のスクリプトタグは文字列としてその内容にアクセスし、必要な処理を実行できます。

編集:

利点は、.jsファイルを安全に書き込み、静的ファイルとして含めることができるため、ブラウザーによってキャッシュされることです。

また、データスクリプトを1つ含めることができるので、htmlでさえ静的になります=毎回変更されない=ブラウザによってキャッシュされます。

これは、データに対する怠惰なajaxリクエストであり、考慮する必要があることに注意してください。:)

于 2012-07-22T19:35:20.527 に答える