Google Maps menunjukkan "Hanya untuk tujuan pengembangan"

155

Google Maps menampilkan pesan "Hanya untuk tujuan pengembangan" ketika saya mencoba menampilkannya di halaman web saya:

masukkan deskripsi gambar di sini

Bagaimana saya bisa membuat pesan ini hilang?

Kode saya seperti itu:

<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');
  }
</script>

Kemudian saya miliki

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

Saya tidak melihat dari mana pesan ini berasal.

maha kuasa
sumber
6
Saya tahu pertanyaan ini sudah dijawab, tetapi Jika Anda tidak tahu, ada alat yang disebut Google Maps Platform API Checker untuk Google Chrome yang memungkinkan Anda men-debug integrasi Google Maps Anda -> chrome.google.com/webstore/detail/ google-maps-platform-api / ...
Dayron Gallardo

Jawaban:

190

Google Maps tidak lagi gratis. Anda harus mengaitkan kartu kredit sehingga Anda dapat ditagih jika situs Anda memiliki permintaan yang melebihi kredit $ 200 yang mereka berikan setiap bulan secara gratis. Itu sebabnya Anda mendapatkan peta yang diberi tanda air.

Untuk informasi lebih lanjut, lihat: https://cloud.google.com/maps-platform/pricing/

Pembaruan: Masalah umum dengan sistem penagihan baru adalah Anda sekarang harus mengaktifkan setiap API secara terpisah. Mereka semua memiliki harga yang berbeda (beberapa bahkan gratis), jadi Google memastikan Anda mengaktifkannya secara individual untuk domain Anda. Saya tidak pernah menjadi pengguna Google Maps yang berat, tetapi saya merasa bahwa ada lebih banyak API sekarang daripada sebelumnya.

Jadi, jika Anda masih mendapatkan pesan penggunaan terbatas setelah Anda mengaktifkan penagihan, cari tahu API apa yang Anda butuhkan untuk fitur yang ingin Anda tawarkan, dan periksa apakah itu diaktifkan. Pengaturan API sangat sulit ditemukan.

  1. Buka tautan ini: https://console.developers.google.com/apis/dashboard .
  2. Kemudian Anda memilih proyek Anda di dropdown.
  3. Buka perpustakaan di panel kiri.
  4. Jelajahi API yang tersedia dan aktifkan yang Anda butuhkan.
Victoria Ruiz
sumber
2
Harga pada peta memuat --> developers.google.com/maps/documentation/embed/…
Ylama
terima kasih banyak, Anda menghemat hari saya. Dan untuk FYI, untuk pertama kalinya menautkan akun Anda dengan google, Anda akan mendapatkan $ 300 gratis.
majorl3oat
1
Apakah ini perlu beberapa hari untuk diberlakukan? Saya melakukan ini beberapa hari yang lalu, tetapi masih menerima pesan di peta saya. Bahkan klik sekitar dan memastikan saya menerima setiap perjanjian ..... Saya melihat di mana lalu lintas masuk ke dalamnya di dashboard
DigitalMystery
Tidak, biasanya tidak butuh waktu lama. Pengalaman saya hanya beberapa menit. Tetapi Anda mungkin perlu mengaktifkan berbagai API agar berbagai hal berfungsi. Apa pesan kesalahan yang Anda dapatkan, @DigitalMystery?
Victoria Ruiz
Itu ada di aplikasi seluler saya. Pada awalnya muncul popup "Halaman ini tidak dapat memuat Google Maps dengan benar." Klik OK dan peta menunjukkan pesan di atas. Saya menggunakan kunci saya juga ..... @ VictoriaRuiz
DigitalMystery
36

Ditandai dengan air  "hanya untuk tujuan pengembangan " dikembalikan ketika salah satu dari yang berikut ini benar:

  1. Permintaan tidak memiliki kunci API.
  2. Tagihan belum diaktifkan di akun Anda.
  3. Metode penagihan yang disediakan tidak valid (misalnya kartu kredit kedaluwarsa).
  4. Batas harian yang diberlakukan sendiri telah terlampaui.
Rushikesh Pandit
sumber
29

Seperti yang ditulis Victoria, Google Maps tidak lagi gratis, tetapi Anda dapat mengganti penyedia peta Anda. Anda mungkin tertarik dengan OpenStreetMap, ada cara mudah untuk menggunakannya di situs Anda yang dijelaskan di sini: https://handyman.dulare.com/switching-from-google-maps-to-openstreetmap/

