2014-04-17 3 views
0

Google지도에 여러 마커를 표시하고 싶습니다. 위도와 경도가 포함 된 모델 목록을 반복 할 때 각 루프를 사용하고 있습니다.하지만 함수가 호출되어지도가 표시되지 않습니다. .여러 마커가있는 Google지도가 나타나지 않습니다.

코드 :

 <div id="map_canvas" style="width: 80%; height: 80%"> </div> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"> 
    </script> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js? 
     sensor=false"></script> 
     <script type="text/javascript"> 
$(document).ready(function() { 
    alert("working"); 
    var map; 
    var locations = []; 

    var options = { 
     zoom: 14, 
     center: new google.maps.LatLng(0, 0), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map($('#map_canvas')[0], options); 


    @* This is the razor loop *@ 
    @foreach (var item in Model) { 
    <text> 
    locations.push(item.latitude, item.longitude); 

    </text> 
    } 
    var i; 
    for (i = 0; i <= locations.length; i++) { 
     var latlng = new google.maps.LatLng(locations[i][0], locations[i][1]); 

     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
     }); 

    } 

}); 
</script> 

답변

0

map_canvas 당신이 시도 적이 :

$(document).ready(function() { 
var map; 
var elevator; 
var myOptions = { 
    zoom: 1, 
    center: new google.maps.LatLng(0, 0), 
    mapTypeId: 'terrain' 
}; 
map = new google.maps.Map($('#map_canvas')[0], myOptions); 

var addresses = ['Norway', 'Africa', 'Asia','North America','South America']; 

for (var x = 0; x < addresses.length; x++) { 
    $.getJSON('http://maps.googleapis.com/maps/api/geocode/json?address='+addresses[x]+'&sensor=false', null, function (data) { 
     var p = data.results[0].geometry.location 
     var latlng = new google.maps.LatLng(p.lat, p.lng); 
     new google.maps.Marker({ 
      position: latlng, 
      map: map 
     }); 

    }); 
} 

});

자바 스크립트 코드를 포함 aswell :

http://jsfiddle.net/P2QhE/

+0

내 업데이트 개발 code.i이 유사한 접근 방식을 사용하지만,지도 – Wasfa

+0

표시되지 않습니다하는 곳은 위의 스크립트 업데이트하고있다 tag.i 당신의 사업부

+0

입니다 확인 내 코드 – Wasfa

1

이 작동하지 않습니다

var latlng = new google.maps.LatLng(markerlatLng); 

markerlatLng

이미 google.maps.LatLng이며, 결과는 잘못된 LatLng를 할 것이다.

사용 markerlatLng 또한 options

에 대한 -property center 등을 : 당신은 루프에서 맵 작성을 분리해야한다. 루프 후 중심을 루프 전에지도를 작성 AMD의 설정 : 또한

map.setCenter(markerlatLng); 

: 를 마커의지도 - 속성이 있어야한다 map하지

관련 문제