用標記更改座標打開圖層問題

我遇到了一個讓我發瘋的問題。我有一個可以正常工作的openlayers地圖項目。我把這個概念代碼移到了一個利用.Net的項目中，並且標記/圖標的投影變得混亂了。用標記更改座標打開圖層問題

//set the Icon/Marker that will be used 
    var iconStyle = new ol.style.Style({ 
    image: new ol.style.Icon(/** @type {olx.style.IconOptions} */({ 
     anchor: [0.5, 46], 
     anchorXUnits: 'fraction', 
     anchorYUnits: 'pixels', 
     opacity: 0.8, 
     src: '<%=PinMarkerImage%>' 
    })) 
    }); 
    var vectorLayer = new ol.layer.Vector({ 
    source: vectorSource, 
    style: iconStyle 
    }); 



//we will zoom the map to fit the locations after we create 
    //the map 
    var mapObj = new ol.Map({ 
     layers: [new ol.layer.Tile({ source: new ol.source.OSM() }), vectorLayer], 
     target: document.getElementById('map-canvas'), 
     view: new ol.View({ 
     center: ol.proj.fromLonLat([0, 0]), 
     zoom: 12 
     }) 
    }); 
    alert(vectorSource.getExtent()); 
    mapObj.getView().fit(vectorSource.getExtent(), { padding: [75, 40, 40, 75], constrainResolution: false }); 

//I pass in an object one at a time to populate the features 
    function changeMapOption(oBranch, i) { 
    // alert('selected'); 
    var long = oBranch.Longitude; 
    var lat = oBranch.Latitude; 
    alert(long + ' ' + lat); 
    //lastCord = ol.proj.transform([coord[0], coord[1]], 'EPSG:4326', 'EPSG:3857'); 
    var iconFeature = new ol.Feature({ 
     geometry: new ol.geom.Point(ol.proj.transform([long, lat], 'EPSG:4326', 'EPSG:3857')), //ol.proj.fromLonLat([long, lat])), 
     id: oBranch.Id, 
     title: oBranch.Name, 
     address: oBranch.Address + ", " + oBranch.City + ", " + oBranch.State + " " + oBranch.ZipCode 
    }); 

    //alert(iconFeature.getGeometry()); 
    vectorSource.addFeature(iconFeature); 

    //mapObj.getView().fit(vectorSource.getExtent(), { padding: [75, 40, 40, 75], constrainResolution: false }); 
    //target = mapObj.getTarget(); 
    //This will zoom the map to fit all of the vector Sources in vectorSource 
    //alert(vectorSource.getExtent()); 
    //mapObj.addOverlay(popup); 
    //jTarget = typeof target === "string" ? $("#" + target) : $(target); 
    //element = document.getElementById('popup'); 
    }

我有警報設置爲檢查經度和緯度。這些都是正確的。對於這個測試運行，我有三個對象被填充，經度和緯度如下： -112.04883,40.492104 -95.673328,29.95752 -95.638558,29.880014 當我運行代碼時，向vectorSource.getExtent（）產生這樣的結果： -12473218.699582075，-8426499.834030088，-10646435.576762961，-6361484.120029401

而且這些標記顯示出智利下游海岸。緯度是錯誤的，但經度似乎是正確的。

我當然可以在這裏使用一些指導。這真讓我抓狂。

感謝您的任何幫助。

來源

2017-03-09 Russell Walters

嘗試了多次後，我想出了一個可行的解決方案。希望這會幫助某個人。

 function loadMarker(oBranch, i) { 
      var sHTML = getMarkerInfoHtml(oBranch); 
      var long = oBranch.Longitude * 1; 
      var lat = oBranch.Latitude * 1; 
      var iconFeature = new ol.Feature({ 
       geometry: new ol.geom.Point(ol.proj.fromLonLat(([long, lat]))), 
       index: oBranch.Id, 
       id: oBranch.Id, 
       title: oBranch.Name, 
       address: sHTML  //oBranch.Address + ", " + oBranch.City + ", " + oBranch.State + " " + oBranch.ZipCode 
     }); 

     vectorSource.addFeature(iconFeature);   
    }

的關鍵是這兩行：

var long = oBranch.Longitude * 1; 
var lat = oBranch.Latitude * 1;

通過添加* 1到它迫使JavaScript才能正確對待變量的數字就行了。現在它將標記放置在正確的位置。

來源

2017-03-17 17:35:06

用標記更改座標打開圖層問題

回答

相關問題