Googleマップで自分のWebページに表示しようとすると、「開発目的のみ」というメッセージが表示されます。
どうすればこのメッセージを消すことができますか?
私のコードはそのようなものです:
<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>'+
このメッセージがどこから来たのかわかりません。
Googleマップはもう無料です。あなたのサイトが無料で毎月あなたに与える200ドルのクレジットを超える要求があるならばあなたが請求されることができるようにあなたはクレジットカードを関連付ける必要があります。それはあなたが透かし入りの地図を手に入れる理由です。
詳細については、次のURLをご覧ください。 https://cloud.google.com/maps-platform/pricing/
更新: 新しい課金システムの一般的な問題は、各APIを個別にアクティブ化する必要があることです。それらはすべて異なった価格を持っています(いくつかは無料でさえあります)、それでグーグルはあなたがあなたのドメインのためにそれらを個別に有効にしてもらうことを強調します。私はグーグルマップのヘビーユーザーではありませんでしたが、今では以前より多くのAPIがあると感じます。
そのため、請求を有効にしても使用制限のメッセージが表示される場合は、提供する機能に適したAPIを見つけ、有効になっているかどうかを確認してください。 API設定は見つけるのが面倒です。
次のいずれかが当てはまる場合は、「 開発目的専用の 」で透かしが入ります。
Victoriaが書いたように、Google Mapsはもう無料だが、あなたはあなたの地図プロバイダーを変えることができる。あなたはOpenStreetMapに興味があるかもしれません、あなたのサイトでそれを使用する簡単な方法がここに記述されている: https://handyman.dulare.com/switching-from-google-maps-to-openstreetmap/ /
残念ながら、OpenStreetMapでは、ある地点から別の地点への道順を提供する簡単な方法はありません。また、ストリートビューもありません。
コメントで推奨されているように、問題を特定して解決するために " 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呼び出しを検証しました。これが誰かが問題を素早く解決するのに役立つことを願っています!
私の目的のために私は代替の https://www.openstreetmap.org/ /を使用することになりました。
今すぐGoogleマップは開発のみのために無料です。
あなたが以前のように無料で地図を使用したいならば、それから有効な詳細(請求、支払いなど)でアカウントを作成してください。
詳細については、Googlesの新しい価格詳細を参照してください。 Googleマップの新しい価格
また、以前の価格の詳細も参照してください。 Old one
「開発目的専用」と表示されている場合は、開発中(または構成を試しているとき)には地図構成も表示されないようです。私の場合は、使用しているAPIに請求を関連付けることはできません。それが、このように動作する理由であると考えています。
そのようなグーグルマップの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を追加しないでください。
まあ、それはただの透かしです、私が使用する<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
ほど敏感ではありません