2012-03-19 2 views
0

OpenLayers에 대한 새로운 소식입니다. 잠시 동안 Google지도를 사용해 왔지만 좀 더 개방적으로 전환하고 싶습니다. 예제에서 나는 온라인에서 본 다른 질문에 대한 답변을 보았습니다.이 기본지도에 요점이 있습니다. http://pastie.org/3625219OpenLayers - 포인트 이동시 위도/경도보기

이동 한 후 위도/경도를 얻고 싶습니다. 그것. 내가 겪고있는 문제는 프로젝션을 900913에서 4326으로 ​​다시 변환하는 것입니다. 변환을 시도한 모든 것이 다시 공백으로 나타납니다.

그래! 나는 기본적인 것을 놓치고 있다고 확신한다 ... Javascript는 제 모국어가 아닙니다. 모든 포인터는 감사하겠습니다.

답변

3

x 좌표와 y 좌표를 별도로 변환 할 필요가 없습니다. 피쳐 또는 피쳐의 형상을 복제하고 형상을 변형해야합니다. 예 :

point_transformed = feature.clone().geometry.transform(epsg900913, epsg4326); 

코드 here을 참조하십시오.

+0

그랬습니다! 고맙습니다! –

0

@scottB이 코드는 각 레이어의 올바른 변형을 식별하는 방법을 보여줍니다. openlayers에서 작동하는 프로젝션은 openstreetmaps (이는 mercator 구형 프로젝션)와 자동으로 작동하지 않을 수 있습니다.

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" debug="true"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <title>MousePosition Control</title> 
    <link rel="stylesheet" href="http://openlayers.org/dev/theme/default/style.css" type="text/css"> 
    <link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css"> 
    <script src="../OpenLayers.js"></script> 
    <script type="text/javascript"> 
     var map; 
     function init(){ 
      var map = new OpenLayers.Map('map'); 
      var proj4326 = new OpenLayers.Projection("EPSG:4326"); 
      var projmerc = new OpenLayers.Projection("EPSG:900913"); 
      var layerOSM = new OpenLayers.Layer.OSM("Street Map"); 
      map.addLayers([layerOSM]); 
      if (!map.getCenter()) map.zoomToMaxExtent(); 
      map.events.register("mousemove", map, function(e) { 
       var position = this.events.getMousePosition(e); 
       OpenLayers.Util.getElement("coords").innerHTML = 'MOUSE POSITION '+position; 
       var lonlat = map.getLonLatFromPixel(this.events.getMousePosition(e)); 
       OpenLayers.Util.getElement("lonlatTG").innerHTML = 'lonlat => '+lonlat; 
       var lonlatTransf = lonlat.transform(map.getProjectionObject(), proj4326); 
       OpenLayers.Util.getElement("lonlatTrans").innerHTML = 'lonlatTransf => '+lonlatTransf; 
       OpenLayers.Util.getElement("lonlatDouble").innerHTML = 'lonlat => '+lonlat; 
      }); 

      map.events.register("click", map, function(e) { 
       var position = this.events.getMousePosition(e); 
       var icon = new OpenLayers.Icon('http://maps.google.com/mapfiles/ms/icons/red-pushpin.png'); 
       var lonlat = map.getLonLatFromPixel(position); 
       var lonlatTransf = lonlat.transform(map.getProjectionObject(), proj4326); 
       alert ('lonlatTrans=> lat='+lonlatTransf.lat+' lon='+lonlatTransf.lon+'\nlonlat=>'+lonlat+'\nposition=>'+position); 
       var lonlat = lonlatTransf.transform(proj4326, map.getProjectionObject()); 
       var markerslayer = new OpenLayers.Layer.Markers("Markers"); 
       markerslayer.addMarker(new OpenLayers.Marker(lonlat, icon)); 
       map.addLayer(markerslayer); 
      }); 
      map.addControl(new OpenLayers.Control.LayerSwitcher()); 
     } 
    </script> 
    </head> 

    <body onload="init()"> 
    <h1 id="title">MousePosition Control</h1> 
    <div id="tags">coordinate</div> 
    <p>Click on map and create marker</p> 
    <div id="map" class="smallmap"></div> 
    <div id="coords"></div> 
    <div id="lonlatTG"></div> 
    <div id="lonlatTrans"></div><br/> 
    <p> 
    see how, even though we did NOT transform [lonlat], 
    <br/>it was nevertheless transformed 
    </p> 
    <div id="lonlatDouble"></div> 

    </body> 
</html> 
을 openlayers을 클릭하여

    위도 저장
  1. 및 마커 위치의 경도
  2. 장소 마커지도 :

    는 내가이 일을 수행 할 수 있도록 this example from openlayers 적응

    이 간단한 기능에 사용 된 LonLat의 변환 방법과 관련하여 알아야 할 것이 있습니다 예 : [.transform (projection1, projection2)]을 LonLat에 적용하면 모든 LonLat 객체가 변형됩니다.

    특정 명령의 순서로 놀면 내 뜻을 알 수 있습니다.