O Google Maps mostra "Apenas para fins de desenvolvimento"

155

O Google Maps mostra a mensagem "Apenas para fins de desenvolvimento" quando tento mostrá-la na minha página da web:

insira a descrição da imagem aqui

Como eu poderia fazer essa mensagem desaparecer?

Meu código é assim:

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

Então depois eu tenho

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

Não vejo de onde essa mensagem se origina.

tmighty
fonte
6
Sei que essas perguntas já foram respondidas, mas Caso você não saiba, existe uma ferramenta chamada Verificador da API do Google Maps Platform para Google Chrome que permite depurar sua integração com o Google Maps -> chrome.google.com/webstore/detail/ google-maps-platform-api /…
Dayron Gallardo 6/18

Respostas:

190

O Google Maps não é mais gratuito. Você precisa associar um cartão de crédito para poder ser cobrado se o seu site tiver solicitações que excedam o crédito de US $ 200 que eles recebem mensalmente gratuitamente. É por isso que você recebe os mapas com marcas d'água.

Para mais informações, consulte: https://cloud.google.com/maps-platform/pricing/

Atualização: um problema comum com o novo sistema de cobrança é que agora você precisa ativar cada API separadamente. Todos eles têm preços diferentes (alguns até gratuitos), então o Google faz questão de habilitá-los individualmente para o seu domínio. Eu nunca fui um usuário pesado do Google Maps, mas tenho a sensação de que há muito mais APIs agora do que costumava existir.

Portanto, se você ainda receber uma mensagem de uso restrito após ativar o faturamento, descubra qual API precisa exatamente para os recursos que deseja oferecer e verifique se está ativada. As configurações da API são irritantemente difíceis de encontrar.

  1. Acesse este link: https://console.developers.google.com/apis/dashboard .
  2. Então você seleciona seu projeto no menu suspenso.
  3. Vá para a biblioteca no painel esquerdo.
  4. Navegue pelas APIs disponíveis e ative a que você precisa.
Victoria Ruiz
fonte
2
Os preços no mapa carregam --> developers.google.com/maps/documentation/embed/…
Ylama
muito obrigado, você salva meu dia. E para o FYI, pela primeira vez, vinculando sua conta ao google, você receberá 300 $ gratuitamente.
majorl3oat
1
Demora alguns dias para entrar em vigor? Eu fiz isso alguns dias atrás, mas ainda estou recebendo a mensagem nos meus mapas. Mesmo clique ao redor e fez com que eu aceite todos os acordos ..... eu ver onde o tráfego está vindo para ele no painel de instrumentos
DigitalMystery
Não, normalmente não leva muito tempo. Minha experiência é de minutos. Mas pode ser necessário ativar APIs diferentes para que as coisas funcionem. Que mensagem de erro você está recebendo, @DigitalMystery?
Victoria Ruiz
Está no meu aplicativo móvel. Inicialmente, o pop-up "Esta página não pode carregar o Google Maps corretamente". Clique em OK e o mapa mostra a mensagem acima. Também estou usando minha chave ..... @VictoriaRuiz
DigitalMystery
36

A marca d'água com  "apenas para fins de desenvolvimento " é retornada quando qualquer uma das seguintes situações for verdadeira:

  1. Está faltando uma chave de API na solicitação.
  2. O faturamento não foi ativado em sua conta.
  3. O método de cobrança fornecido é inválido (por exemplo, um cartão de crédito vencido).
  4. Um limite diário auto-imposto foi excedido.
Rushikesh Pandit
fonte
29

Como Victoria escreveu, o Google Maps não é mais gratuito, mas você pode mudar seu provedor de mapas. Você pode estar interessado no OpenStreetMap, existe uma maneira fácil de usá-lo em seu site descrito aqui: https://handyman.dulare.com/switching-from-google-maps-to-openstreetmap/

Infelizmente, no OpenStreetMap, não há uma maneira fácil de fornecer instruções de um ponto para outro, também não há vista da rua.

Paweł Dulak
fonte
Como fazer isso usando o Angular 6?
Kalyanam Rajashree
1
eu adicionei o mapa de rua aberto das que apontam para um jsFiddle: jsfiddle.net/nLj1uaqc
Andrew
7

Conforme recomendado em um comentário, usei o suplemento do Chrome " Verificador da API da Plataforma do Google Maps " para identificar e resolver o problema.

Essencialmente, este suplemento me direcionou para aqui, onde consegui acessar o Google e criar uma chave de API gratuita.

Posteriormente, atualizei meu JavaScript e ele resolveu imediatamente esse problema.

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

Javascript atualizado: ... script src = "https://maps.googleapis.com/maps/api/js?key=***** CHAVE DA API DO GOOGLE ****** & v = 3" ...

O suplemento validou a chamada da API JS. Espero que isso ajude alguém a resolver o problema rapidamente!

insira a descrição da imagem aqui

Mike Dubs
fonte
3

Agora, o Google Maps é gratuito apenas para desenvolvimento.

Se você deseja usar o mapa gratuitamente, como anteriormente, crie uma conta com detalhes válidos (cobrança, pagamento etc.). O Google concede US $ 200 em CRÉDITO MENSAL, o que equivale ao uso gratuito

Para mais detalhes, consulte os novos detalhes de preços do Google : google map new prices

Veja também os detalhes do preço antigo: Antigo

Srikrushna
fonte
2

Se o seu mapTypeId for SATELLITEouHYBRID

bem, é apenas uma marca d'água, você pode ocultá-la se mudar a <div>que z-index=100 eu uso

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

ou você pode usar

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

mas não é tão responsivo quanto setInterval

blesafho
fonte
o que você quer dizer com "responsivo"?
Artem Bernatskyi
mais rápido, mas não mais eficiente
blesafho 27/09/18
Se esses métodos funcionaram uma vez, eles ainda não parecem. Eles parecem disparar infinitos loops, já que o Google apenas inverte o que você fez.
Nosajimiki 01/10/19
Esse método não funcionará, pois o Google usa um conjunto diferente de imagens, com a marca d'água colocada diretamente no bloco do mapa, por exemplo: maps.googleapis.com/maps/…
syntagma
1

Se você deseja um mapa de localização simples gratuito mostrando um único local marcado, para o seu site,

  • Vá para AddMap .
  • Aqui você pode preencher detalhes para personalizar completamente seu mapa, como detalhes de localização, tamanho e formatação do mapa.
  • Finalmente, para adicionar a chave api do google map, gere-a usando este método .

Deixe-me saber se isso ajudaria ..

Rahul Mahawar
fonte
0

Parece-me que, quando ele exibe "Somente para fins de desenvolvimento", não é possível ver as configurações do mapa também durante o desenvolvimento (ou melhor, brincando com as configurações). No meu caso, não habilitei o faturamento para ser associado à API que estou usando e acho que é por isso que ele está se comportando dessa maneira.

Ronow
fonte
0

Para mim, o erro foi corrigido quando o Faturamento foi ativado no console do Google. (Eu tenho uma avaliação de desenvolvedor de 1 ano)

Dilanka wasana
fonte
-5

Você não pode usar a tag iframe no HTML, eis o que você pode fazer:
* basta acessar o google maps e indicar sua localização
* clique em "Compartilhar"
* vá em "Incorporar um mapa"
* copie o código HTML
* cole-o no seu Página HTML
* ajuste a altura e a largura de acordo com sua exigência
* execute-a

Isso pode funcionar

vijey
fonte