Estou usando a API do Google Maps para criar um mapa cheio de marcadores, mas quero que um marcador se destaque dos outros. A coisa mais simples a fazer, acho, seria alterar a cor do marcador para azul, em vez de vermelho. Isso é algo simples de fazer ou eu tenho que criar um ícone totalmente novo de alguma forma? Se eu tiver que criar um novo ícone, qual é a maneira mais fácil de fazer isso?

Como o Maps v2 foi descontinuado, você provavelmente está interessado nos mapas da 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

Você teria um conjunto de lógica para fazer todos os pinos 'regulares' e outro para os pinos 'especiais' usando o novo marcador definido.

Com a versão 3 da API do Google Maps, a maneira mais fácil de fazer isso é pegar um conjunto de ícones personalizados, como o que Benjamin Keen criou aqui:

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

Se você colocar todos esses ícones no mesmo local da página do mapa, poderá colorir um Marcador simplesmente usando a opção de ícone apropriada ao criá-lo:

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

Isso é super fácil e é a abordagem que estou usando para o projeto em que estou trabalhando atualmente.

MapIconMaker: uma biblioteca para o Google Maps v2

Uma maneira é usar o MapIconMaker (deadlink). Há um exemplo aqui (deadlink). Os ícones padrão do Google Maps têm largura de 20 px e altura de 34 px, portanto, você pode usar algo assim para emular:

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

Você pode até envolvê-lo em alguma função para facilitar ainda mais as coisas:

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

É o que eu pessoalmente uso para todos os marcadores criados. Eu prefiro ter a opção de mudar as cores de um capricho.

Atualização: a cor hexadecimal do ícone padrão é "# FE7569". Além disso, você pode definir a imagem em um marcador em vez de criar um novo marcador com um novo ícone. Portanto, se você deseja destacar uma função, pode usar algo parecido com isto, usando a função acima:

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

StyledMarker: uma biblioteca para o Google Maps v3

Desde que a V2 foi substituída pela V3 há algum tempo, pensei em atualizar esta resposta. Criei uma biblioteca para marcadores personalizados que podem ser encontrados na Biblioteca de Utilitários V3 aqui (deadlink). Ele permite cores e formas diferentes, e você também pode inserir texto no marcador. Ele funciona usando a API do Google Charts, que possui métodos para criar marcadores de tipo do Google Maps. Sinta-se à vontade para consultar o código-fonte, se você preferir usar a API do Google Charts diretamente.

A coisa sobre essa biblioteca, no entanto, é que ela cuida de definir as regiões clicáveis ​​dessas imagens de marcadores para você; portanto, por exemplo, o balão mais longo com texto terá as regiões clicáveis ​​que se espera, como neste exemplo (deadlink).

Design material

EDITADO EM MARÇO DE 2019 agora com cor programática dos pinos,

JAVASCRIPT PURO, SEM IMAGENS, ETIQUETAS ETIQUETAS

não depende mais da API de gráficos descontinuada

    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,
    });

Pessoalmente, acho que os ícones gerados pela API do Google Charts são ótimos e fáceis de personalizar dinamicamente.

Veja minha resposta na API 3 do Google Maps - Cor do marcador personalizado para o marcador padrão (ponto)

A maneira mais simples que encontrei é usar o BitmapDescriptorFactory.defaultMarker (), a documentação ainda tem um exemplo de configuração da cor. Do meu próprio código:

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

Para personalizar marcadores, você pode fazê-lo nesta ferramenta on-line: https://materialdesignicons.com/

No seu caso, você deseja o marcador de mapa disponível aqui: https://materialdesignicons.com/icon/map-marker e que você pode personalizar on-line.

Se você simplesmente deseja alterar a cor vermelha padrão para azul, pode carregar este ícone: http://maps.google.com/mapfiles/ms/icons/blue-dot.png

Foi mencionado neste tópico: https://stackoverflow.com/a/32651327/6381715

Este artigo relativamente recente fornece um exemplo simples com um conjunto limitado de ícones coloridos do Google Maps.