như @geocodezip nói: Bạn đang tìm kiếm Google Ma ps Javascript v3.
Đây là ví dụ đơn giản về sử dụng nó (được chọn từ số old answer) của tôi, điều này không cần bất kỳ khóa nào.
HTML:
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<div id="map-canvas"></div>
CSS:
#map-canvas {
margin: 0;
padding: 0;
height: 100%;
}
Javascript:
function initialize() {
var myLatlng = new google.maps.LatLng(43.565529, -80.197645);
var mapOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
//=====Initialise Default Marker
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'marker'
//=====You can even customize the icons here
});
//=====Initialise InfoWindow
var infowindow = new google.maps.InfoWindow({
content: "<B>Skyway Dr</B>"
});
//=====Eventlistener for InfoWindow
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
tôi đã tạo ra một 012.344.để bạn tham khảo.
Hy vọng bạn có một số ý tưởng.
Vì bạn không quan tâm đến việc sử dụng các phím, Beware of the limits.
API Javascript của Google Maps: tối đa 25.000 lượt tải bản đồ mỗi ngày cho mỗi dịch vụ .
này bao gồm:
- bản đồ sẽ được hiển thị bằng cách sử dụng API JavaScript của Google Maps (V2 hay V3) khi
nạp bởi một trang web hoặc ứng dụng;
- Ảnh toàn cảnh Chế độ xem phố được hiển thị bằng API JavaScript của Maps (V2 hoặc V3) bởi một trang web hoặc ứng dụng không hiển thị bản đồ ;
- một SWF tải API Maps cho Flash được tải bởi trang web hoặc ứng dụng ; hoặc
- yêu cầu duy nhất được thực hiện cho hình ảnh bản đồ từ API bản đồ tĩnh.
- yêu cầu duy nhất được thực hiện cho hình ảnh toàn cảnh từ Chế độ xem phố API hình ảnh.
Từ ý kiến của bạn,
tôi cũng cố gắng sử dụng canvas, nó đã không làm việc.
var mapCanvas = document.createElement("canvas");
Nhưng điều này hoạt động tốt với yếu tố div.
var mapCanvas = document.createElement("div");
mapCanvas.style.width = "200px";
mapCanvas.style.height = "200px";
Updated JSFiddle
Đừng quên để thiết lập các thuộc tính chiều rộng và chiều cao.
Ý anh là gì bởi "năng động"? Bạn muốn có liên kết đến [Google Map] (https://maps.google.com/maps?q=lincoln,+NE&hl=vi&sll=40.85968,-74.157769&sspn=0.201496,0.304871&hnear=Lincoln,+Lancaster,+Nebraska&t = m & z = 12), vì vậy bạn có thể phóng to và xoay nó? Giống như [this] (https://maps.google.com/maps?q=-32.0000343,-58.0000343&hl=vi&ll=-31.952162,-58.007812&spn=7.230774,9.755859&sll=40.806862,-96.681679&sspn=0.201657,0.304871&t = m & z = 5) – geocodezip
Chính xác! Xin lỗi tôi sẽ thêm điều này vào mô tả – gal007
Đi tới bản đồ google. Thiết lập bản đồ như bạn muốn nó xuất hiện. Nhấp vào biểu tượng "liên kết" (trông giống như một chuỗi). Sao chép URL đó và sử dụng nó. Hoặc để kiểm soát nhiều hơn, hãy sử dụng Google [API Javascript Maps v3] (https://developers.google.com/maps/documentation/javascript/basics) – geocodezip