活字格10.0新功能解密：四、Echarts插件

看见标题你可能在想：怎么又是Echarts？活字格内置的图表不都是Echarts画的么？我觉得胡童鞋是想划水，老饭新吃，忽悠人来了

我：看破不说破，做人留一线，日后好相见。 再说了，你还没看怎么就知道我这个不是王炸呢？

先看2个效果图
（我的动图截图工具可能有点不太行，也许你看起来会比较卡）
（建议看这2个动图的时候，自己脑补《反转地球》的音乐）



怎么样不是老饭新吃吧？

-----------------------正文------------------------
隆重介绍一下，这个版本很强的一个插件--Echarts

只是很强而已，后面还有更强的插件

让先那最简单的图表说明一下玩法
有一个表【销售数据表】，里面2个字段【年份】【销售额】

页面上随便选一片区域设置成Echarts单元格，并且设置数据源，起名字【销售数据信息】，数据源中选择销售数据表的【年份】和【销售额】这2列

设置完了以后，打开【Echarts设置...】超链接
然后一顿代码，怼进去
（如果你能懂一些JS的话，你其实大概能看懂下面的代码，就是横轴显示啥纵轴显示啥。当然其中你可能看不懂的就是ForguncyEchartsHelper.splitDataSource(Context.销售数据信息)  这句话其实就是按照名字取到你刚才设置的数据源，然后去取数据）

1. const{
   
2.   "年份":xAxisData,
   
3.   "销售额":yAxisData
   
4. } = ForguncyEchartsHelper.splitDataSource(Context.销售数据信息);
   
5. 
   
6. option = {
   
7.   xAxis: {
   
8.     type: 'category',
   
9.     data: xAxisData
   
10.   },
    
11.   yAxis: {
    
12.     type: 'value'
    
13.   },
    
14.   series: [
    
15.     {
    
16.       data: yAxisData,
    
17.       type: 'line'
    
18.     }
    
19.   ]
    
20. };

复制代码

不要以为这个图表只是展示一下，秀一下，他是可以跟数据一起联动的，不信，我绑定一个表格修改一下数据给你看

有了这个插件以后，只要你懂一点JS代码，只要你能看懂Echarts玩法；那么Echarts有什么咱活字格就能做什么
我没有吹牛，我们自己已经做了几乎所有Echarts的demo，并且放到了一个工程文件中


到时候这个工程文件，可以给大家学习。
示例工程见市场：传送门
（注意的是，当前只支持预览版二 10.0.1.0 版本）

一起想想一下，以后只要Echarts有的图表类型（基础图表，高级图表，还是3D图表）咱活字格统统能做，而且这一个插件就能搞定
但是美中不足的事，你可能需要稍微会点代码