0

我需要当地图接近/离开时,不要擦除标记。

我的脚本是这样的:

JS

 $(document).ready(function() {
   //init 
   var map;
   var posMarcador; // Posicion del marcador

   var options = {
     restrictedExtent: extent,
     controls: [
       new OpenLayers.Control.Navigation(),
       new OpenLayers.Control.PanZoomBar(),
       new OpenLayers.Control.Attribution()
     ]
   };

   var position = new OpenLayers.LonLat(lon, lat).transform( fromProjection, toProjection);
   map = new OpenLayers.Map( 'map', options);
   layerBase = new OpenLayers.Layer.OSM();
   map.addLayer(layerBase);
   map.setCenter(extent.getCenterLonLat(), zoom);

   map.isValidZoomLevel = function(zoomLevel) {
     return ( (zoomLevel != null) &&
              (zoomLevel >= 11) && // set min level here, could read from property
              (zoomLevel < 17) );
   }

   var iconImage = //url image


   /**
    * Marcador
    * @type {OpenLayers.Layer.Markers}
    */
   var layerMarkers = new OpenLayers.Layer.Markers( "Markers" );
   map.addLayer(layerMarkers);

   map.events.register("click", map, function(e) {
     layerMarkers.clearMarkers();
     var position = map.getLonLatFromViewPortPx(e.xy);
     posMarcador = new OpenLayers.LonLat(position.lon, position.lat);
     var size = new OpenLayers.Size(50,50);
     var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
     var icon = new OpenLayers.Icon(iconImage(tipoIcono), size, offset);
     layerMarkers.addMarker(new OpenLayers.Marker(posMarcador, icon));
     posMarcador =   posMarcador.transform(toProjection  , fromProjection );
     $('input[name="geopunto.latitud"]').val(posMarcador.lat);
     $('input[name="geopunto.longitud"]').val(posMarcador.lon);
  });
});

我的观点是:

<div id="map"></div>

当我放置一个静态点(取消注册点击事件)时,它可以正常工作。我希望你能帮忙。

4

1 回答 1

1

您正在将新标记的位置保存在posMarcador. 缩放地图后,您应该重复使用它。我制作了一个单独的函数以重复使用以放置标记,在您的情况下,它可能类似于:

function addNewMarker(pos) {
    posMarcador = pos;     // save pos

    var size = new OpenLayers.Size(50,50);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    var icon = new OpenLayers.Icon(iconImage(tipoIcono), size, offset);

    layerMarkers.addMarker(new OpenLayers.Marker(posMarcador, icon));            

    var np = pos.transform(map.getProjectionObject(), new OpenLayers.Projection("EPSG:4326"));
    $('input[name="geopunto.latitud"]').val(np.lon.toFixed(6));
    $('input[name="geopunto.longitud"]').val(np.lat.toFixed(6));
}

当您单击标记时,将放置:

map.events.register('click', map, function(ev) {
    layerMarkers.clearMarkers();
    var position = map.getLonLatFromViewPortPx(ev.xy);
    addNewMarker(position);
});

现在将函数绑定到zoomendmap 的事件。

map.events.register('zoomend', map, function(ev){
    if (posMarcador != undefined) {
        var np = new OpenLayers.LonLat(posMarcador.lon, posMarcador.lat).transform(
            new OpenLayers.Projection("EPSG:4326"),  // from WGS 1984
            map.getProjectionObject()  // Spherical Mercator
        );
        addNewMarker(np);
    }
});

为了这个例子,我使用了适当的投影new OpenLayers.Projection("EPSG:4326"),而不是变量toProjectionfromProjection。也许这有帮助。

于 2013-11-20T17:00:29.593 回答