Google Map APIを使うと、簡単にWebページ上にGoogleマップを表示することができるため、 Webページの制作に関わる方はよく利用する機会があると思います。 地図の中に目的地のマーカーを設置する場合もあると思います。 今回は、マップ外に目的地のリストを表示し、 目的のリンクをクリックした時に、 マップ内のマーカーの情報を表示するという処理が必要な場合の方法についてご紹介いたします。 ↓こちらがそのDEMOです DEMO 方法 手順 HTML、CSSを準備してGoogleMapAPIを読み込み、APIの基本設定を行う マーカーの設定とマーカーの詳細の設定を行う マップ外の目的地リストをクリックしたときの設定を行う 1. HTML、CSSを準備してGoogleMapAPIを読み込む HTML body内