跳到主要内容

离线区域地图

组件介绍image.png​

功能确定画布的上下左右的经纬度边界。
1.根据经纬度坐标显示多边形区域
2.根据经纬度坐标显示航迹线。航迹线终点可自定义显示图片节点。点击节点可展示弹框。（可用于显示航迹线终点的飞机图标）
3.根据经纬度坐标显示散点图片。点击散点可展示弹框。（可用于显示机场坐标）
组件接收数据
- 输入桩1接收区域数据。

格式：哈希数组
[
 {"longitude":116.23128, "latitude":40.22077, "category": "A" },
 {"longitude":121.48941, "latitude":31.40527, "category": "A" },
 {"longitude":113.27324, "latitude":23.15792, "category": "A" },
 {"longitude":91.13775, "latitude":29.65262, "category": "B" },
 {"longitude":109.96144, "latitude":39.82127, "category": "B" },
 {"longitude":120.27324, "latitude":23.15792, "category": "B" }
 ]
说明：
1. longitude -> 经度
2. latitude -> 纬度
3. category -> 区域名字


- 输入桩2接收散点数据。
格式：哈希数组
[ 
 {"longitude":116.23128, "latitude":40.22077, "value": "10105" },
 {"longitude":109.13775, "latitude":29.65262, "value": "10106" }
]
说明：
1. longitude -> 散点的经度
2. latitude -> 散点的纬度
3. value-> 散点的数据值。节点点击时，向输出桩1输出此数据。

- 输入桩3接收航迹线数据。**
格式：哈希数组
[ 
 {"longitude":118.23128, "latitude":42.22077, "category":"飞机1", "value": "1" },
 {"longitude":124.48941, "latitude":35.40527, "category":"飞机1", "value": "1" },
 {"longitude":126.27324, "latitude":23.15792, "category":"飞机1", "value": "1" },
 {"longitude":91.13775, "latitude":29.65262, "category":"飞机2", "value": "2" },
 {"longitude":116.08608, "latitude":43.93339, "category":"飞机2", "value": "2" },
 {"longitude":109.96144, "latitude":39.82127, "category":"飞机2", "value": "2" },
]
说明：
1. longitude -> 经度
2. latitude -> 纬度
3. category -> 航迹线类别
4. value-> 散点的数据值。节点点击时，向输出桩2输出此数据。
| | | | 组件发送数据 |
- 输出桩1
点击图片散点节点时，向输出桩1发出该节点value的值，字符串格式
- 输出桩2
点击航迹线终点节点时，向输出桩2发出该节点value的值，字符串格式 | | | | 说明 | 组件刚拖出时是空白的，需要上传背景图片和节点图片才能使用。 | | |

参数配置​

  • 背景图片：点击【添加背景图片】按钮，上传背景图片。背景图片铺满整个组件的大小

  • 开始经度：背景图片左边界代表的经度。开始经度的值小于结束经度。

  • 结束经度：背景图片右边界代表的经度。

  • 开始纬度：背景图片上边界代表的纬度。开始纬度的值小于结束纬度。

  • 结束纬度：背景图片下边界代表的纬度。

  • 区域线颜色(;分隔)： 分号分隔的多边形的边框的颜色值。

  • 区域线宽度： 多边形边框的线宽。

  • 区域线类型：多边形边框的线样式。

  • 区域线虚线样式：多边形边框的线样式为虚线时的虚线样式。

  • 区域填充颜色(;分隔)：分号分隔的多边形的区域填充的颜色值。

  • 区域透明度：多边形的整体透明度。（0-1，0表示透明，1表示不透明）

  • 展示区域名称：是否显示多边形的名称标签。

  • 区域名称字体大小：多边形的名称字体大小。

  • 区域名称字体颜色：多边形的名称字体颜色值。

  • 散点节点图片映射：点击【添加散点节点图片】按钮，添加散点节点的图片。可上传多个。

  • 节点宽度：散点图片的宽度

  • 节点高度：散点图片的高度

  • 点击显示散点节点弹框：配置是否点击时展示弹框

  • 航迹线颜色：航迹线颜色值

  • 航迹线宽度：航迹线线宽

  • 航迹线类型：实线虚线

  • 航迹线虚线样式

  • 航迹线平滑(0~1)：（0-1，0表示直线，1表示曲线）

  • 航迹线动态数据：航迹线数据读入时是完全重绘。还是追加绘制。

  • 显示航迹终端节点：配置是否显示终端节点（用于显示飞机小图标）

  • 航迹终端节点图片映射：点击【添加航迹终端节点图片】按钮，添加图片。可上传多个

  • 航迹终端节点宽度：航迹终端图片的宽度

  • 航迹终端节点高度：航迹终端图片的高度

  • 点击显示散点节点弹框：配置是否点击时展示弹框

  • 弹框指示线颜色：点击节点展示弹框时的指示线的颜色值。

  • 弹框指示线宽度：点击节点展示弹框时的指示线的线宽。

  • 区域示例数据：点击下载csv示例数据。

  • 散点示例数据：点击下载csv示例数据。

  • 航迹示例数据：点击下载csv示例数据。

层级选择器配置​

image.png 离线区域地图的层级内的第一个盒子是地图，第二个盒子代表散点节点弹框，第三个盒子代表航迹线终点节点弹框。
配置弹框时需要先配置好弹框中显示的内容，再将其拖入第二和第三个盒子内。