Chart.js 数据数组使用 PHP、MySQL。如何从 JSON 数组定义数据源?
Posted
技术标签:
【中文标题】Chart.js 数据数组使用 PHP、MySQL。如何从 JSON 数组定义数据源?【英文标题】:Chart.js data array using PHP, MySQL. How to define datasource from JSON array? 【发布时间】:2013-08-01 19:52:25 【问题描述】:这是我的第一个问题。如有错误,敬请原谅。
我正在尝试使用带有 php 和 mysql 数据的 chart.js 绘制图表。我打算绘制的图表是一个简单的垂直条形图,出生年份与出生人数。当我显示数组 $BIRTH_YEAR 和 $COUNTS 时,我可以看到这些值。在 json_encode($data_array) 之前,我能够直截了当。当我尝试在 javascript 上使用这个编码数组时,我没有得到任何输出,一个空白页!这是我的代码。
while ($row = mysql_fetch_array($result, MYSQL_ASSOC))
$data[] = array(
$row['BIRTH_YEAR']=>$row['counts'],
);
$BIRTH_YEAR[]=$row['BIRTH_YEAR'];
$COUNTS[]=$row['counts'];
// JSON arrays for labels and counts
$js_labels = json_encode($BIRTH_YEAR,true);
$js_cols = json_encode($COUNTS,true);
var barChartData =
labels : '<?php echo $js_labels; ?>',
datasets : [
fillColor : "rgba(220,220,220,0.5)",
strokeColor : "rgba(220,220,220,1)",
data : '<?php echo $js_cols; ?>'
]
var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Bar(barChartData);
我已经在我的页面中包含了所有其他必需的 html 元素。当我使用 chart.js 示例文件时,我能够看到图表。唯一的问题是我不确定如何在 javascript 数据中包含数组:部分。提前致谢。
【问题讨论】:
【参考方案1】:你可以使用$js_cols = json_encode($COUNTS,JSON_NUMERIC_CHECK);
然后
data : <?php echo print_r($js_cols,true); ?>
【讨论】:
以上是关于Chart.js 数据数组使用 PHP、MySQL。如何从 JSON 数组定义数据源?的主要内容,如果未能解决你的问题,请参考以下文章
在chart.js javascript中显示php数组数据
从 php 循环中绘制多个图表(Chart.js)以读取多个文件
Angular 10 - Chart.js 在运行时使用 convas id 在数组中绘制图表