Штифты, исчезающие на бинговых картах, когда карта подкрашена

Question

Я пытаюсь создать приложение сопоставления с Bing-картами с помощью кнопки, которая будет извлекать строку JSON и помещает контакты на карту в зависимости от центра карты.

Это работает нормально, но я столкнулся с двумя проблемами, которые возникают при диагностике.

Во-первых, когда я перемещаю карту после размещения контактов, большинство из них исчезает с карты, за исключением 1-3. Я понял, что булавки все еще хранятся в map.entities, но просто не все отображаются.

Вторая проблема заключается в том, что у меня есть событие щелчка на контактах, а иногда, когда я нажимаю на булавку, он исчезнет (а иногда снова появится в другом месте на карте).

Вот мой код:

function addPin() { 
    map.entities.clear();  
    var pinImg = "images/MapPin.jpg";  
    var latLong = {}; 
    var name; 

    for (var i = 0; i < factualJson.response.data.length; ++i) { 

     latLong['latitude'] = factualJson.response.data[i].latitude; 
     latLong['longitude'] = factualJson.response.data[i].longitude; 
     name = factualJson.response.data[i].name; 

     var pin = new Microsoft.Maps.Pushpin(latLong, { 
      icon: pinImg, 
      anchor: new Microsoft.Maps.Point(latLong['latitude'], latLong['longitude']), 
      draggable: true, 
      width: 48, 
      height: 48 
     }); 

     Microsoft.Maps.Events.addHandler(pin, 'click', displayName); 
     pin.title = name; 
     pin.id = 'pin' + i; 
     map.entities.push(pin);    
    } 

    document.getElementById("arrayLength").innerHTML = "Number of locations: " +   map.entities.getLength();  
} 

function displayName(e) { 

    document.getElementById("name").innerHTML = ""; 

    if (this.target.id != -1) {   
     document.getElementById("name").innerHTML = this.target.title; 
    } 
} 

function boot() { 
    Microsoft.Maps.loadModule('Microsoft.Maps.Overlays.Style', { callback: getMap });  
} 

function getMap() {  
    map = new Microsoft.Maps.Map($gel("bingMap"), { 
     credentials: getKey(), 
     customizeOverlays: true, 
     enableClickableLogo: true, 
     enableSearchLogo: true, 
     showDashboard: true, 
     showBreadcrumb: true, 
     showCopyright: true, 
     zoom: 10, 
     labelOverlay: Microsoft.Maps.LabelOverlay.hidden 
    });   

    setGeoLocation(); 
    //setTimeout(optimizeMap, 100); 

    window.onresize = resizeWin; 
    resizeWin(); 
} 

В настоящее время я делаю AJAX вызова с помощью кнопки, а также вызовов функций обратного вызова «AddPin», который добавляет булавки к карте. Я думал, что добавлю код инициализации карты, если это будет актуально. В настоящее время boot() вызывается при загрузке тела.

Answer 1

Как всегда мне нужно задать вопрос, прежде чем я сам это выясню.

Проблема была в том, что мне нужно было нажать объект местоположения Microsoft в контакт, а не на объект. Например:

var loc = new Microsoft.Maps.Location(47.592, -122.332); 

И НЕ мой объект latLong.

Это также помогло устранить проблему исчезновения контактов на событии кликов.

Answer 2

Для меня решение было похож на ваш @canadian кодировщика

Microsoft.Maps.Location() принимает только поплавка значение, нет строки и Int.

Я использую архитектуру MVC и передал строку с использованием модели. Позже я преобразовал эту строку в float и перешел в Location. Проблема решена.

var pushpin = new Microsoft.Maps.Pushpin(
center, { icon: '/Content/BingPushpin.png', width: 50, height: 50, draggable: false }); 
pushpin.setLocation(new Microsoft.Maps.Location 
(parseFloat(@Model.Latitude) , parseFloat(@Model.Longitude))); 
dataLayer.push(pushpin); 
locations.push(new Microsoft.Maps.Location 
(parseFloat(@Model.Latitude) , parseFloat(@Model.Longitude))); 

EDIT:

Позже выяснилось, что проблема все еще существует. Другая причина может заключаться в том, что вы вызываете эту карту для загрузки дважды. Поэтому проверьте любой другой экземпляр загружаемой карты. В моем случае см. Ниже.

$(document).ready(function() { 
loadSearchModule(); //calling Map to Load at a div without pushpins 

//code to do something 

getMapOnLocation(); 
} 

function getMapOnLocation() 
{//code to display map with pushpin 
} 

В приведенном выше примере я говорил контроль, чтобы загрузить свою карту с PushPins и когда страница полностью загружена загрузить карту без защелки. Надеюсь, что это поможет :)