James.Lv 发表于 2020-2-19 08:02:20

轮播气泡地图

本帖最后由 JamesLv 于 2020-3-3 17:26 编辑

在仪表板中除了使用系统已有的可视化组件之外,还可以通过内置扩展插件,甚至自定义插件绘制更多样化的图表以更丰富的形式展示数据。
版本更新记录

版本号更新内容支持Wyn Enterprise版本下载地址
V1.0第一次发布3.0.04167.0


1. 内容概述
轮播气泡地图可以在地图上通过经纬度的标记数据点,并通过气泡表示数据的大小。在开启轮播属性之后,自动循环展示数据点的详细信息,并且支持与其他组件的数据交叉联动,非常适合创建数据大屏、管理驾驶舱等场景的需要。
另外,该可视化扩展插件还演示了在Wyn Enterprise中集成百度地图和Echarts的详细方法。
本节为您介绍扩展组件轮播气泡地图的基本用法。


2. 操作步骤
(1)下载插件包
下载轮播气泡地图插件包,将其保存到本地计算机并解压。

(2)添加百度应用AK编号
打开插件包中的index.html文件



提示
百度地图应用的ak编号获取说明:
您需要注册百度账号(https://lbsyun.baidu.com/apiconsole/center#/home),并创建应用。请注意创建应用时,将应用类型选择为“浏览器端”。


(3)添加自定义插件
将修改后的文件夹放置到Wyn Enterprise安装目录Server\wwwroot\Web Contents\   路径下即可在产品中体验
例如: C:\Program Files\Wyn Enterprise\Server\wwwroot\Web Contents


(4)新建仪表板添加外部扩展组件
将外部扩展组件拖拽到仪表板编辑区。


(5)选择插件
单击组件右上角进入编辑状态,选择“轮播气泡地图”,然后单击“确定”。

(6)   数据绑定
添加外部扩展组件后,“数据绑定”面板会自动打开,将数据集中的字段拖拽到绑定区即可完成数据绑定。
如果仪表板中未加载数据集,则需要先选择一个数据集进行加载,然后再绑定数据字段。详见加载数据集。

注意
数值绑定区域中仅能绑定一个字段,如绑定了多个字段,则仅第一个生效。
维度绑定区域中必须按照上图所示的顺序绑定地区信息、经度信息和纬度信息三个字段才能使轮播气泡地图正常显示。

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

自定义属性设置说明如下:
{
    "play": {
      "autoplay": false,
      "setCenter": "auto",
      "interval": 3
    },
    "zoom": 0,
    "center": [
      null,
      null
    ],
    "rank": {
      "level": 5,
      "order": "top"
    },
    "style": {
      "color": "blue",
      "rankColor": "purple",
      "mapStyle": {
            "style": "normal"
      }
    }
}
1.“play”:轮播选项    “autoplay”: 是否开启轮播。可选值: true(开启) | false(关闭)。默认值: false。
    “setCenter”: 自动轮播时是否设置中心点(即视野是否跟随轮播的数据移动),开启轮播时生效。可选值:“auto”|”true”|”false”。
    “auto”: 数据在视野范围较好位置(没有很靠近边界)时视野不变,在视野之外或者靠近边界时视野变为以该数据为中心;
    “true”: 始终将轮播的数据作为视野中心点显示;
    “false”: 始终不改变视野。默认值:“auto”。
    “interval”: 轮播间隔时间,单位: 秒,开启轮播时生效。 可选值: 正数。 默认值: 3

2. “zoom”: 地图缩放级别
数字越大,地图放大程度越大,视野越小。可选值: 3~19的整数,默认为 0。

3. “center”: 地图中心点经纬度
经度数据范围为: -180~180,纬度数据范围为: -90~90

4. “rank”: 重要(闪动)数据显示设置
    “level”: 显示重要数据的个数。默认值为5。
    “order”: 重点显示最大的或者最小的数据。可选值: “top”(最大) | “bottom”(最小)。默认值为 “top”。

5. “style”: 样式设置
    “color”: 普通数据颜色值。可选值:RGB颜色,RGBA颜色,HSL色彩,HSLA颜色,十六进制颜色,渐变色。
    “rankColor”: 重要数据颜色值。同“color”。
    “mapStyle”: 地图样式。可以设置三种字段: “style”, “styleId”, “styleJson”。
    “style”: 可选值:“normal”,”light”,”dark”,”redalert”,”googlelite“,”grassgreen“,”midnight“,”pink“,”darkgreen“,”bluish“,”grayscale“,”hardedge“。请参考: http://lbsyun.baidu.com/custom/list.htm
    ”styleId“: 利用百度地图个性化工具编辑得到,。参考: http://lbsyun.baidu.com/apiconsole/custommap


(8)预览并保存仪表板
预览后如效果满意,即可保存仪表板。



页: [1]
查看完整版本: 轮播气泡地图