Cách đặt bản đồ thành div trong div khác?

Tôi là một newbie trong javascript và tôi cần sự giúp đỡ của bạn về việc thiết lập một bản đồ google thành phần tử div nằm trong phần tử div khác. Dưới đây là đoạn code mà hoạt động nếu các yếu tố div không lồng nhau:Cách đặt bản đồ thành div trong div khác?

function initialize() { 

var myOptions = { 
    center: new google.maps.LatLng(-34.397, 150.644), 
    zoom: 8, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 

var map = new google.maps.Map(document.getElementById("map_canvas"), 
     myOptions);

Tuy nhiên nếu tôi đã lồng divs, nó không hoạt động:

<body onload="initialize()"> 
<div id="main"> 
    <div id="map_canvas" style="width:100%; height:100%"></div> 
</div> 
</body>

Làm thế nào để giải quyết vấn đề này?

Nguồn

2012-05-23 reederz

Sau một chút thử nghiệm, tôi kết luận rằng bạn cần phải thiết lập một chiều cao để id="main" div của bạn cũng

style="width:100%; height:100%"

Bởi vì đó là một container vào bản đồ, và không có một chiều cao được xác định không có gì sẽ xuất hiện. Nó giống như lăn xuống một bức màn, bản đồ sẽ không tự đẩy nó xuống.

Tôi giả sử bạn có một cái gì đó tương tự như đã quá kể từ khi bản đồ hoạt động mà không làm tổ, nhưng tôi sẽ đề cập đến nó một lần nữa:

<style type="text/css"> 
    html, body {height:100%} 
</style>

Nguồn

2012-05-23 02:02:41

Cảm ơn. Làm việc hoàn hảo. Tôi đang tìm kiếm vấn đề ở nơi hoàn toàn sai. – reederz

Bạn được chào đón! –

bản đồ Google cần một chiều cao tĩnh và chiều rộng cho vải của nó. Bạn không nên sử dụng% cho chiều cao và chiều rộng nếu div mẹ không có kích thước tĩnh. Ngoài ra bản đồ google có một lỗi mà nó không thể tải trong div ẩn. (bạn cần phải có một số mẹo nếu làm như vậy)

Nguồn

2012-05-23 02:34:41

Cách đặt bản đồ thành div trong div khác?

Trả lời

Các vấn đề liên quan