如何解决模拟从外部地图上单击MarkerCluster + Marker
我在使用React Leaflet / Marker Cluster时遇到一个棘手的问题。
我有一个带有标记簇的地图
<div id="map-container">
<Map>
<TileLayer
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
<MarkerClusterGroup showCoverageOnHover={false}>
{ itemsArray.map((item) => {
return (
<Marker
onClick={(e) => mapRef.current.leafletElement.setView(e.latlng)}
position={latitude[0],longitude[0]]}>
<Popup closeButton={true} autoPan={true} autoPanPadding={[50,50]}>
<Thumbnail
onClick={() => handleClick(item.link)}
src={item.feature_image} />
<div
onClick={() => handleClick(link)} >
<span>{item.title}</span>
<span>➔</span>
</div>
</Popup>
</Marker>
)
})}
</MarkerClusterGroup>
</Map>
</div>
我在地图旁边还有一个元素列表。该列表基于MarkerCluster也基于的itemsArray。
<ul>
{
itemsArray.map((item) => {
return (
<li>
<img src={item.feature_img} />
<h3>{item.title}</h3>
</li>
)
})
}
</ul>
我希望在单击该列表的某个元素时,地图上的相应标记(而不是簇,标记,这很棘手)触发其弹出窗口。就是说,我尝试 marker.fire('click');
打开相应的弹出窗口,但是没有用。
有人有什么想法吗?
非常感谢
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。