Javascript 如何创建谷歌图表
我想让谷歌图表基于我的mysql。在localhost中,一切正常。没有错误显示。而且它起作用了 但当我试图上传到我的服务器时,它什么也没有显示 这是我的代码:Javascript 如何创建谷歌图表,javascript,php,mysql,charts,google-visualization,Javascript,Php,Mysql,Charts,Google Visualization,我想让谷歌图表基于我的mysql。在localhost中,一切正常。没有错误显示。而且它起作用了 但当我试图上传到我的服务器时,它什么也没有显示 这是我的代码: <script> google.charts.load('current', {'packages':['corechart']}); google.charts.setOnLoadCallback(drawChart); function drawChart() {
<script>
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Date', 'Master Posts'],
<?php
$views = $db->query("SELECT date, COUNT(id_master_post) FROM master_post GROUP BY DAY(date) ASC");
$views->execute();
while ($value2 = $views->fetch()) {
echo "['".substr($value2['date'], 0, -9)."',".$value2['COUNT(id_master_post)']."],";
} ?>
]);
var options = {
title: 'Master Posts Created',
};
var chart = new google.visualization.PieChart(document.getElementById('Views'));
chart.draw(data, options);
}
</script>
<body>
<div id="Views" style="width: 500px; height: 500px; float: left;"></div>
</body>
load('current',{'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
函数绘图图(){
var data=google.visualization.arrayToDataTable([
['日期','主要职位'],
连续使用query
和execute
会造成混乱,而且很可能是错误的-使用execute
方法来执行一个准备好的语句,但您没有创建这样一个准备好的语句。我只是开始格式化您的代码,以便我能够处理它,看看是否能够识别错误,并最终导致错误下面的内容可能有用,也可能没用。我添加了一些评论来帮助你
<?php
/* column headers for chart datatable */
$payload=array( "['Date', 'Post']" );
/* create sql and prepare statement */
$sql='select `date`, count(`idpv`) as `count` from `pageview` group by day( `date` ) desc';
$stmt=$db->prepare( $sql );
if( $stmt ){
/* execute sql statement */
$result=$stmt->execute();
$stmt->store_result();
/* If there are results, process recordset */
if( $result && $stmt->num_rows > 0 ){
/* bind results */
$stmt->bind_result( $date, $count );
/* fetch recordset */
while ( $stmt->fetch() ) {
$date=substr( $date, 0, -9 );
$payload[]="[ '$date', $count ]";
}
$stmt->free_result();
$stmt->close();
}
}
$db->close();
/*
if there were no results this will only have column headers for datatable
this will be used by javascript function
*/
$srcdata='['.implode( ',', $payload ).']';
?>
<html>
<head>
<meta charset='utf-8' />
<title>Google charts & mysqli</title>
<!--
assumed here that the required google api scripts have been loaded
-->
<script>
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback( drawChart );
function drawChart() {
/*
echo the source data as a javascript variable before using in datatable
*/
var srcdata=<?php echo $srcdata; ?>
if( srcdata.length > 1 ){
/*
There are more than just headers in src data array
so add to datatable and create chart
*/
var data = google.visualization.arrayToDataTable( srcdata );
var options = {
title: 'Page Views'
};
var chart = new google.visualization.PieChart( document.getElementById('Views') );
chart.draw( data, options );
}
}
</script>
</head>
<body>
<div id="Views" style="width: 500px; height: 500px; float: left;"></div>
</body>
</html>
和一段伪数据
mysql> select * from pageview limit 10;
+---------------------+------+
| date | idpv |
+---------------------+------+
| 2015-01-11 00:00:00 | 54 |
| 2015-01-17 00:00:00 | 55 |
| 2015-01-20 00:00:00 | 121 |
| 2015-02-07 00:00:00 | 42 |
| 2015-03-08 00:00:00 | 57 |
| 2015-03-09 00:00:00 | 122 |
| 2015-04-01 00:00:00 | 5 |
| 2015-04-12 00:00:00 | 39 |
| 2015-04-19 00:00:00 | 98 |
| 2015-04-20 00:00:00 | 90 |
+---------------------+------+
-
您能给我们看一条错误消息吗?请阅读关于如何询问SO的问题。没有错误消息。请隔离代码开始失败的地方。回显一些战略性设置的检查点。sql查询有where month(date)
但是没有条件这样做-所以它总是正确的-这是预期的吗?$views=$db->query
和$views->execute();
?如果调用execute(),我认为第一个应该是$views=$db->prepare()
查看我的最后一条评论,请更新您的答案。我很感激您投入的时间/精力……我可能会在SELECT循环中而不是在php循环中修剪日期值。编辑得很好。它必须是datetime,因为substr-9
mysql> select * from pageview limit 10;
+---------------------+------+
| date | idpv |
+---------------------+------+
| 2015-01-11 00:00:00 | 54 |
| 2015-01-17 00:00:00 | 55 |
| 2015-01-20 00:00:00 | 121 |
| 2015-02-07 00:00:00 | 42 |
| 2015-03-08 00:00:00 | 57 |
| 2015-03-09 00:00:00 | 122 |
| 2015-04-01 00:00:00 | 5 |
| 2015-04-12 00:00:00 | 39 |
| 2015-04-19 00:00:00 | 98 |
| 2015-04-20 00:00:00 | 90 |
+---------------------+------+
<?php
include __DIR__ . '/db.php'; #pertinent to my system!
/* column headers for chart datatable */
$payload=array( "['Date', 'Post']" );
/* create sql and prepare statement */
$sql='select
`date`,
count(`idpv`) as `count`
from `pageview`
group by day( `date` )
order by date( `date` ) desc';
$stmt=$db->prepare( $sql );
if( $stmt ){
/* execute sql statement */
$result=$stmt->execute();
$stmt->store_result();
/* If there are results, process recordset */
if( $result && $stmt->num_rows > 0 ){
/* store and bind results */
$stmt->bind_result( $date, $count );
/* fetch recordset */
while ( $stmt->fetch() ) {
$payload[]="[ '$date', $count ]";
}
$stmt->free_result();
$stmt->close();
}
}
$db->close();
/*
if there were no results this will only have column headers for datatable
this will be used by javascript function
*/
$srcdata='['.implode( ',', $payload ).']';
?>
<html>
<head>
<meta charset='utf-8' />
<title>Google charts & mysqli</title>
<!--
assumed here that the required google api scripts have been loaded
-->
<script src='https://www.gstatic.com/charts/loader.js'></script>
<script>
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback( drawChart );
function drawChart() {
/*
echo the source data as a javascript variable before using in datatable
*/
var srcdata=<?php echo $srcdata; ?>
if( srcdata.length > 1 ){
/*
There are more than just headers in src data array
so add to datatable and create chart
*/
var data = google.visualization.arrayToDataTable( srcdata );
var options = {
title: 'Page Views'
};
var chart = new google.visualization.PieChart( document.getElementById('Views') );
chart.draw( data, options );
}
}
</script>
</head>
<body>
<div id="Views" style="width: 500px; height: 500px; float: left;"></div>
</body>
</html>