マーカが座標を変更してレイヤーを開く問題

Question

私は夢中になっている問題があります。私は正常に動作する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'); 
    } 

私はアラートを設定して経度と緯度を確認しました。これらは正しい。次のように私が移入され、3つのオブジェクトを持って、このテスト実行のために、経度と緯度は、次のとおりです。 -112.04883、40.492104 -95.673328、29.95752 -95.638558、29.880014 を私はvectorSource.getExtent（のコードの警告を実行すると） -12473218.699582075、-8426499.834030088、-10646435.576762961、-6361484.120029401

そして、マーカーはチリの下の海岸に現れます。 Latitudeは間違っていますが、経度は正しいようです。

私は確かにここでいくつかの指針を使用することができます。これは私を夢中にさせている。

ありがとうございます。

Answer 1

複数回試した後、私はうまくいくソリューションを考え出しました。うまくいけば、これが誰かを助けるでしょう。それが数値として適切に変数を処理するためにJavaScriptを強制的に行に* 1を追加することにより、

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

：

 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);   
    } 

キーは、次の2行でした。これでマーカーが正しい場所に配置されます。