【マイマップの使い方】Google マップのマイマップ機能で複数拠点を設定しブログに地図を表示する方法

Googleマップで複数拠点間のルートや距離を表示させたいなぁと色々試行錯誤していたらマイマップという機能を見つけました。

自分の備忘メモがてらマイマップの作り方手順を記しておきます。

 

マイマップの作成

Google マップを開き、メニューをクリックします。

Googleマップのメニューをクリックする様子を説明している図

 

「マイプレイス」をクリックします。

Googleマップでマイプレイスを開くところ

 

一番右側の「マイマップ」を選択し、画面下部に小さく書いてある「地図を作成」をクリックします。

Googleマップのマイマップを開く画面

Googleマップのマイマップの地図を作成ボタン

 

マイマップの作成画面に移ります。

検索窓に、マイマップに設定したい拠点を入力し虫眼鏡マークをクリックします。

Googleマップのマイマップで拠点を検索している様子

 

検索結果として希望の場所が表示されたら「+地図に追加」をクリックします。

Googleマップのマイマップで東京駅を地図に追加しているところ

同様の手順で他の拠点も地図に追加していきましょう。

 

スタイルの変更

拠点を追加した後、右下のこれらのマークをクリックして、ピンの色を変えたり説明書きを加えたりできるので自分好みに色々設定しましょう。

Googleマップのマイマップでスタイルを変更できるアイコン

 

マイマップ作成画面の左側のコロコロみたいなマークをクリックすると、ラベル(設定した拠点)の表示方法を色々変えられます。

Googleマップのマイマップでラベルのスタイルを変更しているところ

 

続き番号にすると、順路などを示すのに良さそうですね。

Googleマップのマイマップで拠点間を続き番号に設定した様子

 

「無題の地図」と表示されているタイトル部分をクリックするとタイトルと説明書きを編集できます。

Googleマップのマイマップのタイトルを変更する様子

Googleマップのマイマップで地図のタイトルを変更しているところ

 

共有の設定

「共有」をクリックします。

Googleマップのマイマップの共有

 

ブログに埋め込んでネットで公開する場合は、下側の「リンクを知っている全員に変更」をクリックします。

Googleマップのマイマップで共有権限を変更しているところ

Googleマップのマイマップで共有権限を変更したところ

これにより、このリンクを知っているインターネット上の全員が作成したマイマップを閲覧できるようになりました。

 

マイマップのメニューから「自分のサイトに埋め込む」をクリックします。

Googleマップのマイマップのメニューをクリックするところ

表示されたHTMLをコピーします。

Googleマップのマイマップをブログに埋め込む用のHTMLを表示したところ

マイマップは自身のGoogleアカウントに紐づいたGoogleドライブ内に自動保存されます。
Googleドライブ内のマップを消してしまうとブログに貼り付けた地図も消えてしまうので注意。

地図をブログに埋め込む

コピーしたHTMLをブログに貼り付けます。

ここではWordPress(ブログサービスの一種)の画面を例に説明します。

どのブログサービスを使っていても、「HTMLコード入力モード」みたいなものがあると思うので、そちらで行うようにしてみてください。

WordPressの記事投稿の入力画面の様子

ブログ記事の作成画面を開きます。

「ここに地図を表示させたい」というところにカーソルを合わせ、クリックしておきましょう。

HTML記述モードにします。

WordPressの記事投稿のHTML入力画面の様子

前手順でカーソルを合わせてクリックしておいた入力位置をズラさないように気を付けながら、先ほどコピーしたHTMLを貼り付けます。

もちろんHTMLコードが読める人は、そのまま直接入れたいところを探して貼り付けで大丈夫です。

 

 

コメント

タイトルとURLをコピーしました