echarts legend属性_用uisys封装ECharts插件真的超简单

摘要

AIroot UISYS 工具的模块封装能力很强，可以方便的融合第三方插件的能力。可以按照开发者的思想对已有插件升级改造，

例如 ECharts。

ECharts是目前国内数据可视化经常使用的插件，它基于canvas渲染，比以往的图形控件更加流程。
今天我们用 AIroot UISYS来封装ECharts，来作为一个标签，然后直接引入我们的HTML代码中。

1. 准备

1. 我们新建一个目录，命名为 MyTest，然后下载 Echarts 的 js 包保存到当前目录的 js文件夹下。

2. 新建 charts 文件夹，里面放 ECharts.ui （如果想引入其他Charts，例如HighChart等都可以加入）

3. 在 MyTest 目录下，新建 Index.ui，作为首页。

整体目录结构如下：

4. 打开UISYS工具，发布 MyTest目录，如下（我的MyTest目录放在E:/juswork/test/ 目录下，各位自己电脑随意）：

2. 实现代码

• 以下是 ECharts.ui 的实现代码：

<!-- charts/ECharts.ui -->

有ECharts原生开发经验的朋友，看上面的代码实际上就是实现了一边Echarts的初始化操作。
其中option 方法是 **ECharts.ui** 模块的setter属性。如果想看这个模块的 **API 说明** 可以按照以下操作。
- 可以访问 <b> http:// 127.0.0.1/index.doc </b>

- 然后查看下charts.Echarts
这是UISYS工具的默认分析模块能力，可以快速生成模块的API文档。

- 下面我们做个首页命名为 Index.ui，测试下这个 Echarts.ui 模块是否好用

<@pub/>

- 最后打开如下网址，如果看到下图说明成功了。

轻松实现，这套例子写的非常简单，如果考虑到兼容框架的特性，实际上还有很多要做。

写插件吗，我觉得UISYS最贴近原生代码量少，不用绕脑子，直接用原生插件，非常好。