企画・デザイン

Googleマップをカスタマイズして埋め込むことができる「EZ Map」

投稿日:2019年3月9日

会社のホームページでGoogleマップを埋め込んでいるページをよく見かけるようになりました。自身のサイトでも埋め込みたいという方にぜひご利用いただきたいのが今回ご紹介するEZ Mapです。EZ MapはGoogleマップの埋め込み用コードが簡単に生成できるサービスです。

このアプリで仕事が効率化できる理由

  • 専門の知識なくGoogleマップのコードが取得できる
  • 拡大率やデザインなどのカスタマイズもできる

使い方

Googleマップの設定

EZMapのウェブページが表示されるとこのような画面になっています。

右側にある「Your map result」という項目にはGoogleMapが表示されていますので、埋め込みたい場所を地図の中心に合わせてください。合わせるとその座標が自動的に入力されます。

続けて、左側にある「Settings」という項目からマップの座標やマップのタイプやズームの大きさなどをカスタマイズします。Dimensionsという項目からはマップの幅と高さを設定することができます。「Responsive width」をONにすることで自動的にサイズを調整することができます。

 マップの座標は、右側のマップを操作することで自動で入力されるため通常は操作しなくて大丈夫です。

Map Type Controlはマップを地図で表示するか航空写真で表示するかを選択できます。Defaultであればユーザーが地図か航空写真かを選べるためDefualtをおすすめします。

 Map Typeでは地図の種類を選択することができます。Road Mapは通常のマップで、Road Map with terrainは標高などで色が変わるマップが表示されます。

 Zoom Levelは数字が大きくなるほどマップをズームすることができます。

 Other Optionsでは地図をダブルクリックして拡大するなどの動作を有効にしたり無効にすることができます。

Settingsの下部にはThemeという項目よりデザインを変更することもできます。159種類のテーマから好きなテーマを選択することができます。

埋め込み用コードを取得する

地図の場所や設定の準備が完了したら、地図の下にあるYour map codeというところから「COPY YOUR CODE」をクリックするとコピー用のコードを取得することができます。こちらを自分のブログやホームページなどに貼り付けることでマップを貼り付けることができます。

以上がEZ Mapの使い方でした。通常、サイトにGoogleマップを埋め込む際はコードの知識が必要となりますが、EZ Mapを使えば専門の知識の必要なく、簡単に埋め込み用Gooleマップ用のコードが生成できますので、自身のサイトで使いたい方はぜひご利用いただけますでしょうか。 

サイト情報

URL:https://ezmap.co/

-企画・デザイン
-, ,

Copyright© WebCli , 2019 All Rights Reserved.