小编 Ro*_*asi的帖子

带有react-leaflet-markercluster集群spiderfy的传单地图或关闭onClick

我在 React 中有一个 Leaflet 地图,使用react-leafletreact-leaflet-markercluster

集群似乎工作得很好,但如果我单击其中一个集群CircleMarker,或者Tooltip它打开一个新链接(我将其作为onClick),但不幸的是集群 Spiderfy 关闭,因此如果用户想要单击其他链接,他们需要重新打开(并重新蜘蛛化)簇,然后冲洗并重复。有什么方法可以让 Spiderfy 在单击时保持打开状态,并在缩小时关闭它(后者已经表现正常)?

例如,单击“Huckberry”将打开一个新链接,关闭工具提示:

在此输入图像描述

但不幸的是,单击 onClick 链接后,集群也会关闭并出现 Spiderfy:

在此输入图像描述

这是我的代码:

        <Map
          style={{ height: "480px", width: "100%", opacity: "0.9" }}
          zoom={screensizeZoom}
          maxZoom={20}
          center={[37.7687477, -99.6820275]}
          attributionControl={false}>
          <TileLayer url="https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r}.png"
            attribution="Map by <a href='http://stamen.com' target='_blank'>Stamen Design</a> | &copy; <a href='https://www.openstreetmap.org/copyright' target='_blank'>OpenStreetMap</a> contributors"
          />

          <AttributionControl position="bottomright" prefix={false} />

          <MarkerClusterGroup
            spiderfyDistanceMultiplier={1}
            showCoverageOnHover={false}
            maxClusterRadius={35}
          >
            {this.state.dataMaps.map((dataItem, k) => {
              let { coordinates, company, url, loc } = dataItem;
              return (
                <CircleMarker onClick={() …
Run Code Online (Sandbox Code Playgroud)

javascript leaflet reactjs leaflet.markercluster react-leaflet

5
推荐指数
0
解决办法
1465
查看次数