Google Maps JS API v3 – Ejemplo de marcador múltiple simple con marcadores personalizados

Este es un gran ejemplo de un simple Mapa de Google : Google Maps JS API v3 – Ejemplo simple de marcador múltiple

Estoy tratando de agregar a este ejemplo la capacidad de asignar a cada fabricante un icono personalizado. Dado el ejemplo vinculado:

var locations = [ ['Bondi Beach', -33.890542, 151.274856, 4], ['Coogee Beach', -33.923036, 151.259052, 5], ['Cronulla Beach', -34.028249, 151.157507, 3], ['Manly Beach', -33.80010128657071, 151.28747820854187, 2], ['Maroubra Beach', -33.950198, 151.259302, 1] ]; 

Estoy pensando algo como:

 var locations = [ ['Bondi Beach', -33.890542, 151.274856, 4,'images/icon1.png'], ['Coogee Beach', -33.923036, 151.259052, 5,'images/icon2.png' ], ['Cronulla Beach', -34.028249, 151.157507, 3,'images/icon3.png' ], ['Manly Beach', -33.80010128657071, 151.28747820854187, 2,'images/icon4.png' ], ['Maroubra Beach', -33.950198, 151.259302, 1,'images/icon5.png' ] ]; 

¡Gracias de antemano por sus respuestas!

One Solution collect form web for “Google Maps JS API v3 – Ejemplo de marcador múltiple simple con marcadores personalizados”

Aquí hay una simple demostración de JSFiddle que muestra un marcador personalizado creado con los siguientes códigos. Puede personalizar el icono de su marcador con el parámetro icono al crear un marcador. Por ejemplo:

 var marker = new google.maps.Marker({ position: latlng, map: map, icon: 'http://www.kjftw.com/gmap/images/icons/numeric/red10.png', zIndex: Math.round(latlng.lat() * -100000) < < 5 }); 

Puede configurar el ícono param con la ubicación de su imagen de marcador personalizada. O en tu caso algo como esto:

 for(var i=0; i 

Donde asumir locations[i][1] es la lat y locations[i][2] es la lng. Esto no se ha probado, pero es una base para lo que puede hacer para crear un icono personalizado. myGlobalMarker es una matriz global de variables que contiene todos los marcadores. No estoy 100% seguro de si se necesita una URL absoluta o una URL relativa para la ubicación del icono. Sin embargo, en mi aplicación Google Map pude usar la ruta relativa para mostrar un icono personalizado en mi marcador. Este es el resultado final: introduzca la descripción de la imagen aquí

  • ¿Cómo hacer que la polilínea V3 de Google Maps encaje en la carretera desde puntos determinados?
  • ¿Cómo hacer llamadas AJAX entre dominios a Google Maps API?
  • Google Maps API v3: click los events que no se activan en Firefox para el marcador personalizado
  • Varias instancias de Google Maps en una página
  • Agregue el evento mouseover a directionsRenderer Google Maps API v3
  • Cómo detectar el progreso cargado para GroundOverlay
  • ¿Cómo indicar el idioma en la API de Google Maps?
  • Cómo eliminar todo del map de google
  • Actualización de javascript v2 a v3 de Google Maps utilizando Business Client IDs
  • ¿Cómo hacer que los datos de consultas MSSQL estén disponibles para Javascript en una página sin tener que consultar la database otra vez?
  • La mejor forma de importar coorderadas desde el file .gpx y mostrarlas usando Google Maps API
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.