Question

I am having an issue with a dynamic Ovi / Nokia map whereby I want to reload the markers every 30 seconds – markers are read from XML and have dynamic content. Everything works fine except for the bubble. It shows on load only and then on first refresh marker is no longer clickable (changes to zoom when clicked on it). I want the updated marker to show the latest html content in the bubble too:

<script> 
var markerCoords;
var mapContainer;
var container;
var myMap;
var bubbles=new Array();

// When the HTML page body section is loaded this function will be called.
// This function gets passed the marker XML data file name
var updateTime=30;   
var updateTime=1000*updateTime;
var markerUpdate=self.setInterval("placeMarkersOnMaps('geomarkers.xml')",updateTime);
function placeMarkersOnMaps(filename) 
{
var counter = 0;
$.ajax({
    type: "GET",
    url: filename ,
    dataType: "xml",
    success: parseXml,
              error : err
  });

}
function err (){
        alert("An Error has occurred.");
}

// Here we create an Nokia Maps within a Container.

mapContainer = document.getElementById("mapContainer");


myMap = nokia.maps.map,     
                map = new myMap.Display(mapContainer, {
                    center: [52.59, 13.3], zoomLevel: 2,
                    components: [ new myMap.component.Behavior(),
                                  new nokia.maps.map.component.ZoomBar(),
                                  new nokia.maps.map.component.Overview(),                             
                                  new nokia.maps.map.component.TypeSelector(),     
                                  new nokia.maps.map.component.ScaleBar()
                   ]
                });



  placeMarkersOnMaps('geomarkers.xml');






        function deleteMarker(coords) {
            var marker;
            for (i=0; i< map.objects.getLength(); i++) {
                if ( map.objects.get(i) instanceof nokia.maps.map.StandardMarker ) {
                    if ( coords.latitude ==  map.objects.get(i)..coords.latitude
                    && coords.longitude ==  map.objects.get(i)..coords.longitude ){
                        marker = map.objects.get(i);
                        marker.removeListener("click", function(evt) { infoBubbles.addBubble(evt.target.$html, evt.target.coordinate);}, false);;
                        map.objects.remove (marker);
                        break;
                    }
                }
            }
            return marker;
        }
function parseXml(xml)
{
    var infoBubbles = new nokia.maps.map.component.InfoBubbles();   
    map.addComponent( infoBubbles); 
    var container = new nokia.maps.map.Container();
    $(xml).find("marker").each(function(){

            //Read the name, address, latitude and longitude for each Marker
            var nme = $(this).find('name').text();
            var address = $(this).find('address').text();
            var lat = $(this).find('lat').text();
            var lng = $(this).find('lng').text();
            var zhtml = $(this).find('zhtml').text();
            var zcolor = $(this).find('zcolor').text();

            //Put each marker on the map as the data has been read.

            var markerCoords = new nokia.maps.geo.Coordinate(parseFloat(lat), parseFloat(lng));    

            var marker = new nokia.maps.map.StandardMarker(markerCoords, {text:nme, brush:{color:zcolor}, $html:zhtml});
            marker.addListener('click' ,  function(evt) { infoBubbles.addBubble(evt.target.$html, evt.target.coordinate);}, false); 
            container.objects.add(marker);      

        });
        // Add the marker container .
        map.objects.add(container);
        // Zoom into the markers.



}


</script>

Answer 1

It looks like the lines intialising the infobubble are in the wrong place:

var infoBubbles = new nokia.maps.map.component.InfoBubbles();   
    map.addComponent( infoBubbles); 

Should be placed before the line

  placeMarkersOnMaps('geomarkers.xml');

Otherwise you are attempting to add an info bubble component every time placeMarkersOnMaps() is run. There is usually only one.

Also your deleteMarkers function could be replaced by

 myMap.objects.clear();