我正在尝试使用高级图表创建饼图。我通过PHP以及系列获取数据库中的所有值,这些值通过JSON发送到jQuery,我在其中解析JSON并将其传递给创建图形的函数。
$query = [array('name'=>'SAP', 'id'=>48), array('name'=>'EIS', 'id'=>65), array('name'=>'P2P', 'id'=>84), array('name'=>'Portal Gift Card', 'id'=>92), array('name'=>'Tenants Survey', 'id'=>74), array('name'=>'Outros', 'id'=>17)];
$series = array('name' => 'Effort');
$seriesData = array();
foreach ($query as $data){
$rslt = $this->gm->getEffortApp($data['id']);
array_push($seriesData, array('name' => $data['name'], 'y' => $rslt));
}
$series['data'] = $seriesData;
echo json_encode($series, JSON_NUMERIC_CHECK);
这是获取数据并通过JSON将其发送到jQuery的代码。
$(document).ready(function(){
var param = '<?=$graphdata['param']?>';
asyncCall('post', '?/graphAsync/getSeries/'+<?=$graphdata['graph_id']?>,{param: param}, 'text',function(data){ //returns the right array to populate the graph
var series = $.parseJSON(data);
setChartData($('#graph'+<?=$graphdata['id']?>), '<?=$graphdata['graph_type']?>', '<?=$graphdata['graph_title']?>', 'Teste', '<?=$graphdata['graph_titleY']?>', series);
});
});
这是接收所有图形数据并解析JSON字符串的代码。
function setChartData(elem, type, title, categories, titleY, series){
elem.highcharts({
chart: {
type: type
},
title: {
text: title
},
xAxis: {
categories: categories
},
yAxis: {
min: 0,
title: {
text: titleY
},
stackLabels: {
enabled: true,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.textColor) || 'white',
style: {
textShadow: '0 0 3px black'
}
}
},
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
series: series,
credits: {
enabled: false
}
});
}
这是创建图表的功能。
其余的图形数据来自控制器负载(CodeIgniter),似乎没问题。
服务器的输出(JSON字符串)如下:
[{"name":"SAP","y":9420.35},{"name":"EIS","y":2282.5},{"name":"P2P","y":218.5},{"name":"Portal Gift Card","y":203},{"name":"Tenants Survey","y":323},{"name":"Outros","y":1}]
系列函数中的输入是这样的:
series=[object,object,object,object,object,object]
每个对象如下:
object:[name:'something', y:*number*]
图表只有标题和导出按钮才会加载空白。 出于某种原因,我无法发布图像,这就是为什么我没有放置图形输出的任何图像。
提前感谢。
编辑:这是jsfiddle,虽然由于某种原因我无法像在localhost中那样工作。这基本上就是我正在做的事情,而是我通过PHP变量传递参数。