WordPressで出かけた場所についてのブログも書いていますが、 その出かけた場所をGoogleMapにまとめて表示し、ブログのリンクに飛べるようにしてみました。 GoogleMap上のピンをクリックすると、ブログのタイトルとアイキャッチ画像を表示します。 その方法を記載します。
「Google Maps API」とは、Googleマップでさまざまなサービスで利用できるようにしたものです。 アプリやWebサービスにGoogleマップを使用することができます。 単に地図を載せるだけではなく、目的の場所や建物にマーカーを配置したりと色々な使い方ができます。 今回は、「Google Maps API」を使用するのに必要な、APIキーの取得方法を説明します。
viewportの設定漏れで、GoogleMapsApiを使用してwebアプリを作ったときに、スマホで見るとGoogleMap上の文字が小さく見づらいという事象があり悩みました。
GoogleMap内に独自のドロップダウンメニューを設置する方法を記載します。
GoogleMapの高さを%で指定する方法を記載
GoogleMapに表示する情報ウインドウを修正する。
GoogleMap上のピンに情報ウインドウを表示します。
GoogleMapにピンを表示します。
GoogleMapsApiのGeocoding機能を使用する。
webアプリにGoogleMapを表示させます。