关于Echarts-PHP
Echarts-PHP 是一个对echarts js封装的PHP库。
安装方法
composer require "hisune/echarts-php"
特性
Echarts-PHP使用PHP的property来绑定echarts js的options,同时支持所有options的IDE代码提示,使用非常方便。
所有IDE自动提示的PHPDoc都由脚本自动生成,因此当echarts js的options的属性有变动时,PHPDoc的更新变得异常简单。
我们可以通过直接对property赋值来指定options:
// The most simple exampleuse Hisune\EchartsPHP\ECharts;
$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 \Hisune\EchartsPHP\Doc\IDE\Series;
$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 \Hisune\EchartsPHP\Config;
// Recommend standard
$chart->on('click', Config::eventMethod('console.log'));
// Or write js directly
$chart->on('mousedown', 'console.log(params);');
更多信息
- 详细的使用文档可访问:README.md
- 项目地址:Github
- Demos:https://demo.hisune.com/echarts-php
如果您觉得您在我这里学到了新姿势,博主支持转载,姿势本身就是用来相互学习的。同时,本站文章如未注明均为 hisune 原创 请尊重劳动成果 转载请注明 转自: Echarts图表的php库开源了 - hisune.com
25 Comments
lnnw#54 Reply
Hisune\EchartsPHP\Config::$dist = 'your dist url';
为什么定义了自己的dist 图表就不显示了呢。
观察生成的代码
变成了
hiThreaded Comment 54 #55 Reply
@lnnw 请确保你的目录下面有这个url里面的文件https://cdnjs.com/libraries/echarts
lnnwThreaded Comment 55 #56 Reply
@hi 我看了一下好像是版本的事,我的目录里没有版本号文件夹,你判断了版本,被判定成2.x版本了
hiThreaded Comment 56 #57 Reply
@lnnw 嗯,这个问题的确需要优化一下,感谢反馈^_^
lnnwThreaded Comment 57 #58 Reply
@hi 我在composer 包列表里看到了一个 laravle 的charts包 https://github.com/ConsoleTVs/Charts 感觉非常棒,如果可以您可以借鉴一下;创造出更强大的轮子。
还有就是我目前是thinkphp5做东西,昨晚简单测试了一下你这个包,感觉就是把原来在模板里写js配置的东西移动到了控制器里,如果能再封装的更方便一点就好了,比如我发给你的laravel的charts包,又或者我想生成一个柱形图或者饼形图,只需要传入必要数据就生成了,就更简单了。不管怎样,还是很赞,感谢您。
ps:你网站好慢。
hiThreaded Comment 58 #59 Reply
@lnnw 当初设计成这个样子就是我觉得property更加灵活,缺点就是ide没法自动提示,多谢你的建议,我会想办法做到更好
lnnwThreaded Comment 59 #60 Reply
@hi 是的,这样做很灵活。我已经推荐给那帮用thinkphp5做项目的菜鸡了,他们都说一直没找到这样的轮子哈。 请问,您有QQ什么的么?方便加下好友或者换一下博客友链么,虽然我是个菜鸡。
hiThreaded Comment 60 #61 Reply
@lnnw 暂时没有友链这个板块额
979759494#63 Reply
请问下这个引入中国地图。那个注释里面的js方法和ajax方法使用了。但是只显示南海区域,小白求大神指点。谢谢
hiThreaded Comment 63 #64 Reply
@979759494 最好贴出你的代码
979759494Threaded Comment 64 #65 Reply
@hi 比如用你封装好r的 $chart = new Echars(); ... $series =new Series(); $series->type = 'map'; $series->mapType = 'china'; 这样本来可以生成一张中国地图,但是现在只要南海。 当然我知道现在ECHAER3.0版本改了引用方式。需要JS或者JSON引入。 但是能不能不在JS里面配置信息,因为我的JS还不是很好。只会在PHP里面操作数据库里面传过来的数据