动态将系列数据插入高图
[英]Inserting series data in highcharts dynamically
问题描述
I am new to highcharts and I am trying to create a highchart by passing the data from my controller file to my view file.Unfortunetely, I am not able to put data in my series dynamically. 
我是highcharts的新手，我试图通过将数据从控制器文件传递到视图文件来创建highchart。不幸的是，我无法动态地将数据放入我的系列中。 Given below are my controller and view files: 以下是我的控制器和视图文件：
Controller:graph.php 控制器：graph.php
<?php
class Graph extends CI_Controller {
function __construct() {
parent::__construct();
}
function index() {
$data['title']='Graph for hourly distribution of results based on Location';
$xaxis=array('2','4','6','8','10');
$y1axis=array(5,8,4,6,4);
$y2axis=array(4,6,8,4,5);
$yaxis=array($y1axis,$y2axis);
$data['xlabel']='X-Axis Name';
$data['ylabel']='Y-Axis Name';
$data['type']='line';
$arry = array('xdata' => $xaxis,'ydata' => $yaxis,'title' => $data['title'],'type' => $data['type'],'xlabel' => $data['xlabel'],'ylabel' => $data['ylabel']);
$this -> load -> view('graph_js', $arry);
}
}
?>
Viewfile:graph_js.php 查看文件：graph_js.php
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript" src="../../Highcharts-2.2.5/js/themes/gray.js"></script>
<script type="text/javascript" src="../../Highcharts-2.2.5/js/modules/exporting.js"> </script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
<script type="text/javascript">
var chart;
$(document).ready(function() {
var options = {
chart: {
renderTo: 'container',
type: 'line',
marginRight: 130,
marginBottom: 25
},
title: {
text: '<?php echo $title ?>',
x: -20 //center
},
subtitle: {
text: '<?php echo $xlabel ?>',
x: -20
},
xAxis: {
categories: []
},
yAxis: {
title: {
text: '<?php echo $ylabel ?>'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +': '+ this.y;
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: []
}
options.xAxis=new Array();
options.xAxis[0] = new Object();
options.xAxis[0].categories = new Array(<?php echo join(", ", $xdata) ?>);
options.series = new Array();
var i;
var j=<?php echo count($ydata) ?>;
<?php echo $k=0; ?>;
for(i=0;i<j;i++)
{
options.series[i] = new Object();
options.series[i].name = 'Sample'+i;
options.series[i].data = new Array(<?php echo join(", ", $ydata[$k++]) ?>);
}
chart = new Highcharts.Chart(options);
});
</script>
</head>
</html>
The code above draws the 1st series of the graph and overlaps the 2nd series on the 1st series itself, but if I try to do it manually by putting the following code instead of the for loop it works fine by drawing two different series 上面的代码绘制了图形的第一个序列，并在第一个序列本身上覆盖了第二个序列，但是如果我尝试通过放置以下代码而不是for循环手动进行操作，则可以通过绘制两个不同的序列来正常工作
options.series[0] = new Object();
options.series[0].name = 'Sample1';
options.series[0].data = new Array(<?php echo join(", ", $ydata[0]) ?>);
options.series[1] = new Object();
options.series[1].name = 'Sample2';
options.series[1].data = new Array(<?php echo join(", ", $ydata[1]) ?>);
Could somebody please help me with this problem?Is there any problem with my loop? 有人可以帮我解决这个问题吗？我的循环有问题吗？
1 个解决方案
解决方案1
1 2012-06-26 14:47:13
改用JSON ...使用json_encode()创建系列...说实话，它将为您节省很多麻烦:)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.