盈帆数据报表工具之如何使用自定义Echarts插件

在发布的7.3版本中，发布了一个比较通用的插件“自定义Echarts插件”，此插件可以把一些Echarts现有的图表直接嵌入到报表中，再使用报表中的数据，方便大屏的制作。

在画布模式中添加悬浮元素后，或者在普通单元格中，点击菜单中“插入”-》“插入插件”或右键菜单中的“插入插件”按钮，弹出插件选择对话框，找到“自定义Echarts插件”后，点击确定，在选中的悬浮元素或单元格中，插入插件。

双击插入插件的悬浮元素或单元格，弹出自定义插件的属性设置，在这里去编写所要显示的Echarts图形代码。

此插件分为两大部分：运行代码、默认代码。“默认代码”中，可将Echarts中的样例代码拷贝到其中，点击运行，可看到样例，点击确定时，插件的位置会显示默认代码运行后所产生的图片。

点击“运行代码”标签页，显示两部分：插件数据、插件option。插件数据中默认数据变量为pluginData，它是一个数据对象，在下面的编辑框中可以对其进行编辑，主要用来设置数据。在设置中可以获取报表工具中的数据信息，使用时需要自行去组织数据对象。例如：在此对象中定义x轴显示的数据与y轴实际数据：{"xdata":"=[A1]","ydata":"=[B1]"}。使用的报表中的数据可以使用“=[数据集].[字段名称]”来获取数据，也可以使用单元格上的内容作为数据内容“=单元格位置”；当使用的单元格是字段单元格时，需要使用“=[单元格位置]”的方式。使用的数据是数组时，实际返回的数据是中间带有","的字符串，实际代入option使用时，需要用js公式进行转化，变为实际的数组使用。

在“插件option”编辑框中，主要把Echarts的显示代码与数据代码相结合，最终形成报表工具可显示内容的图表插件。在“插件option”编辑框中，可以把默认代码拷贝过来，找到需要调整数据的位置，替换所需的数据代码即可。插件option编辑框中，支持js语法，可以在编辑框中输入各种处理数据的函数、公式等，最终将所需数据组织出来，并替换到相应需要处理的位置。通常情况下，Echarts需要替换的数据包括：坐标轴上的内容数据，实际显示的数据，提示数据，标签数据等。坐标轴上的内容数据通常情况下在Echarts中的“xAxis”、“yAxis”标签中；实际的数据在“series”标签中；提示数据在“tooltip”；标签数据在“legend”中。替换数据时，使用“pluginData.键”的方式来使用实际的数据。

点击确定预览即可看到最终的插件效果图。