Пины исчезают на картах Bing при панорамировании карты

Я пытаюсь создать картографическое приложение с Bing Maps с помощью кнопки, которая будет извлекать строку 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() вызывается при загрузке тела.


javascript bing map
person Canadian Coder    schedule 01.02.2014    source источник

Ответы (2)


arrow_upward
1
arrow_downward

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

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

ИЗМЕНИТЬ:

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

$(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
}

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

person Preshma Linet Pereira    schedule 20.04.2016

arrow_upward
0
arrow_downward

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

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

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

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

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

person Canadian Coder    schedule 01.02.2014