Javascript 该图形在使用PHP的highcharts中不可见
我试图通过使用highcharts.com中的示例代码来使用php获取highcharts。但我的线图在加载代码时不可见。让我知道任何解决办法。 下面是我的代码： index.phpJavascript 该图形在使用PHP的highcharts中不可见,javascript,php,jquery,html,highcharts,Javascript,Php,Jquery,Html,Highcharts,我试图通过使用highcharts.com中的示例代码来使用php获取highcharts。但我的线图在加载代码时不可见。让我知道任何解决办法。 下面是我的代码： index.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Using Highcharts with PHP and MySQL</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2 /jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript" src="js/themes/gray.js"></script>
<script type="text/javascript">
var chart;
$(document).ready(function() {
var options = {
chart: {
renderTo: 'container',
defaultSeriesType: 'line',
marginRight: 130,
marginBottom: 25
},
title: {
text: 'Hourly Visits',
x: -20 //center
},
subtitle: {
text: '',
x: -20
},
xAxis: {
type: 'datetime',
tickInterval: 3600 * 1000, // one hour
tickWidth: 0,
gridLineWidth: 1,
labels: {
align: 'center',
x: -3,
y: 20,
formatter: function() {
return Highcharts.dateFormat('%l%p', this.value);
}
}
},
yAxis: {
title: {
text: 'Visits'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return Highcharts.dateFormat('%l%p', this.x-(1000*3600)) +'-'+ Highcharts.dateFormat('%l%p', this.x) +': <b>'+ this.y + '</b>';
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: [{
name: 'Count'
}]
}
// Load data asynchronously using jQuery. On success, add the data
// to the options and initiate the chart.
// This data is obtained by exporting a GA custom report to TSV.
// http://api.jquery.com/jQuery.get/
jQuery.get('data.php', null, function(tsv) {
var lines = [];
traffic = [];
try {
// split the data return into lines and parse them
tsv = tsv.split(/\n/g);
jQuery.each(tsv, function(i, line) {
line = line.split(/\t/);
date = Date.parse(line[0] +' UTC');
traffic.push([
date,
parseInt(line[1].replace(',', ''), 10)
]);
});
} catch (e) { }
options.series[0].data = traffic;
chart = new Highcharts.Chart(options);
});
});
</script>
</head>
<body>
<div id="container" style="width: 100%; height: 400px; margin: 0 auto"></div>
</body>
</html>
在PHP和MySQL中使用Highcharts
var图；
$（文档）.ready（函数（）{
变量选项={
图表：{
renderTo:'容器'，
defaultSeriesType:“行”，
marginRight:130，
marginBottom:25
},
标题：{
文本：'每小时访问'，
x:-20/中心
},
副标题:{
文本：“”，
x:-20
},
xAxis：{
键入：“日期时间”，
滴答声间隔：3600*1000，//一小时
宽度：0，
网格线宽度：1，
标签：{
对齐：'居中'，
x:-3，
y:20，
格式化程序：函数（）{
返回Highcharts.dateFormat（“%l%p”，此.value）；
}
}
},
亚克斯：{
标题：{
文本：“访问”
},
绘图线：[{
值：0，
宽度：1，
颜色：'#808080'
}]
},
工具提示：{
格式化程序：函数（）{
返回Highcharts.dateFormat（'%1%p'，this.x-（1000*3600））+'-'+Highcharts.dateFormat（'%1%p'，this.x）+'：'+this.y++'；
}
},
图例：{
布局：“垂直”，
对齐：“右”，
垂直排列：“顶部”，
x:-10，
y:100，
边框宽度：0
},
系列：[{
姓名：“计数”
}]
}
//使用jQuery异步加载数据。成功后，添加数据
//选择选项并启动图表。
//该数据通过将GA自定义报告导出到TSV获得。
// http://api.jquery.com/jQuery.get/
get（'data.php'，null，函数（tsv）{
var行=[]；
流量=[]；
试一试{
//将返回的数据拆分为行并对其进行分析
tsv=tsv.分割（/\n/g）；
jQuery.each（tsv，函数（i，行）{
line=line.split（/\t/）；
date=date.parse（第[0]+'UTC'行）；
交通，推([
日期，
parseInt（第[1]行）。替换（'，'，''），10）
]);
});
}捕获（e）{}
options.series[0]。数据=流量；
图表=新的高点图表。图表（选项）；
});
});
<?php
$con = mysqli_connect("localhost","root","Verizon123");
if ($con->connect_error) { die("Connection failed: " . $con->connect_error); } echo "Connected successfully", "<br />";
mysqli_select_db($con,"douresult");
$result = mysqli_query($con,"SELECT * FROM highcharts_php");
while($row = mysqli_fetch_array($result)) {
echo $row['timespan'] . "\t" . $row['visits']. "\n"."<br />";
}
mysqli_close($con);
?>
2011年7月1日星期五23:00:00 1272是否完成了任何基本调试，如检查错误控制台？检查你的php代码是否真的输出了什么？Highcharts没有显示可能有很多原因，但是最常见的是它没有接收到数据，所以它无法构建图表，所以正如Marc所建议的，查看错误日志，看看你是否能找到与此相关的内容。它正确地获得了上面的输出。我不熟悉这一点，你能帮我检查错误日志吗？在图表上，我可以看到顶部的“每小时访问次数”和右侧的“计数”以及左侧的“访问次数”，但不是线条……它应该显示如下图表：