9

he creado un mapa que estoy tratando de tener una función similar a 'My Maps'. Tengo dos listas desplegables en el lado derecho, en función de la selección en esos ddl, puede agregar un marcador/icono personalizado. Selecciona un tipo de marcador, luego haz clic en el botón "+" en la esquina superior derecha del mapa y luego haz clic donde quieras que se agregue el marcador. Mi problema es que esto funciona bien en IE, Safari y Chrome, pero no en Firefox. El evento click no parece dispararse.Google Maps API v3: haga clic en eventos no activados en Firefox para el marcador personalizado

aquí es la ubicación del mapa: https://ait.saultcollege.ca/Michael.Armstrong/Index.html

el botón para añadir el marcador en la parte superior derecha tiene un evento onclick que apunta a la función 'placemarker()'. Aquí está el código de marcador de lugar(), createMarker() ...

 
function placeMarker() { 

    select("placeMarker"); 

    var infowindow = new google.maps.InfoWindow({}); 
    var catID = document.getElementById('category'); 
    var typeID = document.getElementById('ddlType'); 
    var category = catID.options[catID.selectedIndex].value; 
    var markerType = typeID.options[typeID.selectedIndex].value; 

    if (!markerType) { 
     alert("You must select an icon type."); 
    } 
    else { 
     var moveListener = google.maps.event.addListener(customMap, 'mousemove', function(event) { 
      if (mapMarker) { 
       mapMarker.setPosition(event.latLng); 
      } else { 
       mapMarker = createMarker(event.latLng, "test", markerType, "test"); 
      } 
     }); 

     var clickListener = google.maps.event.addListener(customMap, 'click', function(event) { 
      if (mapMarker) { 
       select("hand_b"); 
       google.maps.event.clearListeners(customMap, 'mousemove'); 
       google.maps.event.removeListener(listener); 
       mapMarker = createMarker(event.latLng, "test2", markerType, "test"); 

       var htmlInfo = "" + 
        "Category:" + category + "" + 
        "Item:" + markerType + "" + 
        "Notes:" + 
        "Location:" + mapMarker.getPosition().toString() + "" + 
        "" + 
        ""; 

       //infowindow.setContent(htmlInfo); 
       //infowindow.open(customMap, mapMarker); 
      } 
     }); 
    } 
} 

function createMarker(latlng, title, icon, html) { 
    var mapMarker = new google.maps.Marker({ 
     position: latlng, 
     map: customMap, 
     title: title, 
     icon: 'Images/' + icon + '.png' 
    }); 
    return mapMarker; 
} 

function select(buttonId) { 
    document.getElementById("hand_b").className = "unselected"; 
    document.getElementById("placeMarker").className = "unselected"; 
    document.getElementById(buttonId).className = "selected"; 
} 

Cualquier ayuda o sugerencia sería impresionante. ¿Podría ser esto un error en ff?

+0

El código en el sitio es un poco actualizada ningún cambio embargo, el mismo problema,. ¿Algunas ideas? ¿Alguien puede abrir el sitio publicado anteriormente en IE8, Chrome y FireFox y decirme si también tienen problemas con Firefox? –

Respuesta

1

Hice algo muy similar para un paquete de software de desastres de código abierto. En este caso, supongamos que seleccioné "Incendio" en mi menú desplegable y esto activa addFire(). El oyente en los marcadores eliminará el punto al hacer clic o le permitirá arrastrarlo. El mapa solo puede tener un oyente a la vez, pero cada marcador puede tener su propio oyente al mismo tiempo.

Este es el código que funcionó en Chrome, Firefox e Internet Explorer 8:

 
//This function sets up the map for adding a fire icon 
function addFire() { 
//Kill old listener 
if(listening) 
    google.maps.event.removeListener(listenerhandle); 

//Start new listener 
listenerhandle = google.maps.event.addListener(disasterMap, 'click', addFirePoint); 
listening = true; 
}//end addFire 

//This function adds new fire points to the map and controls dragging and clicking 
function addFirePoint(event) { 
//Create the marker 
var fireMarker = new google.maps.Marker({ 
    icon: "./mapimgs/fire.png", position: event.latLng, map: disasterMap, draggable: true }); 

newFireMarkers.push(fireMarker); 
fireMarker.setTitle("Fire"); 

//Listen for clicks on the new marker 
google.maps.event.addListener(fireMarker, 'click', function() { 
     fireMarker.setMap(null); 
    //remove the marker from the array 
    for(i=0;i
Cuestiones relacionadas