locked
Facing problem with infoboxes in Bing Maps Ajax 7 RRS feed

  • Question

  • I have a "mouse over" event on all pushpins on the map to display its corresponding Infobox.

    Additionally i have a "mouse out" event on the "infoboxes" to hide them once the user moves over the infobox.

    I had to capture the information about each pushpin on a "drag start" and "drag end" which i am able to do as required BUT now the problem is that the moment i start dragging any pushpin and also end my drag, MULTIPLE INFOBOXES are appearing. I donot want these infoboxes. I tried many ways of removing/hiding them but was unsuccessfull.  

    I create the following infobox on the mouse over event through following code:


            function displayInfobox(e) {
                if (e.targetType == 'pushpin') {

                    //var start = window.confirm("do you want to set this pin as Start point for the route?");
                    //if (start) {
                    //e.target.setOptions({ icon: 'Images/StartPin.png', draggable: true });
                    // }

                    var pinLoc = e.target.getLocation();
                    //alert("The location of the pushpin is now " + pinLoc.latitude + ", " + pinLoc.longitude);

                    var lat = pinLoc.latitude;
                    var long = pinLoc.longitude;
                    latPrecision = lat.toFixed(5);
                    longPrecision = long.toFixed(5);

                    var infoboxOptions = { width: 200, height: 100, showCloseButton: true, zIndex: 0, offset: new Microsoft.Maps.Point(10, 0), showPointer: true };
                    infobox = new Microsoft.Maps.Infobox(e.target.getLocation(), infoboxOptions);
                    infobox.setHtmlContent('<div id="infoboxText" style="background-color:White;border-style:solid;border-width:medium; border-color:DarkOrange; min-height:180px; width:180px;"><br/> Trip Name: ' + tripName + ' <br/>Latitude: ' + latPrecision + '<br/>Longitude: ' + longPrecision + '<br/>Right click on a pin to remove it<input type= "button"  value="Set as START" onclick="setStartPin(latPrecision,longPrecision)" size=10><a class="infobox_close" href="javascript:hideInfobox()"><img src="Images/ClosePin.png"/></a></div>');
                    Microsoft.Maps.Events.addHandler(infobox, 'mouseleave', function () { infobox.setOptions({ visible: false }); });
                    //Microsoft.Maps.Events.addHandler(defaultInfobox, 'mouseleave', function () {displayAlert('Infobox Mouse out');});   
                    infoboxLayer.push(infobox);
                    //map.entities.push(infobox);

                }

            }


    anwesha

    Friday, September 14, 2012 10:25 AM

Answers