发布于 2017-03-29 16:00:05 | 228 次阅读 | 评论: 0 | 来源: 网友投递
ECharts Javascript免费图表库
ECharts开源来自百度商业前端数据可视化团队,基于html5 Canvas,是一个纯Javascript图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验,赋予了用户对数据进行挖掘、整合的能力。
Echarts-PHP is a PHP library that works as a wrapper for the Echarts js library(https://github.com/ecomfe/echarts). Support Echarts version from 2.2.x to 3.x.
Echarts-PHP是一个对echarts js封装的PHP库。
Echarts-PHP使用PHP的property来绑定echarts js的options,同时支持所有options的IDE代码提示,使用非常方便。
所有IDE自动提示的PHPDoc都由脚本自动生成,因此当echarts js的options的属性有变动时,PHPDoc的更新变得异常简单。
我们可以通过直接对property赋值来指定options:
// The most simple example use HisuneEchartsPHPECharts; $chart = new ECharts(); $chart->tooltip->show = true; $chart->legend->data[] = '销量'; $chart->xAxis[] = array( 'type' => 'category', 'data' => array("衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子") ); $chart->yAxis[] = array( 'type' => 'value' ); $chart->series[] = array( 'name' => '销量', 'type' => 'bar', 'data' => array(5, 20, 40, 10, 10, 20) ); echo $chart->render('simple-custom-id');
对于series、xAxis、yAxis数组,也可以使用property进行赋值,例如:
use HisuneEchartsPHPDocIDESeries; $series = new Series(); $series->type = 'map'; $series->map = 'world'; $series->data = array( array( 'name' => 'China', 'value' => 100, ) ); $series->label->emphasis->textStyle->color = '#fff'; $series->roam = true; $series->scaleLimit->min = 1; $series->scaleLimit->max = 5; $series->itemStyle->normal->borderColor = '#F2EFF4'; $series->itemStyle->normal->areaColor = '#993399'; $series->itemStyle->emphasis->areaColor = '#993399'; $chart->addSeries($series);
或者直接可以对option数组进行赋值:
$option = array ( 'tooltip' => array ( 'show' => true, ), 'legend' => array ( 'data' => array ( 0 => '销量', ), ), // ... ) $chart->setOption($option);
除了option配置,还支持echarts js 3.x版本的事件:
use HisuneEchartsPHPConfig; // Recommend standard $chart->on('click', Config::eventMethod('console.log')); // Or write js directly $chart->on('mousedown', 'console.log(params);');
详细的使用文档可访问:README.md
项目地址:Github