ブログネタ|オリジナルのグーグルマップ作成方法と公開方法を画像付きで解説

当ページのリンクには広告が含まれています。
ブログネタに使えるグーグルマップの作成方法と公開方法

今回は、ブログネタにも使えるグーグルマップの作成方法と公開方法を画像付きでご紹介します。

ブログ記事の中で、住所を含む一覧データを、グーグルマップに視覚的にマッピングしたい場合に役立ちます。

当ブログでは、これまでラグビーワールドカップ2019の出場国試合会場東京オリンピックの試合会場など、あらゆるマップを作成し、ブログ記事のコンテンツの一部として公開してきました。

本記事では、オリジナルのグーグルマップ作成方法とその公開方法をご紹介します。おすすめのグルメ情報や観光スポットなどのブログコンテンツの作成にお役立てください。

目次

グーグルマイマップの作成方法

グーグルマイマップの作成方法をご紹介します。今回は例として、東京オリンピック2020の会場一覧データをマイマップにしてみます。作成後のイメージはこちら。

住所データを作成する

まず地図データの元となるデータを、エクセルや無料のグーグルスプレッドシートで作成します。

ポイントは①住所データ、②ラベルデータ、の項目を意識して作成することです。

マイマップの元データとなる一覧
東京オリンピック2020の会場の一覧データ

データを取り込む

作成済みのデータをグーグルマイマップに取り込みます

グーグルマップのマイマップのトップ画面
グーグルマイマップはこちらから
マイマップのトップ画面
【新しい地図を作成】を選択
マイマップで地図データをインポート
【インポート】を選択
マイマップで地図データをインポートする際の設定画面
【デバイスのファイルを選択】を選択

表示されているように、ファイルをドラッグアンドドロップでも選択できます。

次に、住所とタイトルに該当する参照項目を指定します。

マイマップで地図データをインポートする際の設定画面
住所データ項目の【地域詳細】にチェックを入れて、【続行】を選択
マイマップで地図データのタイトルを設定する画面
ピンのタイトルにしたい【会場名】にチェックを入れて、【完了】を選択
マイマップで地図データ取り込みができた画面
マッピングされた地図が表示

マイマップの表示を調整する

次にマイマップの以下の表示内容を調整します。

マイマップの表示を調整する
  • スタイル(カテゴリ)を区別する
  • 地図に表示させる名称(ラベル)を決める
  • 地図の名前と説明を決める
  • デフォルトの表示領域・大きさを決める
ラベルのカテゴリを選択する画面
【均一スタイル】を選択し、【地域】を選択
マイマップのカテゴリで色分けができた画面
【地域】別にピンが色付けされて表示
マイマップで会場名をラベルに設定する画面
【ラベルなし】を選択、表示させたい【会場名】を選択
マイマップで会場名がラベルとして表示された画面
選択した【会場名】が地図に表示
マイマップの地図タイトルと説明を設定する画面
【共有】を選択、地図タイトルと説明を入力し、【OK】を選択
マイマップの共有設定画面
【変更】を選択し、【ウェブ上で一般公開】にチェックを入れて、【保存】を選択
マイマップの共有設定が完了した画面
【完了】を選択
マイマップのデフォルトビューを設定する画面
拡大縮小で地図の大きさと地域の場所を表示させ、【デフォルトビューを設定】を選択

注意点としては、実際に地図に埋め込んだ際に広域で表示される(小さく表示される)仕様のため、デフォルトでは拡大した地図(大きく表示させて)を設定するのがおすすめです。

ブログにマイマップを埋め込む

最後に作成したマイマップをブログに埋め込みます。

マイマップをブログに埋め込むためのHTMLをコピーする画面
【自分のサイトに埋め込む】を選択し、【表示されたURL】を選択しコピー
マイマップのHTMLをブログに埋め込む画面
コピーしたURLを貼り付け、【プレビュー】を選択
マイマップがブログに表示されることを確認するプレビュー画面
ブログにマイマップが表示
ブログに埋め込むマイマップの表示の大きさを変更した画面
表示させる地図のサイズも変更可能

ほかカスタマイズもいろいろ出来ますので、記事内容に合わせてアレンジしてみてください。

グーグルマイマップのピンアイコンのカスタマイズ
ピンのアイコンのカスタマイズも

ブログにはマイマップがおすすめ

あらゆる企業ページや公式サイトでは、独自に店舗などの情報を公開しており、デザインは企業によってバラバラなことが多いです(当たり前ですが)。グーグルマイマップを使えば統一的なデザイン、かつ独自の視点で自分だけのオリジナルのコンテンツを作成、公開できますのでぜひお試しください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次