Google Maps affiche le message "À des fins de développement uniquement" lorsque j'essaie de l'afficher sur ma page Web:

Comment pourrais-je faire disparaître ce message?

Mon code est comme ça:

<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>

Puis plus tard j'ai

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

Je ne vois pas d'où vient ce message.

Google Maps n'est plus gratuit. Vous devez associer une carte de crédit afin de pouvoir être facturé si votre site a des demandes qui dépassent le crédit de 200 $ qu'il vous accorde gratuitement chaque mois. C'est pourquoi vous obtenez les cartes filigranées.

Pour plus d'informations, consultez: https://cloud.google.com/maps-platform/pricing/

Mise à jour: un problème courant avec le nouveau système de facturation est que vous devez désormais activer chaque API séparément. Ils ont tous des prix différents (certains sont même gratuits), donc Google met un point d'honneur à vous les activer individuellement pour votre domaine. Je n'ai jamais été un grand utilisateur de Google Maps, mais j'ai le sentiment qu'il y a beaucoup plus d'API maintenant qu'il n'y en avait auparavant.

Donc, si vous recevez toujours un message d'utilisation restreinte après avoir activé la facturation, découvrez de quelle API vous avez exactement besoin pour les fonctionnalités que vous souhaitez offrir et vérifiez si elle est activée. Les paramètres de l'API sont extrêmement difficiles à trouver.

1. Accédez à ce lien: https://console.developers.google.com/apis/dashboard .
2. Ensuite, vous sélectionnez votre projet dans la liste déroulante.
3. Accédez à la bibliothèque dans le volet gauche.
4. Parcourez les API disponibles et activez celle dont vous avez besoin.

Filigrane avec  " à des fins de développement uniquement " est renvoyé lorsque l'une des conditions suivantes est vraie:

1. Il manque une clé API dans la requête.
2. La facturation n'a pas été activée sur votre compte.
3. La méthode de facturation fournie n'est pas valide (par exemple, une carte de crédit expirée).
4. Une limite quotidienne auto-imposée a été dépassée.

Comme Victoria l'a écrit, Google Maps n'est plus gratuit, mais vous pouvez changer de fournisseur de carte. Vous pouvez être intéressé par OpenStreetMap, il existe un moyen simple de l'utiliser sur votre site décrit ici: https://handyman.dulare.com/switching-from-google-maps-to-openstreetmap/

Malheureusement, sur OpenStreetMap, il n'y a pas de moyen facile de fournir des directions d'un point à un autre, il n'y a pas non plus de vue de la rue.

Pour mes besoins, j'ai fini par utiliser une alternative https://www.openstreetmap.org/ .

Comme recommandé dans un commentaire, j'ai utilisé le " Vérificateur d'API Google Maps Platform complément Chrome " pour identifier et résoudre le problème.

Essentiellement, ce complément m'a dirigé vers ici endroit où j'ai pu me connecter à Google et créer une clé API gratuite.

Ensuite, j'ai mis à jour mon JavaScript et cela a immédiatement résolu ce problème.

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

Javascript mis à jour: ... script src = "https://maps.googleapis.com/maps/api/js?key=***** CLÉ D'APIGOOGLE ****** & v = 3" ...

Le complément a ensuite validé l'appel d'API JS. J'espère que cela aidera quelqu'un à résoudre le problème rapidement!

Désormais, google maps est gratuit pour le développement uniquement.

Si vous souhaitez utiliser la carte gratuitement comme précédemment, créez un compte avec des détails valides (facturation, paiement, etc.) google donne 200 $ DE CRÉDIT MENSUEL, ÉQUIVALENT À UNE UTILISATION GRATUITE

Pour plus de détails, veuillez consulter les nouveaux détails des prix de Google : nouvelle tarification de google map

Voir également les anciens détails de prix: Ancien

Si votre mapTypeId est SATELLITEouHYBRID

eh bien, c'est juste un filigrane, vous pouvez le cacher si vous changez celui <div>que z-index=100 j'ai utilisé

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

ou vous pouvez utiliser

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

mais ce n'est pas aussi réactif que setInterval

Si vous voulez une carte de localisation simple gratuite montrant un seul emplacement marqué, pour votre site Web, alors

• Accédez à AddMap .
• Ici, vous pouvez remplir les détails pour personnaliser entièrement votre carte, comme les détails de l'emplacement, le dimensionnement et le formatage de la carte.
• Enfin, pour ajouter la clé api google map, générez-la en utilisant cette méthode .

Faites-moi savoir si cela peut vous aider.

Il me semble que lorsqu'il affiche le "À des fins de développement uniquement", on ne peut pas non plus voir les configurations de la carte pendant le développement (ou plutôt jouer avec les configurations). Dans mon cas, je n'ai pas activé la facturation pour être associée à l'API que j'utilise et je pense que c'est la raison pour laquelle elle se comporte de cette façon.

Pour moi, l'erreur a été corrigée lors de l'activation de la facturation dans la console Google. (J'ai eu un essai de développeur d'un an)

Vous ne pouvez pas utiliser la balise iframe en HTML, voici ce que vous pouvez faire:
* il vous suffit d'aller dans google maps pour indiquer votre emplacement
* de cliquer sur "Partager"
* d'aller dans "Intégrer une carte"
* de copier le code HTML
* de le coller dans votre Page HTML
* ajustez la hauteur et la largeur en fonction de vos besoins
* exécutez-la

Cela pourrait fonctionner