ArcGIS API for JavaScript 4.x 多个

问题背景

API本身的Popup和PopupTemplate等功能只支持单个目标弹窗信息展示。不能在地图上以弹窗的形式同时展示多个目标的信息。

解决思路

想要同时显示多个目标的弹出窗口信息，可以通过自己创建包含完整信息的DOM对象并定位到屏幕位置的方式，该屏幕像素位置由地理坐标点转换而得。

在平移、旋转、缩放等事件发生后，重新计算地理位置对应的当前屏幕像素位置，并定位DOM节点（通过style）。

DOM对象支持容纳丰富的内容，这里以一个web-components为例。

关键方法

1.定义一个数据结构存放目标点及弹出窗口数据信息

2.重定位方法

3.创建弹出窗口信息方法

4.监控视图状态

完整代码：

https://codepen.io/dansdocker/pen/ExrWmWg

效果：