【仪表板-插件开发】Wyn Enterprise实现Echarts流向地图

前言：
Wyn Enterprise全面开放了可视化组件接口，用户可以开发自己的可视化组件，并且自定义数据绑定面板，属性设置和数据探索方式。通过开源图表库（例如d3和echarts）或者自己开发渲染视觉效果。自定义的可视化组件可以像内置组件一样在仪表板中使用，进行数据分析和展示。并且通过插件形式来增加产品功能。使用插件的好处，用户需要什么功能添加什么扩展组件，不会对系统的正常运行产品影响。用户的需要将会得到更好的响应和满足。同时由于插件开发的自由方式，第三方软件公司、个人爱好者都可以开发出它所需求的功能插件，Wyn Enterprise为开发者提供一个创业平台，赋能开发者，为用户提供高质量高价值的产品。


下面就来详细介绍一下如何通过Wyn Enterprise实现Echarts的流向地图，先来看一张效果图：


一、使用Wyn Enterprise可视化插件实现Echarts的好处
ECharts 属于开源软件，并且我们提供了非常炫酷的图形界面，特色是地图，另外还提供了柱状图、折线图、饼图、气泡图及四象限图等； 但是Echarts面向的是开发者，用户需要有一定的开发能力，而且当您数据结构变化，或者希望调整样式属性时，需要重新修改代码，并且重新生成页面。
通过Wyn Enterprise将Echarts集成进来之后，可以完全实现跟内置组件一样的效果，只需要简单的拖拽就可以绑定数据，调整属性也可以通过UI进行设置更改。
还可以利用Wyn Enterprise现成的聚焦分析，数据过滤，排序，排名筛选，数据联动，钻取等所有功能，最为方便的是，可以直接利用Wyn Enterprise的多数据源的数据连接，强大的数据建模和数据整合能力，一次开发所有场景均可使用。
二、流向地图的介绍
1.使用场景
流向地图在地图上显示信息或物体从一个位置到另一个位置的移动及其数量。
通常用来显示人物、动物和产品的迁移数据。单一流向线所代表的移动规模或数量由其粗细度表示，有助显示迁移活动的地理分布。
流向地图多应用于区际贸易、交通流向、人口迁移、购物消费行为、通讯信息流动、航空线路等场景，也可应用企业货物运输，供应链管理。


2.数据结构
流向地图的数据结构主要包含起始地（经纬度），目的地（经纬度），数值，如下图所示：

根据这个数据来进行可视化的展示，更加直观的反应数据的流向和变化。

三、如何利用Wyn Enterprise可视化插件实现Echarts的流向地图
Wyn Enterprise 从 4.0 版本开始支持用户自定义可视化插件功能。您可以开发自己的可视化组件，并且自定义数据绑定面板，属性设置和数据探索方式。
通过开源图表库（例如d3和echarts）渲染视觉效果。自定义的可视化组件可以像内置组件一样在仪表板中使用，进行数据分析和展示。

1.开发文档和开发环境准备可以参考如下链接文档：
https://help.grapecity.com.cn/pages/viewpage.action?pageId=50011184
里面详细介绍了开发一个插件的步骤，以及Wyn Enterprise可视化插件所开放的能力和API。

2.Wyn Enterprise可视化插件初始化之后会生成如下资源，完整的流向地图代码见附件。

3.最终插件写好之后编译即可生成一个   *.viz   文件，该文件上传到Wyn Enterprise门户即可使用。

四、流向地图在Wyn Enterprise怎样使用？
1.下载附件流向地图.viz文件，然后打开Wyn Enterprise门户网站进行上传。


2.上传之后在Wyn Enterprise的仪表板在线设计器中即可进行使用。
创建仪表板，即可进去仪表板在线设计器

然后在设计器选择可视化插件，拖动到设计界面，可以看到示例数据的效果。


3.数据绑定
添加可视化插件后，点击数据绑定面板，将数据集中的字段拖拽到绑定区即可完成数据绑定。
如果仪表板中未加载数据集，则需要先选择一个数据集进行加载，然后再绑定数据字段。

（注意：数据可视化插件内部封装了中国各省市区经纬度，所以数据绑定可以只绑定起始地点和目的地点以及数值，当然也可以绑定详细的经纬度）


4.在编辑区右侧选择“属性设置”进行图形样式设置。


终语：
看到这里是不是小伙伴已经按捺不住了，赶紧下载可视化插件进行体验吧。

也欢迎大家在我们论坛插件板块贡献自己开发的插件哦（最后在偷偷告诉大家一个秘密哦，个人开发可视化组件我们是有现金奖励的哟！）


可视化插件源码和插件包:

源码	可视化插件包
流向地图.zip (1.37 MB, 下载次数: 77) 2020-7-30 14:40 上传 点击文件名下载附件	流向地图.viz (2.6 MB, 下载次数: 65) 2020-7-30 14:40 上传 点击文件名下载附件