web-dev-qa-db-ja.com

Googleマップに「開発目的専用」と表示される

Googleマップで自分のWebページに表示しようとすると、「開発目的のみ」というメッセージが表示されます。

enter image description here

どうすればこのメッセージを消すことができますか?

私のコードはそのようなものです:

  <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
  <script type="text/javascript">
     function initialize() {  
     var myLatlng = new google.maps.LatLng(50.5792659,8.6744471);
     var centerMap = new google.maps.LatLng(50.5792659,8.6744471);
     var div = document.getElementById('map');

それから後で私は

     '<p><a href="https://www.google.com/maps/dir//50.5792659,8.6744471/@50.579266,8.674447,16z" target="_blank">Route berechnen</a></p>'+

このメッセージがどこから来たのかわかりません。

101
tmighty

Googleマップはもう無料です。あなたのサイトが無料で毎月あなたに与える200ドルのクレジットを超える要求があるならばあなたが請求されることができるようにあなたはクレジットカードを関連付ける必要があります。それはあなたが透かし入りの地図を手に入れる理由です。

詳細については、次のURLをご覧ください。 https://cloud.google.com/maps-platform/pricing/

更新: 新しい課金システムの一般的な問題は、各APIを個別にアクティブ化する必要があることです。それらはすべて異なった価格を持っています(いくつかは無料でさえあります)、それでグーグルはあなたがあなたのドメインのためにそれらを個別に有効にしてもらうことを強調します。私はグーグルマップのヘビーユーザーではありませんでしたが、今では以前より多くのAPIがあると感じます。

そのため、請求を有効にしても使用制限のメッセージが表示される場合は、提供する機能に適したAPIを見つけ、有効になっているかどうかを確認してください。 API設定は見つけるのが面倒です。

  1. このリンクにアクセスしてください: https://console.developers.google.com/apis/dashboard
  2. その後、ドロップダウンでプロジェクトを選択します。
  3. 左ペインのライブラリに移動します。
  4. 利用可能なAPIを参照して、必要なものを有効にします。
125
Victoria Ruiz

次のいずれかが当てはまる場合は、「 開発目的専用の 」で透かしが入ります。

  1. リクエストにAPIキーがありません。
  2. アカウントで請求が有効になっていません。
  3. 提供された請求方法は無効です(たとえば、有効期限が切れたクレジットカード)。
  4. 自主的な1日の制限を超えました。
24

Victoriaが書いたように、Google Mapsはもう無料だが、あなたはあなたの地図プロバ​​イダーを変えることができる。あなたはOpenStreetMapに興味があるかもしれません、あなたのサイトでそれを使用する簡単な方法がここに記述されている: https://handyman.dulare.com/switching-from-google-maps-to-openstreetmap/ /

残念ながら、OpenStreetMapでは、ある地点から別の地点への道順を提供する簡単な方法はありません。また、ストリートビューもありません。

21
Paweł Dulak

コメントで推奨されているように、問題を特定して解決するために " Google Maps Platform APIチェッカー " Chromeアドインを使用しました。

基本的に、このアドインは、私がGoogleにサインインして無料のAPIキーを作成することができた here に誘導してくれました。

その後、私は私のJavaScriptを更新し、それはすぐにこの問題を解決しました。

旧JavaScript:... script src = "https://maps.googleapis.com/maps/api/js?v=3" ...

更新されたJavaScript:... script src = "https://maps.googleapis.com/maps/api/js?key=*****GOOGLE API KEY ******&v = 3" ...

その後、アドインはJS API呼び出しを検証しました。これが誰かが問題を素早く解決するのに役立つことを願っています!

enter image description here

4
Mike Dubs

私の目的のために私は代替の https://www.openstreetmap.org/ /を使用することになりました。

3

今すぐGoogleマップは開発のみのために無料です。

あなたが以前のように無料で地図を使用したいならば、それから有効な詳細(請求、支払いなど)でアカウントを作成してください。

詳細については、Googlesの新しい価格詳細を参照してください。 Googleマップの新しい価格

また、以前の価格の詳細も参照してください。 Old one

2
Srikrushna Pal

あなたのウェブサイトのために、単一のマークされた場所を示す無料の簡単な場所地図が欲しいなら、それから、

  • AddMap に移動します。
  • ここであなたは完全にあなたの地図を完全にカスタマイズするために位置の詳細、地図の大きさとフォーマットのようなあなたの地図を作ることができます。
  • 最後にグーグルマップAPIキーを追加するには、この method を使用して生成します。

これが助けになるかどうかを教えてください。

1
Rahul Mahawar

「開発目的専用」と表示されている場合は、開発中(または構成を試しているとき)には地図構成も表示されないようです。私の場合は、使用しているAPIに請求を関連付けることはできません。それが、このように動作する理由であると考えています。

1
Ronow

そのようなグーグルマップのjsファイルを追加する

   <script src="https://maps.googleapis.com/maps/api/js?key=your key here"
    async defer></script>

あなたがそれを好きなように追加するとき、あなたは開発目的のためだけのメッセージを得るでしょう

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
    async defer></script>

そのため、scriptタグにcallback = initMapを追加しないでください。

これの横にあなたがグーグル開発者コンソールマップセクションにあなたのサイトを追加したことを確認してください: enter image description here

1
user889030

まあ、それはただの透かしです、私が使用する<div>を持っているz-index=100を変更するならば、あなたはそれを隠すことができます

setInterval(function(){
    $("*").each(function() {
        if ($(this).css("zIndex") == 100) {
            $(this).css("zIndex", "-100");
        }
    })}
, 10);

またはあなたが使用することができます

map.addListener('idle', function(e) {
    //same function
}

しかし、それはsetIntervalほど敏感ではありません

0
blesafho