0

我正在使用传单和传单路由机器控制库。

当我创建一些路由路径时,我有以下代码:

this.routingControl = L['Routing'].control({
      router: L['Routing'].osrmv1({
        serviceUrl: `http://router.project-osrm.org/route/v1/`,
        language: 'en',
        profile: 'car'
      }),
      showAlternatives: false,
      lineOptions: { styles: [{ color: '#4caf50', weight: 7 }] },
      fitSelectedRoutes: true,
      altLineOptions: { styles: [{ color: '#ed6852', weight: 7 }] },
      show: false,
      routeWhileDragging: true,
      addWaypoints: false,
      waypoints: [
        L.latLng(clickedLat, clickedLng),
        L.latLng(this.selectedCityZipCodeObject.longitude, this.selectedCityZipCodeObject.latitude)
      ],
      createMarker: function (i: number, waypoint: any, n: number) {
        return null;
      }

    });

注意:如果我有

fitSelectedRoutes:false

然后当我点击某个标记时,它应该制作路线路径,直到显示弹出的其他标记。但如果我有

fitSelectedRoutes:true

然后当我单击标记时,它会显示弹出窗口。但是地图缩放已更改以适合标记之间中心的路线路径,并且我有较小的缩放,这是从库中自动完成的。

然后我的弹出窗口在缩放自动更改时关闭。我怎样才能防止这种情况发生?

我发现每次在地图上触发这段代码时,它都会在有动作时自行触发

this.map.on('zoomend', function(){
 thatt.lastEvent.target.unbindPopup()
        .bindPopup(`
        <div><b>Dispatcher:</b></div>
        `).openPopup();
});

我试图获取最后一个标记并打开弹出窗口但没有成功。

我也试过

that.lastEvent.target
          .unbindPopup()
          .bindPopup(`
          <div><b>Dispatcher:</b> ${truckLocationObj?.dispatcher}</div>
          <div><b>Dispatcher Email:</b> ${truckLocationObj?.dispatcher_email}</div>
          <div><b>Truck #:</b> ${truckLocationObj?.truck}</div>
          <div><b>ZIP</b> ${truckLocationObj?.available_zip} </div>
          <div><b>City:</b> ${truckLocationObj?.available_city}</div>
          <div class='red'><b>Distance:</b> ${distance} km to ${that.selectedCityZipCodeObject.city}, time: ${getHm}</div>
          <div><b>Available on:</b> ${truckLocationObj?.available_date}</div>
          `, {closePopupOnClick: false, autoClose: false, closeOnClick:false, autopanstart:false}).openPopup();

弹出窗口本身有附加选项,但也没有成功。

4

1 回答 1

0

所以 fitSelectedRoutes - true 使两个标记的拟合范围类似。

 var corner1 = L.latLng(0,0);
 var corner2 = L.latLng(39.310, -84.432);
 let bounds = L.latLngBounds(corner1, corner2);
 map.fitBounds(bounds, { padding: [50, 50] });

有了这个答案,问题就解决了。

https://stackoverflow.com/questions/51953050/leaflet-markercluster-exempt-marker-from-clustering
https://jsfiddle.net/sghL4z96/65/
于 2020-11-24T10:44:58.030 回答