Webページの埋め込みGoogleマップが有料化！？一部APIキーが必要になる。プラグインは？SimpleMapは？これが簡単なチェック方法と対応方法。

BuzFixの埋め込み地図

BuzFixでは、記事で地図を表示したいときには、Googleマップが表示されるようにしています。

例えばゴールデンウィークのおすすめスポットを紹介する記事では、そのポイントを直観的にお伝えするためには地図が欠かせません。

単にGoogleマップを埋め込みで使う方法もありますが、ちょっと表示がはみ出したりして使いづらかったので、僕は『Simple Map』というプラグインを使っています。

こちらがSimple Mapプラグインをインストール、アクティブにしている状態です。

Simple Mapにはこうしたメリットがあります。

• Googleマップで検索してタグを拾ってくる手間が不要
• 自動でスマートフォンに対応した地図にしてくれる
• スマートフォンでは指でスクロールしない画像に変換してくれるのでイライラが無い（タップすると通常のGoogleマップが表示できます）

タグで埋め込むときは、こんな感じで書けば地図を埋め込むことができます。

※実際はmapタグは [ ]で囲います。

例）

Googleマップの埋め込み機能を使う場合、いったんGoogleマップで「清水公園フィールドアスレチック」を検索して、その地図からタグを拾ってくるのが面倒なんです。

それをしないでいいだけでも、かなり便利なプラグインです。

他にもGoogleマップを表示してくれるプラグインはありましたが、機能的に十分で評価も良かったのでこれを選びました。

サイト埋め込みGoogleマップがAPIキー必須で有料化！？

２０１８年７月１６日以降、Webページに埋め込んでいるGoogleマップが使えなくなる、表示されなくなるという噂を聴き、「マジか！？」と思い少し調べてみました。

どうもGoogle側の仕様変更で別途APIキーを使わないと表示されなくなるようになるらしいんですが、その対象が全てではありませんでした。

APIキーが必要な場合、有料化する場合、そのまま使える場合があるようです。

APIキーの追加が必要な場合（一部、有料化する場合）

「Static Maps API」
「Maps JavaScript API」
「Maps Embed API」

などのGoogle提供の対象APIを使用している

そのまま使える場合

1. Googleマップから【地図を埋め込む】でページに設置している
2. 「Static Maps API」
   「Maps JavaScript API」
   「Maps Embed API」
   などのAPIを使用していても、モバイル向けの場合は無料で利用できる場合がある

「う、、、む、、、」

前項で説明した通り、Googleマップから【地図を埋め込む】でページに設置しているわけではありません。

そうすると、プラグインごとに対応しているかどうかは、プラグインの仕様によることになります。

もし有料化するAPIを使っているプラグインの場合、無料提供されているプラグインなので、作成者が更新をやめてしまう可能性だってあります。

チェッカーを使ってみよう

そのプラグインがどういう仕様かどうかは作成者に問い合わせるのが手っ取り早いのかとも思いましたがちょいメンドクサイ。

そこで調べてみると、Googleから適合、不適合のチェッカーが提供されていました。

Google Chromeの拡張機能として提供されています。

使用するためには当然ながらGoogle Chromeの環境が必要です。

ブラウザが用意できたら、こちらの拡張機能をインストールしてください。

以下のURLからインストール画面を開けます。

拡張機能を有効にすると、ブラウザの右上（拡張機能が表示される部分）にこのようなマークが表示されます。

これで使用準備は完了です。

Google Chromeで対象となるGoogleマップを埋め込んでいるページを開きます。

こちらは「市原ぞうの国」を紹介した際のマップです。

すると、さきほどの右上のアイコンが「緑色」に変わります。

そのアイコンをクリックすると、このようにポップアップが表示されます。

「SUCCESS」となっており、これで既にAPIに対して必要なAPIキーが使用された状態になっていることを表しています。

アイコンが「赤色」になり、「ERROR」となっている場合は別途、APIキーを設定しないといけません。

その際に、有料の場合が発生するようです。

もしこの表示だった場合は、慌てずにいったんマップを表示している画面を更新（F5など）してみてください。

その後上記のいずれかの表示に変われば問題ありません。

（ERRORだったら問題なんですけど(^^;

ただ、この場合の例外があります。

何度更新をしてもこの表示になる場合、APIを使用している場合と、Googleマップから埋め込んでいる場合のどちらでも起こりうるようです。

例えばGoogleマップの埋め込みで東京駅を埋め込む場合は以下のようなiframeタグになっていれば問題ないと思われます。

ところが使用しているタグに以下のようなものを使用している場合は、確実にAPIを使っているため、別途修正の必要性を確認してください。

チェックツールでAPIの使用までは判別できても、SuccessかErrorかを判別できないパターンということのようです。

Googleへの確認方法

チェッカーでErrorになったり、不明な状態になった場合は、確認が必要です。

ただ、プラグインの場合はプラグインの作成者さんが本来やるべき処置かもしれませんので、いったんプラグイン作成者へ問い合わせた方が良いかもしれませんね。

一応掲載しておきますが、確認する場合は下記のページからいろいろと読んでいく必要があります。

ユーザー用ガイド
httpss://cloud.google.com/maps-platform/user-guide/

Google Maps Platform
httpss://cloud.google.com/maps-platform/

Google Maps Platform料金プラン
httpss://cloud.google.com/maps-platform/pricing/

まとめ

埋め込み地図があるかないかで、だいぶ記事の読みやすさ、理解度が変わってきます。

突然使えなくなったら困ります。

他にもGoogleが提供してるツールやAPIを活用しているアプリやプラグインは無数にあるでしょう。

そのくらい、Googleの提供するツールは世界のWebに浸透しているということです。

そんな地図を無料で使わせてくれているGoogleを責めるのは筋違いなのかもしれません。

まずは無料で使ってもらって膨大な動作データを取り、バグが減ったところで有料化するという開発手法はどこでもやっていることですから。

皆さんの中でもWebサイトを作っておられたら、この記事がお役にたてばよいのですが。

ここまでお読みいただきありがとうございました。

関連記事を紹介させていただきます。

Google+で５０万件の個人情報漏洩!?原因はGoogle People APIのバグ。オワコンと言われたぐぐたすもついにサービス終了へ。

謎のメール「Mobile-first indexing enabled for」とは!?モバイル ファースト インデックスが有効に…?どうしたら良い?

Googleから英文メールでGoogleマップのAPI有料化施行のお知らせ。SimpleMapを含むプラグインは表示可能だが異常あればチェッカーで確認。

といいますか、この記事内で使用したGoogleマップを表示している記事を厚かましくも宣伝しちゃいます(^^;;;

【最新１】ゴールデンウィーク関東の穴場【快適】スポット厳選の17選 Part １

【最新２】ゴールデンウィーク関東の穴場【快適】スポット厳選の17選 Part ２

↓↓この記事がお役に立てたらボタンを押していただけると嬉しいです。

にほんブログ村

↓↓これからも有益な情報を掲載していくので通知登録お願いします！