Javascript 在Highcharts数据中使用字符串
我和Symfony2一起工作。我将一个字符串传递给一个视图,在该视图中我将显示一个饼图,并尝试将该字符串传递到数据部分 我的字符串是:Javascript 在Highcharts数据中使用字符串,javascript,php,string,symfony,highcharts,Javascript,Php,String,Symfony,Highcharts,我和Symfony2一起工作。我将一个字符串传递给一个视图,在该视图中我将显示一个饼图,并尝试将该字符串传递到数据部分 我的字符串是:[['euruUSD',7],'gbpuUSD',0],'USDEUR',1] 我从我的symfony控制器中获得它,如下所示: <?php {{liste}}; ?> 它起作用了 编辑:这是我视图的代码 <html> <head> <title>Chart</title> <!-- Charge
[['euruUSD',7],'gbpuUSD',0],'USDEUR',1]
我从我的symfony控制器中获得它,如下所示:
<?php {{liste}}; ?>
它起作用了
编辑:这是我视图的代码
<html>
<head>
<title>Chart</title>
<!-- Chargement des librairies: Jquery & highcharts -->
<script type='text/javascript' src="{{asset('bundles/user/js/jquery.min.js')}}"></script>
<script type="text/javascript" src="{{asset('bundles/user/js/highcharts.js')}}" ></script>
</head>
<body>
<p><div align="center">{{liste}}</div></p>
<p>
<!-- Chargement des variables, et paramètres de Highcharts -->
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function() {
Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function(color) {
return {
radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
stops: [
[0, color],
[1, Highcharts.Color(color).brighten(-0.3).get('rgb')]
]
};
});
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'myData'
},
tooltip: {
pointFormat: '<b>{point.percentage}%</b>',
percentageDecimals: 1
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function() {
return '<b>'+ this.point.name +'</b>: '+ Highcharts.numberFormat(this.percentage, 1) +' %';
}
}
}
},
series: [{
type: 'pie',
name: '',
data: "<?php {{liste}};?>"
}]
});
});
});</script>
<!-- Affichage du graphique -->
<div id="container" style="width:100%; height:400px;">
</div></p>
</body>
</html>
图表
{{liste}}
$(函数(){
var图;
$(文档).ready(函数(){
Highcharts.getOptions().colors=Highcharts.map(Highcharts.getOptions().colors,函数(color){
返回{
径向梯度:{cx:0.5,cy:0.3,r:0.7},
停止:[
[0,颜色],
[1,Highcharts.Color(Color).Brighlight(-0.3).get('rgb')]
]
};
});
图表=新的高点图表。图表({
图表:{
renderTo:'容器',
plotBackgroundColor:null,
plotBorderWidth:null,
plotShadow:false
},
标题:{
文本:“myData”
},
工具提示:{
pointFormat:“{point.percentage}%”,
百分比小数:1
},
打印选项:{
馅饼:{
allowPointSelect:true,
光标:“指针”,
数据标签:{
启用:对,
颜色:'#000000',
连接器颜色:'#000000',
格式化程序:函数(){
返回“+this.point.name+”:“+Highcharts.numberFormat(this.percentage,1)+'%”;
}
}
}
},
系列:[{
键入“pie”,
名称:“”,
数据:“”
}]
});
});
});
既然我相信您使用了twig作为模板引擎,那就忘了包含括号的php吧
<script>
...
series: [{ type: 'pie',name: '',data: "{{liste}}" }]
...
</script>
...
系列:[{类型:'pie',名称:'',数据:“{{liste}}]
...
问题在于您的字符串已经是JS格式,并且您也将其作为字符串传递给模板。删除引号,它应该会工作。此外,您可能需要使用raw
过滤器,这样树枝就不会逃脱您的魔咒。例如:
series: [{
type: 'pie',
name: '',
data: {{ liste|raw }}
}]
问题在于值的json解释,所以使用json_编码过滤器
series: [{
type: 'pie',
name: '',
data: {{ liste|json_encode|raw }}
}]
您的项目使用哪个模板引擎?细枝简单的PHP?我使用了twig,我已经验证了我传递的字符串的内容以及它与我传递的内容的一致性。所以@Thomas答案是一个好方法!当我这样做时,图表根本不显示!!你的最终HTML是什么样子的?如果你使用twig作为模板引擎,你不应该使用Yes我知道,我会按照你在我的视图中的建议做,因为我使用twig。但是在这里,即使我使用{{MyString}},它也不起作用。正如你所看到的,我在正文中使用它来显示我的字符串,以确保它是正确的!!
series: [{
type: 'pie',
name: '',
data: {{ liste|raw }}
}]
series: [{
type: 'pie',
name: '',
data: {{ liste|json_encode|raw }}
}]