[解決済み】Google Maps API 3 - デフォルト（ドット）マーカーにカスタムマーカー色を付ける

質問

これと似たような質問を他にもたくさん見てきました( こちら , こちら そして こちら しかし、それらはすべて、私の問題を解決しない答えを受け入れています。私が見つけたこの問題に対する最良の解決策は スタイルドマーカー しかし、デフォルトのマーカー（Googleマップで検索したときに表示される、真ん中に点があるマーカー）を使うようにすることができません。

解決するには？

のアイコン画像を動的に要求することができます。 Googleチャートapi をURLで指定します。

http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569

というと、こんな感じになります。 画像は 21x34 ピクセルで、ピンの先端の位置は (10, 34)

そして、影絵も別に用意しましょう（近くのアイコンと重ならないように）。

http://chart.apis.google.com/chart?chst=d_map_pin_shadow

というと、こんな感じになります。 画像は 40x37 ピクセルで、ピンの先端の位置は (12, 35)

を構築する際に マーカイメージ は、サイズとアンカーポイントを適切に設定する必要があります。

    var pinColor = "FE7569";
    var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor,
        new google.maps.Size(21, 34),
        new google.maps.Point(0,0),
        new google.maps.Point(10, 34));
    var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",
        new google.maps.Size(40, 37),
        new google.maps.Point(0, 0),
        new google.maps.Point(12, 35));

そして、そのマーカーを地図に追加するには、次のようにします。

        var marker = new google.maps.Marker({
                position: new google.maps.LatLng(0,0), 
                map: map,
                icon: pinImage,
                shadow: pinShadow
            });

FE7569"を目的のカラーコードに置き換えるだけです。例

クレジット表記 ジャック・B・ニンブル ということです(笑)。