1.iframeデフォルト

ごくごく普通の配置方法

2.iframeにCSSフィルターをかける

問題点:IE非対応。ピンにもフィルターがかかってしまう。オリジナルマーカーは付けられない。

3.Google Maps APIデフォルト

APIを取得してjsでマップを組み込む(最低限の設定のみ)。
まだマーカーの設定はしていないので、ピンは表示されていない。

4.Google Maps API、デフォルトのピンを表示

scriptに記述を追加したことで、デフォルトのピンが表示されました。

4.Google Maps API、オリジナルのピンを表示

scriptに記述を追加したことで、オリジナルのピンが表示されました。

5.Google Maps API、簡単な設定でグレースケールにする

6.Google Maps API、マップタイプコントロールを非表示にする

左上にあった「地図|航空写真」の切り替えボタンが消えました。

6.Google Maps API、凝った調整をしてみる

見やすさをキープしてカスタムしてくの、難しそうですね。。

【実験中】7.PINにリンクを設定する

Mapに配置したPINをクリックすると、任意のページに移動したい。
ついでに複数のPINを配置したい(Googleマイマップは好みじゃない場合)。