我正在开发一个在 CodeIgniter 框架中构建的 PHP 项目。该应用程序包含许多动态创建的图表。我与 ronan-gloo highcharts library 的合作取得了巨大成功。下面是生成我的图表的代码...
$this -> load -> library ( 'Highchart' );
$chart = new Highchart ( );
$chart -> chart -> renderTo = "divid";
$chart -> title -> text = "chart Title";
$chart -> xAxis -> categories = $xaxis;
$chart -> tooltip -> formatter = new HighchartJsExpr ( "function() {
var s;
if (this.point.name) { // the pie chart
s = ''+
this.point.name +': '+ this.y;
} else {
s = '<b>'+ this.series.name +'</b><br/><i>' + this.x +'</i>: <b>'+ this.y + '%</b>';
}
return s; }" );
$chart -> series [ ] = array (
'type' => "column" ,
'name' => "%age" ,
'data' => $yaxis ,
'color' => '#CC004B' ,
'showInLegend' => TRUE ,
'dataLabels' => array (
'enabled' => TRUE ,
'color' => '#CC004B' ,
'style' => array (
'fontSize' => '10px' ,
'verticalalign' => 'bottom'
)
)
);
foreach ( $chart->getScripts() as $script ) {
echo '<script type="text/javascript" src="' . $script . '"></script>';
}
echo "<script src='" . base_url ( ) . "assets/js/jquery.cookie.js'></script>";
echo "<script type='text/javascript' src='" . base_url ( ) . "assets/highcharts/js/exporting.js'></script>";
echo "<div id='divid'></div>";
echo "<script type='text/javascript'>" . $chart -> render ( "chart1" ) . "</script>";
这有助于我更大程度地创建图表，但是，Highcharts 有一个很棒的向下钻取功能 ( High Charts Drilldown demo )，我希望在我的项目中实现它。
演示建议创建 javascript 对象来保存向下钻取数据 ( JS Fiddle )，调用该数据来创建图表。但是当 javascript 是即时编写时，我如何在 PHP Codeigniter 中执行此操作...
请帮忙!
最佳答案
我能够解决上述问题。下面是我使用过的代码...
$this -> load -> library ( 'Highchart' );
$chart = new Highchart ( );
$chart -> chart -> renderTo = "chartcontainer";
$chart -> title -> text = "Chart Title";
$chart -> chart -> type = "column";
$chart -> subtitle -> text = "Click the columns to view Drilldown. Click again to view main chart.";
$chart -> xAxis -> categories = $xaxis;
$chart -> yAxis -> title -> text = "%age";
$chart -> chart -> plotShadow = TRUE;
$chart -> chart -> plotBorderWidth = 1;
$chart -> chart -> plotBackgroundColor = "#F0F0F0";
$pcolumn = $chart -> plotOptions -> column;
$pcolumn -> cursor = "pointer";
$xaxisjson = json_encode ( $xaxis );
$pcolumn -> point -> events -> click = new HighchartJsExpr ( "function() {
var drilldown = this.drilldown;
if (drilldown) { // drill down
setChart(drilldown.name, drilldown.categories, drilldown.data, '#FA7070');
} else { // restore
setChart('Repeat %age', $xaxisjson, $drilldowndata);
}
function setChart(name, categories, data, color) {
chart2.xAxis[0].setCategories(categories, false);
chart2.series[0].remove(false);
chart2.addSeries({
name: name,
data: data,
color: color || '#7070FA'
}, false);
chart2.redraw();
}
}" );
$pcolumn -> dataLabels = array (
"enabled" => true ,
"style" => array ( "fontWeight" => "bold" ) ,
"formatter" => new HighchartJsExpr ( "function() {
return this.y +'%';
}" )
);
$chart -> tooltip -> formatter = new HighchartJsExpr ( "function() {
var point = this.point,
s = this.x +':<b>'+ this.y +'%</b> Repeat E-Mails<br/>';
if (point.drilldown) {
s += 'Click to view '+ point.category +'\'s drilldown data';
} else {
s += 'Click to return to main graph';
}
return s;
}" );
$chart -> series [ ] = array (
"name" => "Series Name" ,
"data" => $drilldowndata [ "data" ]
);
foreach ( $chart->getScripts() as $script ) {
echo '<script type="text/javascript" src="' . $script . '"></script>';
}
echo "<script src='" . base_url ( ) . "assets/js/jquery.cookie.js'></script>";
echo "<script type='text/javascript' src='" . base_url ( ) . "assets/highcharts/js/exporting.js'></script>";
echo "<div id='chartcontainer'></div>";
echo "<script type='text/javascript'>" . $chart -> render ( "chart2" ) . "</script>";
数组 $drilldown 的格式如下:
Array
(
[data] => Array
(
[0] => Array
(
[y] => 18.5
[drilldown] => Array
(
[name] => Category0
[categories] => Array
(
[0] => 01-Jul
[1] => 02-Jul
[2] => 03-Jul
)
[data] => Array
(
[0] => 27
[1] => 14.4
[2] => 9.7
)
[color] => #7070FA
)
)
[1] => Array
(
[y] => 15.6
[drilldown] => Array
(
[name] => Category1
[categories] => Array
(
[0] => 01-Jul
[1] => 02-Jul
[2] => 03-Jul
)
[data] => Array
(
[0] => 20
[1] => 16.1
[2] => 0
)
[color] => #7070FA
)
)
[2] => Array
(
[y] => 21.5
[drilldown] => Array
(
[name] => Category2
[categories] => Array
(
[0] => 01-Jul
[1] => 02-Jul
[2] => 03-Jul
)
[data] => Array
(
[0] => 20.6
[1] => 24.3
[2] => 17.9
)
[color] => #7070FA
)
)
[3] => Array
(
[y] => 10
[drilldown] => Array
(
[name] => Category3
[categories] => Array
(
[0] => 01-Jul
[1] => 02-Jul
[2] => 03-Jul
)
[data] => Array
(
[0] => 13.8
[1] => 11.5
[2] => 4
)
[color] => #7070FA
)
)
)
)
欢迎在评论中提供任何建议或帮助
关于php - Highcharts 深入图表 CodeIgniter，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17399642/