Come faccio Center e mostri un infobox in Bing Maps?

Question

Il mio codice fa un .pantolatlong poi un .showinfobox

La casella informazioni non viene visualizzata, a meno che non posso rimuovere la pantolatlong. Credo che sia fermarlo. Ho provato ad aggiungere alla manifestazione endpan, ma che non ha funzionato.

Qual è il modo più semplice per eseguire una panoramica a una puntina da disegno e visualizzare l'infobox per questo?

usavo setcenter, ma ho scoperto che le pentole a volte setcenter, e questo rompe.

Answer 1

Dopo un po 'googling folle, mi si avvicinò con la soluzione, e io condividerle qui in modo che gli altri possano spera non avere il dolore che ho passato.

ho creato e potenza la mia mappa di Bing utilizzando JavaScript puro, nessuna soluzione SDK o iframe. Nel mio codice, ho generare il codice JavaScript per aggiungere tutti i pin che voglio la mappa, e iniettare utilizzando un'etichetta asp.net.

Se si chiama il metodo setCenter () sul tuo Bing Map, si suppone per impostare immediatamente la mappa, sorpresa sorpresa, alle coordinate specificate. E lo fa ... la maggior parte del tempo. Di tanto in tanto, però, decide di eseguire una panoramica tra i punti. Se fate una SetCenter, seguito da uno ShowInfoBox, funzionerà grande, a meno che non decida di pan.

La soluzione? Essendo grandi programmatori siamo, ci tuffiamo in sdk, e rivela ci sono eventi che possiamo collegare in per affrontare queste. C'è un evento onendpan, che viene attivato dopo una pentola è stata completata. C'è anche un evento onchangeview, che innesca quando la mappa salta.

Così abbiamo collegare in questi eventi, e cerchiamo di visualizzare l'infobox per la nostra forma puntina da disegno ... ma non succede nulla. Perché no?

Si deve dare un pochi millisecondi a riprendere fiato, per ragioni sconosciute, quando l'evento viene chiamato. Utilizzando un setTimeout con 10 millesimi di secondo sembra essere fine. La tua casella apparirà grande dopo questo.

Il problema successivo è, desideri solo che appaia quando padelle tramite qualunque cosa che hai usato per renderlo flick tra le puntine da disegno (nel mio caso, un tavolo con i metodi onclick). Creo / distruggere i gestori di eventi al volo, anche se ci sono altre opzioni come l'utilizzo di una variabile globale per monitorare se l'utente effettua una scansione panoramica, o se il sistema effettua una scansione panoramica in risposta a un clic.

Infine, si ha quello bug che viene da questo. Se si fa clic su un posto nella vostra lista, e salta / pentole a quella posizione, l'infobox mostrerà bene. Se l'utente chiude, però, poi fa clic di nuovo sulla voce dell'elenco, la mappa non si muove, e quindi non c'è nessun evento attivato.

La mia soluzione a questo è di rilevare se la mappa spostato o no, registrando la sua lunga / lat, e utilizzando un altro metodo setTimeout, rilevare se hanno cambiato 100ms dopo. Se così non fosse, visualizzare l'infobox.

Ci sono altre cose che dovete tenere traccia di, in quanto non v'è alcun modo che posso vedere per passare parametri alle eventhandlers in modo da utilizzare variabili JavaScript globali per questo - dovete sapere che forma puntina da disegno si sta visualizzando, e anche tenere traccia delle mapcoordinates precedenti prima di controllare per vedere se hanno cambiato.

Mi c'è voluto un po 'di mettere insieme tutto questo, ma sembra funzionare. Ecco il mio codice, alcune sezioni vengono rimosse:

// An array of our pins to allow panning to them
var myPushPins = [];

// Used by the eventhandler
var eventPinIndex;
var oldMapCenter;

// Zoom in and center on a pin, then show its information box
function ShowPushPin(pinIndex) {
    eventPinIndex = pinIndex;
    oldMapCenter = map.GetCenter();
    map.AttachEvent("onendpan", EndPanHandler);
    map.AttachEvent("onchangeview", ChangeViewHandler);
    setTimeout("DetectNoMapChange();", 200);

    map.SetZoomLevel(9);
    map.SetCenter(myPushPins[pinIndex].GetPoints()[0]);

}


function EndPanHandler(e) {
    map.DetachEvent("onendpan", EndPanHandler);

    setTimeout("map.ShowInfoBox(myPushPins[eventPinIndex]);", 10);

}

function ChangeViewHandler(e) {
    map.DetachEvent("onchangeview", ChangeViewHandler);

    setTimeout("map.ShowInfoBox(myPushPins[eventPinIndex]);", 10);

}

function DetectNoMapChange(centerofmap) {

    if (map.GetCenter().Latitude == oldMapCenter.Latitude && map.GetCenter().Longitude == oldMapCenter.Longitude) {
        map.ShowInfoBox(myPushPins[eventPinIndex]);
    }
}

Answer 2

Ecco un altro modo:

    function addPushpin(lat,lon,pinNumber) {
    var pinLocation = new Microsoft.Maps.Location(lat, lon);

    var pin = new Microsoft.Maps.Pushpin(map.getCenter(), { text: pinNumber.toString() });

    pinInfobox = new Microsoft.Maps.Infobox(pinLocation,
            { title: 'Details',
                description: 'Latitude: ' + lat.toString() + ' Longitude: ' + lon.toString(),
                offset: new Microsoft.Maps.Point(0, 15)
            });


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

    pin.setLocation(pinLocation);
    map.setView({ center: pinLocation});
}