5.12. 自定义图表插件

1. 编写插件

   新建一个UTF-8编码的plugin.json文件，格式为：

   {
     id: "...",                //插件唯一标识
     nameLabel: "...",         //插件展示名称
     dataSigns:                //插件的数据标记定义，用于新建图表时标记数据
     [
       {
         name: "...",          //数据标记名
         nameLabel: "...",     //数据标记展示名
         required: ...,        //是否必须标记
         multiple: ...         //是否可多次标记
       },
       ...
     ],
     chartRenderer:            //图表渲染器
     {
       asyncRender:            //声明render函数是否为异步，可选，默认为false
       true || false || function(chart){ return true || false },
       render: function(chart)
       {
         ...                   //这里编写初始化图表元素JS代码
         //chart.elementJquery().append("render");
       },
       asyncUpdate:            //声明update函数是否为异步，可选，默认为false
       true || false || function(chart, results){ return true || false },
       update: function(chart, results)
       {
         ...                   //这里编写更新图表数据JS代码
         //chart.elementJquery().append("update");
       }
     }
   }

   将上述plugin.json文件添加到以其id值命名的ZIP压缩包内，例如：

   my-chart-plugin-line.zip

     |--plugin.json

   注意：如果chartRenderer.asyncRender返回true， 那么在chartRenderer.render函数中完成异步操作后， 应该调用chart.statusPreUpdate(true);，表明已完成render。

   注意：如果chartRenderer.asyncUpdate返回true， 那么在chartRenderer.update函数中完成异步操作后， 应该调用chart.statusUpdated(true);，表明已完成update。

   chart对象上定义了很多有用的函数， 包括获取图表元素、绘制echarts图表、 获取指定数据标记（上述dataSigns定义的项）的数据、 以及其他图表相关的常用API。
   具体参考datagear-chartFactory.js中的chartBase.***函数说明。

2. 上传插件

   以管理员账号登录系统后，点击主页右上角的按钮， 点击弹出菜单中的上传图表插件条目，打开上传页面后，将上述的自定义图表插件ZIP压缩包上传即可。

3. 使用插件

   在图表管理页面点击[添加]按钮，选择上述自定义的图表插件，新建图表即可。