Código completo abaixo:
<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=CHAVEKEY"></script> <script type="text/javascript" src="jquery.googlemap.js"></script> </head> <body> <script type="text/javascript"> $(function() { $("#map").googleMap({ zoom: 15, // Initial zoom level (optional) type: "ROADMAP" // Map type (optional) }); $("#map").addMarker({ address: "avenida paulista, 1000 - São Paulo - SP" // Endereço }); }) </script> </body> </html>
Chave key:
- Obtenha a chave usando este Tutorial
- Cola a chave key no segundo java script, aonde está escrito CHAVEKEY
Download do Jquery Google Maps:
- Faça o download aqui
- Cole o arquivo jquery.googlemap.js na mesma pasta do arquivo raiz
Configuração:
Coloque o endereço dentro do campo address: