如何使用z-index设置here地图组的渲染顺序
如何使用z-index设置here地图组的渲染顺序
提问于 2019-10-08 22:22:04
我有一个添加了两个组的地图，每个组包含多个标记，并希望他们中的第一个总是渲染在第二个之上。
地图使用的是HERE3.1核心，我已经尝试在opt_options参数中为每个组设置zIndex属性，但没有任何效果。标记可以随时删除或添加到每个组。
下面是我如何创建组并将其添加到地图中：
const group1 = new H.map.Group({zIndex: 10});
const group2 = new H.map.Group({zIndex: 0});
map.addObjects([
group1,
group2
]);现在，任何时候都可以通过订阅将标记添加到其中一个组中：
poiMarkers$.subscribe(pois => {
group1.removeAll();
pois.forEach(poi => {
const marker = new H.map.Marker(poi.position, poi.icon);
group1.addObject(marker);
})
});
userMarker$.subscribe(user => {
group2.removeAll();
const marker = new H.map.Marker(user.position, user.icon);
group2.addObject(marker);
});现在，所有标记都正确显示，但group2标记仍在组group1上方渲染。
回答 1
Stack Overflow用户
发布于 2019-11-27 19:48:50
与html呈现顺序相比，呈现顺序似乎是颠倒的。如果你看一下他们在https://developer.here.com/api-explorer/maps-js/markers/ordering-overlapping-markers上的代码示例，你会注意到点击一个标记会将它移到后面，尽管它的zIndex会增加。
所以试着换一下你的号码：
const group1 = new H.map.Group({zIndex: 0});
const group2 = new H.map.Group({zIndex: 10});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58288302
复制相关文章
相似问题
腾讯云开发者
