安装
The preferred way to install this extension is through composer.
项目根目录下执行:
php composer.phar require --prefer-dist miloschuman/yii2-highcharts-widget "*"
或者在composer.json中添加
"miloschuman/yii2-highcharts-widget": "*"
后执行composer update.
使用
在view视图中使用该widget:
use miloschuman\highcharts\Highcharts;
描绘饼状图(此处有两种写法,options中的参数可以为数组形式也可以为json格式,格式大致与highcharts中的例子:http://www.hcharts.cn/test/index.php?from=demo&p=39 格式对应):
echo Highcharts::widget([
'options'=>'{
"chart": {
"plotBackgroundColor": null,
"plotBorderWidth": null,
"plotShadow": false
},
"title": {
"text": "Browser market shares at a specific website, 2010"
},
"tooltip": {
"pointFormat": "{series.name}: <b>{point.percentage:.1f}%</b>"
},
"plotOptions": {
"pie": {
"allowPointSelect": true,
"cursor": "pointer",
"dataLabels": {
"enabled": true,
"color": "#000000",
"connectorColor": "#000000",
"format": "<b>{point.name}</b>: {point.percentage:.1f} %"
}
}
},
"series": [{
"type": "pie",
"name": "Browser share",
"data": [
["Firefox", 45.0],
["IE", 26.8],
{
"name": "Chrome",
"y": 12.8,
"sliced": true,
"selected": true
},
["Safari", 8.5],
["Opera", 6.2],
["Others", 0.7]
]
}]
}'
]);