Home / Google / GoogleMap / HPに簡単に作成できる!Google mapを埋め込む方法5つ

HPに簡単に作成できる!Google mapを埋め込む方法5つ

Pocket

 ³

かつては画像ソフトなどでマップを切り抜いてHPに貼り付けていましたが、いまではGoogle mapという便利なツールがあります。しかも簡単に自分のHPに貼り付けができるんです。ユーザーはこのマップで簡単に位置の情報を得ることができる便利ツールなのです。

ブログに食レポを書いたり、おすすめのお店の案内でマップを埋め込んだり…といまやマップは欠かせませんよね。

でも簡単に設置できるといっても難しくないのでしょうか?そのやりかたはどのようにするのでしょうか?ご紹介致します。

スポンサーリンク

Google mapの利用には「無料」「有料」の2つがある

world_map

まず、Google mapには、無料と有料があるのをご存知でしょうか?無料のイメージがあるGoogle mapですが、有料版になるとさらに機能を拡張して便利に使うことができるのです。

無料版

通常、多くの人がこの無料版を使っておられることかと思います。Google mapの無料版では、まずアクセスが制限されているサイトへのアクセスができません。具体的にはイントラネットの中やパスワードが必要なサイトなどのことを指します。これはかなり不便ですよね。

また、人や物の動態管理、すなわち動くものを追跡して管理しているサイトへのアクセスも無料版ではできません。

また同じGoogle のサービスでもストリートビューなどのJavaScript APIの使用が25,000回を越えるとマップが表示されなくなるなど、無料版での制限は多いです。

有料版

では、上記無料版にはない、Google mapの有料版のサービスにはどんなものがあるのでしょうか?

まず、上記にも記したイントラネットやパスワードを必要とするアクセスが制限されているサイトなどへのアクセス制限、動態管理に使っているサイトへのアクセス制限、そしてJavaScriptAPIの利用上限があるなど、ここぞというときに使いたいサイトで使えないのは本当にがっかりしてしまいますね。

このGoogle map platformという有料版サービスは、2018年6月に始まったばかりです。これはいままで18種類もあったGoogle mapのAPIが単純化され Maps、Routes、Places の3種類になったというものです。

これによってすでにGoogle map APIを使用している人でプレミアムプランを持っている人は、特にコードを変更することなく、そのままで使うことができます。しかしスタンダードプランの人は、Trasition Toolからの変更が必要です。

気になるGoogle map platformの料金体系は?

有料版といっても、果たして料金は高いんだろうか?大変気になるところですね?でも実際は月に200ドル分までは、無料で使えるんだそうです。しかもプレミアムプランだとテクニカルサポートまでついています。

マップへのアクセス数で利用料が変わってきますが、専門的な業務に使うなどの以外で普通に使う分なら、大抵は無料分でまかなえるとのことです。この機会に有料版を体験してみるのもいいかも知れませんね。

なお利用料はGoogle Cloud Platform Consoleで確認できます。

なお、上記サイトから「割り当て」という項目をクリックすることで、料金無料の枠を超えないように設定することもできますよ。

Google mapをホームページに埋め込んでみよう!(タグ利用編)

oldmap

では、実際にGoogle mapをホームページに埋め込む方法をご紹介します。ここではタグ利用とその応用編、Google Maps embed API利用編バージョンをご紹介したいと思います。

まずはシンプルな基本編からです。

Google mapに自分のサービスを検索して表示させる

まずはGoogle mapにアクセスをしてMapを表示させ 左側上の三本線 から あなたのサービスの名称 を入力して検索します。

出てきたサービスが正しい地図に立っているかを確認します。

メニューから埋め込みコードを取得

次に埋め込みコードを取得します。それにはやはり 左上の三本線のメニュー をクリックして表示されたメニューから 「地図を共有または埋め込む」 を選んでクリックします。

HPのテキストモード(HTMLモード)に埋め込みコードを貼り付け

次にHPのテキストモードにURLのスペースのところに表示されている 「埋め込みコード」 をコピー&ペーストします。

こうすることで、自分専用の地図を作ることができ、大きさを選べるアイコンで場所を表示させることができるようになります。

次ページ:Google mapをホームページに埋め込んでみよう!(タグ利用・応用編)

1 2

スポンサーリンク

スポンサーリンク

Check Also

Google mapを綺麗に印刷するための手順ガイド

Googleが提供している G …

Facebookでのご購読が便利です