我正在尝试第一次使用Chart.js。我已经知道它是如何工作的,但是现在我想将数据从php传递到javascript。
这就是我所拥有的:
的PHP
//send the string values to javascript
$grade_range_string = mb_substr($grade_range_string, 0, -2);
$percentage_count_string = implode(", ", $percentage_count_array);
//chart colors
$grade_chart_colors_string = "";
$grade_chart_colors_array = grade_chart_colors();
foreach ($grade_chart_colors_array as $color) {
$grade_chart_colors_string .= "'".$color."'" . ", ";
}
$grade_chart_colors_string = mb_substr($grade_chart_colors_string, 0, -2);
的HTML
<span id="grade_range_string" data-value="<?php echo $grade_range_string; ?>"></span>
<span id="percentage_count_string" data-value="<?php echo $percentage_count_string; ?>"></span>
<span id="grade_chart_colors_string" data-value="<?php echo $grade_chart_colors_string; ?>"></span>
<canvas id="broadsheet_piechart"></canvas>
Javascript:
// Pie chart
if ( $('#broadsheet_piechart').length ) {
var grade_range_string = $('#grade_range_string').attr('data-value');
var percentage_count_string = $('#percentage_count_string').attr('data-value');
var grade_chart_colors_string = $('#grade_chart_colors_string').attr('data-value');
//debug
console.log(grade_range_string);
console.log(percentage_count_string);
console.log(grade_chart_colors_string);
var ctx = document.getElementById("broadsheet_piechart");
var data = {
datasets: [{
data: [percentage_count_string],
backgroundColor: [grade_chart_colors_string],
label: 'My dataset' // for legend
}],
labels: [grade_range_string]
};
var broadsheet_piechart = new Chart(ctx, {
data: data,
type: 'pie',
options: {
animation: {
duration: 0
}
}
});
}
//debug
console.log(data);
在控制台窗口中,3个变量grade_range_string
,percentage_count_string
,grade_chart_colors_string
返回格式化后的数据,但是数据集data变量将数据括在双引号中,如下所示:
data: ["'Item 1', 'Item 2', 'Item 3', 'Item etc'"]
backgroundColor
和labels
相同。
这毁了我的馅饼...
为什么会发生这种情况,如何删除引号?有没有更好的方法来实现这一目标?谢谢。
javascript参考方案
在PHP中,你可以做到这一点
//send the string values to javascript
$grade_range_string = mb_substr($grade_range_string, 0, -2);
$percentage_count_string = implode(", ", $percentage_count_array);
//chart colors
$grade_chart_colors_string = "";
$grade_chart_colors_array = grade_chart_colors();
// New Code
$grade_chart_colors_string = join(",", $grade_chard_colors_array); // will join all the colors with ','
//for eg. $grade_chart_colors_string = "red,blue,yellow"
$grade_chart_colors_string = mb_substr($grade_chart_colors_string, 0, -2);
在javascript中将字符串返回数组
var grade_chart_colors_string = $('#grade_chart_colors_string').attr('data-value');
var grade_chart_colors_array = grade_chart_colors_string.split(',');
那应该将其作为数据数组传递。你可以这样休息
编码JSON数据以保留json格式 - javascript由于JSON值是动态生成的,并且其中的值是基于用户输入的,因此,如果用户在字符串中输入了不可接受的字符(如"),则会使json无效。就像是:{ "tag" : "demo", "value": "user " input" } 有没有一种方法可以编码或转义JS…
执行onclick时获得意外令牌 - javascript我正在使用onclick事件从PHP调用JS函数。这是我的代码:我在一个函数中,因此我需要通过PHP来完成它,因为然后我会返回:$html = '<input type="checkbox" checked value="1" id="setGetSku" name="se…
如何从客户端将数据插入数据库? - javascript我是Web开发的初学者,可以访问cpanel上托管的网站,并且需要对其进行一些更改。这个网站的后端是由蛋糕PHP制作的,我想使用ajax从客户端将一些数据插入其数据库。问题是我不知道如何获取负责插入数据库的PHP文件的URL。参见下面的代码:var xhttp = newXMLHttpRequest(); xhttp.onreadystatechange= …
Mongo汇总 - javascript我的收藏中有以下文件{ "_id": ObjectId("54490b8104f7142f22ecc97f"), "title": "Sample1", "slug": "samplenews", "cat": …
将字符串值添加到php / javascript - javascript您好,我有一些代码需要在其中插入一些字符串值,但是每次我输入字母时,脚本都无法正常工作。<script type="text/javascript"> "use strict"; var values = [1,2,3,4,5,6,7,8,9]; /*add string values here*/ var…