Информационный ящик для Bing Maps

Question

В настоящее время я работаю над приложением бинговых карт, и я не могу заставить информационное окно появляться, когда пользователь нажимает на контакт. Я слежу за SDK, и это должно быть почти то же самое. Вот что у меня есть:

// *********************************** 
// Function creates a single pin 
// and returns a reference to the pin 

function createMapPin(latLong, sName) { 
    var pinImg = "imagespins/Good.png"; 


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

pin.title = sName; 


pinInfobox = new Microsoft.Maps.Infobox(pin.getLocation(), 
      { title: 'My Pushpin', 
       description: 'This pushpin is located at (0,0).', 
       visible: false, 
       offset: new Microsoft.Maps.Point(0, 15) 
      }); 



// Add handlers for the pushpin events 
    Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox); 
// Hide the infobox when the map is moved. 
Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox); 

map.entities.push(pin); 
map.entities.push(pinInfobox); 

    return pin; 
} 

function displayInfobox(e) { 
    pinInfobox.setOptions({ visible: true }); 
} 


function hideInfobox(e) { 
    pinInfobox.setOptions({ visible: false }); 
} 

Штифты получить созданы и добавлены к карте и успешно, когда пользователь нажимает на штыре он делает ввести метод dispayInfoBox но MessageBox просто не кажется, появляются.

Любые предложения очень опасны. Благодаря!

Answer 1

ваш код работает, я пробовал, если вы только звоните createMapPin() один раз. Но, судя по вашему коду, вы намерены называть createMapPin() несколько раз, и это приведет к тому, что infobox перестанет вести себя так, как вы думаете. Причина эта линия:

pinInfobox = new Microsoft.Maps.Infobox(pin.getLocation(), 
      { title: 'My Pushpin', 
       description: 'This pushpin is located at (0,0).', 
       visible: false, 
       offset: new Microsoft.Maps.Point(0, 15) 
      }); 

, так как вы не объявлял pinInfobox в качестве локальной переменной через var ключевое слово, оно неявно получает объявлена ​​как глобальная переменная. Я не думаю, что это ваше намерение, потому что как только вы снова вызовете createMapPin(), pinInfobox, потому что это глобальная переменная, будет перезаписана. Таким образом, несмотря на то, что вы продолжаете создавать новые инфобоксы, есть только один экземпляр, и он просто продолжает получать новые значения. Поэтому, если вы нажмете на кнопку, одна инфобокс, вероятно, появится где-то вне экрана, и вы ее не увидите. Я считаю, что ваше намерение состоит в том, чтобы иметь одну инфобокса, связанную с каждым нажатием кнопки? Чтобы сделать это, вам нужно объявить информационное поле в качестве локальной переменной, например, так:

var pinInfobox = new Microsoft.Maps.Infobox(pin.getLocation(), 
     { title: 'My Pushpin', 
      description: 'This pushpin is located at (0,0).', 
      visible: false, 
      offset: new Microsoft.Maps.Point(0, 15) 
     }); 

Вам также потребуется изменить обработчики событий для взаимодействия с локальной версией объекта инфокиоск, а не только одного глобальная переменная. Самый простой способ сделать это, чтобы просто объявить обработчики событий, как анонимные функции в рамках вашей createMapPin() функции, и переопределить значение этого ключевого слова с помощью функции связывания:

Microsoft.Maps.Events.addHandler(pin, 'click', function (e) { 
    this.setOptions({ visible: true }); 
} .bind(pinInfobox)); 
Microsoft.Maps.Events.addHandler(map, 'viewchange', function(e) { 
    this.setOptions({ visible: false }); 
}.bind(pinInfobox)); 

так вот ваш обновленный код:

function createMapPin(latLong, sName) { 
    var pinImg = "imagespins/Good.png"; 

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

    pin.title = sName; 

    var pinInfobox = new Microsoft.Maps.Infobox(pin.getLocation(), 
     { 
      title: 'My Pushpin', 
      description: 'This pushpin is located at (0,0).', 
      visible: false, 
      offset: new Microsoft.Maps.Point(0, 15) 
     }); 

    // Add handlers for the pushpin events 
    Microsoft.Maps.Events.addHandler(pin, 'click', function(e) { 
     this.setOptions({ visible: true }); 
    }.bind(pinInfobox)); 
    // Hide the infobox when the map is moved. 
    Microsoft.Maps.Events.addHandler(map, 'viewchange', function(e) { 
     this.setOptions({ visible: false }); 
    }.bind(pinInfobox)); 
    map.entities.push(pin); 
    map.entities.push(pinInfobox); 
    return pin; 
}