Javascript 在google图表中使用php获取值_Javascript_Php_Mysql_Google Visualization

Javascript 在google图表中使用php获取值

javascript php mysql google-visualization

Javascript 在google图表中使用php获取值,javascript,php,mysql,google-visualization,Javascript,Php,Mysql,Google Visualization,这是我第一次使用谷歌图表。我正在使用php/mysql查询结果，然后将它们存储在div中。然后我使用document.getElementByID（'field）.value获取它的值并在图表中使用但不知何故，它似乎不起作用。有什么问题吗？输出为空，不显示任何内容。欢迎所有建议 php部分 include 'dbconnector.php'; include 'class/class.user.php'; $user = new user(); try { $s = $conn->

这是我第一次使用谷歌图表。我正在使用php/mysql查询结果，然后将它们存储在

div

中。然后我使用

document.getElementByID（'field）.value

获取它的值并在图表中使用

但不知何故，它似乎不起作用。有什么问题吗？输出为空，不显示任何内容。欢迎所有建议

php部分

include 'dbconnector.php';
include 'class/class.user.php';
$user = new user();
try
{
  $s = $conn->query("SELECT * from messagequeue where indexid=1");
  $s->setFetchMode(PDO::FETCH_OBJ);
  $row = $s->fetch();
  $s->closeCursor();
}
catch(PDOException $e)
{
  echo $e->getMessage();
}
?>

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      var read = document.getElementById('read').value;
      var unsub = document.getElementById('unsubscribed').value;
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['read',   read],
          ['Unsubscribed',  unsub]
        ]);

        var options = {
          title: 'My Daily Activities',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
    <input type="hidden" name="read" id="read" value="<?php echo $row->read; ?>">
    <input type="hidden" name="unsubscribed" id="unsubscribed" value="<?php echo $row->unsubscribed; ?>">
  </body>
</html>

HTML部分

include 'dbconnector.php';
include 'class/class.user.php';
$user = new user();
try
{
  $s = $conn->query("SELECT * from messagequeue where indexid=1");
  $s->setFetchMode(PDO::FETCH_OBJ);
  $row = $s->fetch();
  $s->closeCursor();
}
catch(PDOException $e)
{
  echo $e->getMessage();
}
?>

<html>
  <head>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      var read = document.getElementById('read').value;
      var unsub = document.getElementById('unsubscribed').value;
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['read',   read],
          ['Unsubscribed',  unsub]
        ]);

        var options = {
          title: 'My Daily Activities',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
    <input type="hidden" name="read" id="read" value="<?php echo $row->read; ?>">
    <input type="hidden" name="unsubscribed" id="unsubscribed" value="<?php echo $row->unsubscribed; ?>">
  </body>
</html>


var read=document.getElementById（'read'）。值；
var unsub=document.getElementById（'unsubscribed'）。值；
load（“可视化”、“1”、{packages:[“corechart”]}）；
setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=google.visualization.arrayToDataTable([
[“任务”，“每天工作小时数”]，
[read'，read]，
[“取消订阅”，取消订阅]
]);
变量选项={
标题：“我的日常活动”，
is3D：是的，
};
var chart=new google.visualization.PieChart（document.getElementById（'PieChart_3d'）；
图表绘制（数据、选项）；
}
如果您正在为$row->read
&$row->unsubscribed
获取正确的值，那么您的for html将js代码放在body标记的末尾，如下所示。它会起作用的
<html>
  <body>
    <div id="piechart_3d" style="width: 900px; height: 500px;"></div>
    <input type="hidden" name="read" id="read" value="<?php echo "100" ?>">
    <input type="hidden" name="unsubscribed" id="unsubscribed" value="<?php echo "200"; ?>">
  </body>
  <script type="text/javascript" src="https://www.google.com/jsapi"></script>
  <script type="text/javascript">
      var read = document.getElementById('read').value;
      var unsub = document.getElementById('unsubscribed').value;
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['read',   read],
          ['Unsubscribed',  unsub]
        ]);

        var options = {
          title: 'My Daily Activities',
          is3D: true,
        };

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


你应该设法缩小问题的范围。检查生成的html，如果这是正确的/你期望的，在这里发布，而不是php。是的，在html下面添加代码修复了我的问题。