<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <meta charset="utf-8"> <title>Simple markers</title> <style> html, body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; } </style> </head> <body> <div id="map"></div> <script> function initMap() { var myLatLng = {lat: -25.363, lng: 131.044}; var map = new google.maps.Map(document.getElementById('map'), { zoom: 4, center: myLatLng }); var marker = new google.maps.Marker({ position: myLatLng, map: map, title: 'Hello World!' }); } </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=API_KEY&signed_in=true&callback=initMap"></script> </body> </html>
<script src="http://maps.google.cn/maps/api/js?v=3.20®ion=cn&language=zh-CN&key=your_key&callback=initMap"></script>
上面兩部分紅色字比較重要,一個是在域名,一個是訪問google地圖的key,這個需要翻牆到google官網進行注冊,然后復制過來就ok
Get Key Link:
https://developers.google.com/maps/documentation/javascript/?hl=zh-cn