Sayangnya, pada OpenStreetMap, tidak ada cara mudah untuk memberikan arahan dari satu titik ke titik lainnya, juga tidak ada tampilan jalan.

Paweł Dulak
sumber
Bagaimana cara menggunakan Angular 6?
Kalyanam Rajashree
1
saya menambahkan peta jalan terbuka dari tautan itu ke jsfiddle: jsfiddle.net/nLj1uaqc
Andrew
7

Seperti yang disarankan dalam komentar, saya menggunakan add-in Chrome " Google Maps Platform API " untuk mengidentifikasi dan menyelesaikan masalah.

Pada dasarnya, add-in ini mengarahkan saya ke sini di mana saya dapat masuk ke Google dan membuat kunci API gratis.

Setelah itu, saya memperbarui JavaScript saya dan segera menyelesaikan masalah ini.

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

Javascript yang diperbarui: ... script src = "https://maps.googleapis.com/maps/api/js?key=***** GOOGLE API KEY ****** & v = 3" ...

Add-in kemudian memvalidasi panggilan API JS. Semoga ini bisa membantu seseorang menyelesaikan masalah dengan cepat!

masukkan deskripsi gambar di sini

Mike Dubs
sumber
3

Sekarang google maps gratis untuk pengembangan saja.

Jika Anda ingin menggunakan peta gratis seperti sebelumnya, maka buat akun dengan detail yang valid (penagihan, pembayaran, dll.) Google memberikan $ 200 KREDIT BULANAN Yang SETIAP DENGAN PENGGUNAAN GRATIS

Untuk perincian lebih lanjut, lihat detail harga baru Google: google map pricing baru

Lihat juga rincian harga lama: Yang lama

Srikrushna
sumber
2

Jika mapTypeId Anda adalah SATELLITEatauHYBRID

baik, itu hanya tanda air, Anda dapat menyembunyikannya jika Anda mengubah <div>yang telah z-index=100 saya gunakan

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

atau bisa kamu gunakan

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

tetapi tidak responsif seperti setInterval

blesafho
sumber
apa yang kamu maksud dengan "responsif"?
Artem Bernatskyi
lebih cepat, tetapi tidak lebih efisien
blesafho
Jika metode-metode ini bekerja satu kali, mereka tetap tidak muncul. Mereka tampak seperti mereka memicu loop tak terbatas karena Google hanya flip-flop apa yang telah Anda lakukan.
Nosajimiki
Metode ini tidak akan berfungsi karena Google menggunakan serangkaian gambar yang berbeda, dengan tanda air diletakkan langsung di ubin peta, misalnya: maps.googleapis.com/maps/…
syntagma
1

Jika Anda ingin peta lokasi sederhana gratis yang menunjukkan lokasi bertanda tunggal, untuk situs web Anda, Lalu

  • Pergi ke AddMap .
  • Di sini Anda dapat mengisi detail untuk menyesuaikan sepenuhnya peta Anda seperti detail lokasi, ukuran, dan format peta.
  • Akhirnya untuk menambahkan kunci Google map api, Hasilkan menggunakan metode ini .

Beritahu saya jika ini akan membantu ..

Rahul Mahawar
sumber
0

Tampak bagi saya bahwa ketika menampilkan "Hanya untuk tujuan pengembangan", orang tidak dapat melihat konfigurasi peta juga saat mengembangkan (atau lebih tepatnya bermain-main dengan konfigurasi). Dalam kasus saya, saya belum mengaktifkan penagihan untuk dikaitkan dengan API yang saya gunakan dan saya pikir itulah alasan mengapa berperilaku seperti ini.

Ronow
sumber
0

Bagi saya, Kesalahan telah diperbaiki saat Penagihan diaktifkan di konsol google. (Saya mendapat uji coba pengembang 1 tahun)

Dilanka wasana
sumber
-5

Anda tidak dapat menggunakan tag iframe dalam HTML, inilah yang dapat Anda lakukan:
* buka saja google maps tunjukkan lokasi Anda
* klik "Bagikan"
* buka "Sematkan peta"
* salin kode HTML
* tempelkan di Halaman HTML
* sesuaikan tinggi dan lebar sesuai kebutuhan Anda
* jalankan

Ini mungkin berhasil

vijey
sumber