Google지도의 다중 컨트롤 인스턴스가 작동하지 않습니다.

Question

Google지도가 포함 된 사용자 컨트롤을 만들었습니다. 초기화

<script type="text/javascript" language="javascript"> 
var map; 
function intialize(){ 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

     //set the default center 
     map.setCenter(myLatlng); 
     //set the default zoom 
     map.setZoom(initialZoom); 

     //Set the map type 
     map.setMapTypeId(google.maps.MapTypeId.SATELLITE); 
} 
</script> 

HTML code: 
<div id="map_canvas" style="float: left; width: 100%; height: 300px; border: solid 1px black;" > </div> 

전화를 다음과 같이 사용자 컨트롤에 코드는() 함수 뒤에 코드에서 Me.Page.ClientScript.RegisterStartupScript (Me.GetType()를 사용 (.ascx.cs)이다 "FunctionCall" , "initialize();")

사용자 컨트롤을위한 단일 인스턴스가 부모 페이지 (.aspx 페이지)에서 사용될 때 모든 것이 잘 작동합니다. 그러나이 사용자 정의 컨트롤을 페이지에서 여러 번 사용하려고하면 첫 번째 인스턴스에 대한 맵만 표시됩니다. 그러나 다른 인스턴스는 사용자 컨트롤을 4 번 사용하는 경우 내가 예를 들어 사용자 제어 의 모든 인스턴스에 대한 구글지도를 표시 할 아무것도하지만, 빈

표시되지 않습니다, 4지도

Answer 1

첫 번째를 표시한다 내가 시도 할 일은 각 div 요소에 대해 고유 한 ID를 생성하는 것입니다.

Answer 2

자바 스크립트는 첫 번째 "map_canvas"div에만지도를 추가합니다. 이 기능을 사용하려면 jquery를 사용하고 div id를 변경해야 할 수도 있습니다.