Question

   const testIcon = `<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg">
<rect stroke="white" fill="blue" x="1" y="1" width="22" height="22" /></svg>`;

无需在CSS上使用此标记，仅在页面上显示地图标记就可以应用该类。

.hide { visibility: hidden }
.show { visibility: visible }

我尝试同时使用H.map.Icon和H.map.DomIcon以及各自的Marker和DomMarker，但没有成功。

var icon = new H.map.DomIcon(testIcon);
var marker = new H.map.DomMarker({lat: 'latitudeVal', lng: 'longitudeVal'};, { icon:icon })
map.addObject(marker);

这是针对现有地图的。我想翻转特定标记上的类（或仅将可见性设置为隐藏）。我在地图上有几个地图标记。如何检索特定标记并将可见性设置为隐藏或恢复为可见？是否有可能根本不需要重新调用API的Javascript解决方案？

我也一直在尝试API方法，但是不确定如何遍历所有标记并设置特定标记的可见性。 DomMarker Get position，setting visibility是否需要，因为这涉及其他API调用和性能？

如果不需要，我想避免对API的额外调用，如果可能的话，直接在标记上翻转可见性。

// The icon gets added fine... 
  const testIcon = `<svg width="25" height="25" class="show" xmlns="http://www.w3.org/2000/svg"><ellipse cx="10" cy="10" rx="8" ry="8" fill="blue"  /></svg>`;

  const hideIcon = `<svg visibility="hidden" width="12" height="12" xmlns="http://www.w3.org/2000/svg"><ellipse cx="6" cy="6" rx="5" ry="5" fill="#5980B2" stroke="white" /></svg>`;
  let mapMarkerList = [];  // Could this be used. 
    data.forEach(function (mapMarker, i) {
        var icon = new H.map.DomIcon(testIcon);
        let marker = new H.map.DomMarker( { lat: mapMarker.lat, lng: mapMarker.long } , { icon:icon })
        map.addObject(marker);
        mapMarkerList.append(marker); 
   });

    toggleMarkers(data, map, '1'); 

// dataset looks like:
dataset = {
        { lat:'123', long:'-123', customData: 'abc' }, 
        { lat:'123', long:'-123', customData: 'x' }, 
        { lat:'123', long:'-123', customData: 'abc' }, 
    }
        function realToggleMarkers(mapMarkers, valueToFilter, map) {
// Hide all 'abc' lat/long markers... 
        dataset.forEach(function (value, i) {
           if(valueToFilter !== value.customData ) {
              console.log('Hide');
                // There's also a value.lat and value.long here that I create marker with. I need to hide that specific marker.
                // mapMarkers loop through? === value.lat? then hide.
                // mapMarker[0].getPosition().lat // How can I check this matches value.lat without nested loops?
          } else { 
            console.log('Show');
          }
        });
}

    // Doesn't work....
    // Use the map object above and hide/show specific markers.....     
      function toggleMarkers(mapMarkers, map, valueToFilter) {  
        mapMarkers.forEach(function (value, i) {
            if(i%2===0) {
            // How can we get individual marker from the 'map' object built out above?
              console.log(marker.getIcon());
              // Doesn't work.... 
              marker.getIcon().setVisibility(false); // Or any other approach changing the visibility....

            }
    });

Answer 1

也许您在这里做了一些复制/粘贴工作，但没有修改：console.log(marker.getIcon());应该不是console.log(value.getIcon());

marker不是foreach循环内的变量

Answer 2

请使用H.map.object.setVisibility（boolean）

https://developer.here.com/documentation/maps/topics_api/h-map-object.html#h-map-object__setvisibility 标记也是H.map.object。应该在下面。

value.setVisibility(false);

在此处地图上隐藏/显示地图标记

2 个答案: