Openlayers 标记出现在地图中心

发布于 2024-10-15 15:18:23 字数 1654 浏览 4 评论 0原文

我有一个新标记要放置在地图上。我使用以下代码

var markers = [{'ID':'431','LATITUDE':-33.85491,'LONGITUDE':151.19877}];
var map, layer;

function loadMarkers(POIs){
    var markers = new OpenLayers.Layer.Markers( "Markers" );
    map.addLayer(markers);
    var size = new OpenLayers.Size(10,17);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    for (var i=0;i<POIs.length;i++){
       var MarkerDef = POIs[i];
       var icon = new OpenLayers.Icon(
         'http://openlayers.org/dev/img/marker-gold.png',
         size,offset);
       var LonLat = new OpenLayers.LonLat(
           MarkerDef.LONGITUDE,MarkerDef.LATITUDE);
       var marker = new OpenLayers.Marker(LonLat,icon);

       markers.addMarker(marker);
    }

    map.addControl(new OpenLayers.Control.Permalink());
    if (!map.getCenter()) map.zoomToMaxExtent();
 }

 function init(){
    OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
    map = new OpenLayers.Map( $('map'), 
      {'maxResolution': 360/512});

    var tiles_url = "http://xxx.xx.xxx.xx:8000/";

    var tilelite_layer = new OpenLayers.Layer.OSM(
      "Mapnik", 
      tiles_url + '${z}/${x}/${y}.png');

    tilelite_layer.attribution = 
      "Data served by "+
      "<a href='http://bitbucket.org/springmeyer/tilelite/'>"+
      "TileLite</a>";

    var osm_official_tiles = new OpenLayers.Layer.OSM(
      "OpenStreetMap Mapnik Server (Mod_tile)");
    osm_official_tiles.attribution = 
      "Map Data CC-BY-SA Openstreetmap.org";
    map.addLayers([tilelite_layer,osm_official_tiles]);

    loadMarkers(markers);
}

地图绘制正确,一切正常,除了标记没有出现在-33.85491,151.19877。它出现在地图的中间。 欢迎任何建议。

I have a new marker to place on the map. I use the following code

var markers = [{'ID':'431','LATITUDE':-33.85491,'LONGITUDE':151.19877}];
var map, layer;

function loadMarkers(POIs){
    var markers = new OpenLayers.Layer.Markers( "Markers" );
    map.addLayer(markers);
    var size = new OpenLayers.Size(10,17);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    for (var i=0;i<POIs.length;i++){
       var MarkerDef = POIs[i];
       var icon = new OpenLayers.Icon(
         'http://openlayers.org/dev/img/marker-gold.png',
         size,offset);
       var LonLat = new OpenLayers.LonLat(
           MarkerDef.LONGITUDE,MarkerDef.LATITUDE);
       var marker = new OpenLayers.Marker(LonLat,icon);

       markers.addMarker(marker);
    }

    map.addControl(new OpenLayers.Control.Permalink());
    if (!map.getCenter()) map.zoomToMaxExtent();
 }

 function init(){
    OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
    map = new OpenLayers.Map( $('map'), 
      {'maxResolution': 360/512});

    var tiles_url = "http://xxx.xx.xxx.xx:8000/";

    var tilelite_layer = new OpenLayers.Layer.OSM(
      "Mapnik", 
      tiles_url + '${z}/${x}/${y}.png');

    tilelite_layer.attribution = 
      "Data served by "+
      "<a href='http://bitbucket.org/springmeyer/tilelite/'>"+
      "TileLite</a>";

    var osm_official_tiles = new OpenLayers.Layer.OSM(
      "OpenStreetMap Mapnik Server (Mod_tile)");
    osm_official_tiles.attribution = 
      "Map Data CC-BY-SA Openstreetmap.org";
    map.addLayers([tilelite_layer,osm_official_tiles]);

    loadMarkers(markers);
}

The map is drawn correctly and everything is ok, except that the marker does not appear at -33.85491,151.19877. It appears in the middle of the map.
Any suggestions are welcome.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

贩梦商人 2024-10-22 15:18:23

解决了问题,我需要更改投影:

 var LonLat = new OpenLayers.LonLat( MarkerDef.LONGITUDE,MarkerDef.LATITUDE )
      .transform(
        new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
        map.getProjectionObject() // to Spherical Mercator Projection
      );

Fixed the problem, I needed to change the projection:

 var LonLat = new OpenLayers.LonLat( MarkerDef.LONGITUDE,MarkerDef.LATITUDE )
      .transform(
        new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
        map.getProjectionObject() // to Spherical Mercator Projection
      );
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文