我试图将数据从数据库提取到 Highcharts 极坐标图,当我尝试将其加载到浏览器上时,我在浏览器的检查器工具中收到此错误:
SyntaxError: missing } after property list on Line 78
这是我使用过的代码。
编辑:IVE 第一次输入不同的代码
<?php
$connection = mysqli_connect("localhost","root","","uwguru");
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">
${demo.css}
</style>
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
polar: true,
type: 'line'
},
title: {
text: 'Muscle Summary',
x: -80
},
pane: {
size: '80%'
},
xAxis: {
categories: [
<?php
$sql="SELECT * FROM exercises";
$result= mysqli_query($connection,$sql);
while ($registros = mysqli_fetch_array($result))
{
?>
<?php echo $registros['main_muscle']?>,
<?php
}
?>
],
tickmarkPlacement: 'on',
lineWidth: 0
},
yAxis: {
gridLineInterpolation: 'polygon',
lineWidth: 0,
min: 0
},
tooltip: {
shared: true,
pointFormat: '<span style="color:{series.color}">{series.name}: <b>${point.y:,.0f}</b><br/>'
},
legend: {
align: 'right',
verticalAlign: 'top',
y: 70,
layout: 'vertical'
},
series: [{
name: 'Test',
data: [
<?php
$sql="SELECT * FROM exercises";
$result= mysqli_query($connection,$sql);
while ($registros = mysqli_fetch_array($result))
{
?>
<?php echo $registros['muscle_string']?>,
<?php
}
?>
]
pointPlacement: 'on'}],
});
});
</script>
</head>
<body>
<script src="js/highcharts.js"></script>
<script src="js/highcharts-more.js"></script>
<script src="js/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>
</body>
</html>
渲染的源代码
<
!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<style type="text/css">
${demo.css}
</style>
<script type="text/javascript">
$(function () {
$('#container').highcharts({
chart: {
polar: true,
type: 'line'
},
title: {
text: 'Muscle Summary',
x: -80
},
pane: {
size: '80%'
},
xAxis: {
categories: [
["1","14","13","1","14","1","7","9","16"]
],
tickmarkPlacement: 'on',
lineWidth: 0
},
yAxis: {
gridLineInterpolation: 'polygon',
lineWidth: 0,
min: 0
},
tooltip: {
shared: true,
pointFormat: '<span style="color:{series.color}">{series.name}: <b>${point.y:,.0f}</b><br/>'
},
legend: {
align: 'right',
verticalAlign: 'top',
y: 70,
layout: 'vertical'
},
series: [{
name: 'Test',
data: [
["6","745","7547","4","5","1","2","634234","325235"]
]
pointPlacement: 'on'}
});
});
</script>
</head>
<body>
<script src="js/highcharts.js"></script>
<script src="js/highcharts-more.js"></script>
<script src="js/modules/exporting.js"></script>
<div id="container" style="min-width: 400px; max-width: 600px; height: 400px; margin: 0 auto"></div>
</body>
</html>
最佳答案
检查 while
循环的输出。
此外,请考虑构建数组并使用 json_encode()
将其输出为 JSON 。
请注意,您仍然需要在 JavaScript 端解析 JSON。如果你打算混合使用 javascript 和 PHP,通常最好单独输出 JS 数据(就像作为 JS 逻辑之上的变量),然后在需要的地方解析它。这使得将来维护代码变得更加容易。
<?php
// put this in above the `$('#container').highcharts({` line
//and you can access it as a proper JS variable as you need to.
$sql="SELECT * FROM exercises";
$result= mysqli_query($connection,$sql);
$output = [];
while ($registros = mysqli_fetch_array($result)) {
$output[] = $registros['muscle_string'];
}
echo "var muscleString = JSON.parse('".json_encode($output)."');";
?>
也就是说,您收到的错误是您可能需要这个:
series: [{
name: 'Test',
data: [
["6","745","7547","4","5","1","2","634234","325235"]
]
pointPlacement: 'on'}
最终看起来像这样:
series: [{
name: 'Test',
data: [
["6","745","7547","4","5","1","2","634234","325235"]
], // <-- add comma here
pointPlacement: 'on'
}] // <-- close your array with a closing square bracket
关于javascript - Highcharts 和 PHP,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38252777/