Estoy usando la API de Google Maps para crear un mapa lleno de marcadores, pero quiero que un marcador se destaque de los demás. Creo que lo más sencillo sería cambiar el color del marcador a azul, en lugar de rojo. ¿Es esto algo simple o tengo que crear un ícono completamente nuevo de alguna manera? Si tengo que crear un nuevo ícono, ¿cuál es la forma más fácil de hacerlo?

Dado que los mapas v2 están en desuso, probablemente esté interesado en los mapas v3: https://developers.google.com/maps/documentation/javascript/markers#simple_icons

Para mapas v2:

http://code.google.com/apis/maps/documentation/overlays.html#Icons_overview

Tendría que un conjunto de lógica haga todos los pines 'regulares', y otro que haga los pines 'especiales' usando el nuevo marcador definido.

Con la versión 3 de la API de Google Maps, la forma más fácil de hacerlo puede ser tomando un conjunto de iconos personalizado, como el que Benjamin Keen ha creado aquí:

http://www.benjaminkeen.com/?p=105

Si coloca todos esos íconos en el mismo lugar que su página de mapa, puede colorear un Marcador simplemente usando la opción de ícono apropiada al crearlo:

var beachMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  icon: 'brown_markerA.png'
});

Esto es muy fácil y es el enfoque que estoy usando para el proyecto en el que estoy trabajando actualmente.

MapIconMaker: una biblioteca para Google Maps v2

Una forma es usar MapIconMaker (deadlink). Hay un ejemplo aquí (deadlink). Los íconos predeterminados de Google Maps tienen 20px de ancho y 34px de alto, por lo que podría usar algo como esto para emular:

var newIcon = MapIconMaker.createMarkerIcon({width: 20, height: 34, primaryColor: "#0000FF", cornercolor:"#0000FF"});
var marker = new GMarker(map.getCenter(), {icon: newIcon});

Incluso podría incluirlo en alguna función para facilitarle las cosas:

function getIcon(color) {
    return MapIconMaker.createMarkerIcon({width: 20, height: 34, primaryColor: color, cornercolor:color});
}

Eso es lo que personalmente uso para todos los marcadores que creo. Prefiero tener la opción de cambiar los colores de un capricho.

Actualización: el color hexadecimal del icono predeterminado es "# FE7569". Además, puede establecer la imagen en un marcador en lugar de crear un nuevo marcador con un nuevo icono. Entonces, si desea que una función se destaque, puede optar por algo como esto, utilizando la función anterior:

function highlightMarker(marker, highlight) {
    var color = "#FE7569";
    if (highlight) {
        color = "#0000FF";
    }
    marker.setImage(getIcon(color).image);
}

StyledMarker: una biblioteca para Google Maps v3

Como V2 fue reemplazado por V3 hace algún tiempo, pensé que debería actualizar esta respuesta. Creé una biblioteca para marcadores personalizados que se pueden encontrar en la Biblioteca de utilidades V3 aquíCreé (enlace inactivo). Permite diferentes colores y formas, y también puede colocar texto en el marcador. Funciona mediante el uso de la API de Google Charts, que tiene métodos para crear marcadores de tipo Google Maps. Siéntase libre de mirar el código fuente si prefiere usar la API de Google Charts directamente.

Sin embargo, lo que pasa con esa biblioteca es que se encarga de definir las regiones en las que se puede hacer clic para estas imágenes de marcador, por lo que, por ejemplo, la burbuja más larga con texto tendrá las regiones en las que se puede hacer clic, como este ejemplo (enlace inactivo).

Diseño de materiales

EDITADO EN MARZO 2019 ahora con color pin programático,

JAVASCRIPT PURO, SIN IMÁGENES, ETIQUETAS DE APOYO

ya no se basa en API de gráficos obsoletos

    var pinColor = "#FFFFFF";
    var pinLabel = "A";

    // Pick your pin (hole or no hole)
    var pinSVGHole = "M12,11.5A2.5,2.5 0 0,1 9.5,9A2.5,2.5 0 0,1 12,6.5A2.5,2.5 0 0,1 14.5,9A2.5,2.5 0 0,1 12,11.5M12,2A7,7 0 0,0 5,9C5,14.25 12,22 12,22C12,22 19,14.25 19,9A7,7 0 0,0 12,2Z";
    var labelOriginHole = new google.maps.Point(12,15);
    var pinSVGFilled = "M 12,2 C 8.1340068,2 5,5.1340068 5,9 c 0,5.25 7,13 7,13 0,0 7,-7.75 7,-13 0,-3.8659932 -3.134007,-7 -7,-7 z";
    var labelOriginFilled =  new google.maps.Point(12,9);


    var markerImage = {  // https://developers.google.com/maps/documentation/javascript/reference/marker#MarkerLabel
        path: pinSVGFilled,
        anchor: new google.maps.Point(12,17),
        fillOpacity: 1,
        fillColor: pinColor,
        strokeWeight: 2,
        strokeColor: "white",
        scale: 2,
        labelOrigin: labelOriginFilled
    };
    var label = {
        text: pinLabel,
        color: "white",
        fontSize: "12px",
    }; // https://developers.google.com/maps/documentation/javascript/reference/marker#Symbol
    this.marker        = new google.maps.Marker({
        map: map.MapObject,
        //OPTIONAL: label: label,
        position: this.geographicCoordinates,
        icon: markerImage,
        //OPTIONAL: animation: google.maps.Animation.DROP,
    });

Personalmente, creo que los iconos generados por la API de Google Charts se ven geniales y son fáciles de personalizar dinámicamente.

Consulte mi respuesta en Google Maps API 3: color de marcador personalizado para el marcador predeterminado (punto)

La forma más simple que encontré es usar BitmapDescriptorFactory.defaultMarker () la documentación incluso tiene un ejemplo de configuración del color. De mi propio código:

MarkerOptions marker = new MarkerOptions()
            .title(formatInfo(data))
            .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE))
            .position(new LatLng(data.getLatitude(), data.getLongitude()))

Para personalizar los marcadores, puede hacerlo desde esta herramienta en línea: https://materialdesignicons.com/

En su caso, desea el marcador de mapa que está disponible aquí: https://materialdesignicons.com/icon/map-marker y que puede personalizar en línea.

Si simplemente desea cambiar el color rojo predeterminado a azul, puede cargar este icono: http://maps.google.com/mapfiles/ms/icons/blue-dot.png

Se ha mencionado en este hilo: https://stackoverflow.com/a/32651327/6381715

Este artículo relativamente reciente proporciona un ejemplo simple con un conjunto limitado de iconos de colores de Google Maps.