在mvc3中顯示帶有html5地理位置的谷歌地圖？

Question

我嘗試顯示使用HTML5地理位置谷歌地圖，代碼工作正常是的jsfiddle但在我的MVC應用程序，該地圖是不是被displayed..posting下面的代碼.. 這是鏈接 http://jsfiddle.net/PhzsR/62/

@{ 
ViewBag.Title = "Home Page"; 
} 

<h2>@ViewBag.Message</h2> 


<div id="results"></div> 

<div id="map"></div> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
var $message_area = jQuery('#results'); 
jQuery(document).ready(function() { 
$message_area.html('<i>Locating you...</i> '); 
if (navigator.geolocation) { 

    navigator.geolocation.getCurrentPosition(


    function foundLocation(position) { 
     $message_area.children().remove(); 

     var latitude = position.coords.latitude; 
     var longitude = position.coords.longitude; 
     var accuracy = position.coords.accuracy; 

     var map; 


     var centerPosition = new google.maps.LatLng(latitude, longitude); 

     var options = { 
      zoom: 12, 
      center: centerPosition, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

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

     var marker = new google.maps.Marker({ 
      position: centerPosition, 
      map: map, 
      icon: 'http://google-maps-icons.googlecode.com/files/sailboat-tourism.png' 
     }); 

     var circle = new google.maps.Circle({ 
      center: centerPosition, 
      radius: accuracy, 
      map: map, 
      fillColor: '#0000FF', 
      fillOpacity: 0.5, 
      strokeColor: '#0000FF', 
      strokeOpacity: 1.0 
     }); 




     map.fitBounds(circle.getBounds()); 






     $message_area.append('Your latitude: ' + latitude + ' and longitude: ' + longitude + ' and accuracy: ' + accuracy + ':') 
    }, function (error) { 
     switch (error.code) { 
      case error.TIMEOUT: 
       $message_area.append('Timeout error while finding your location'); 
       break; 
      case error.POSITION_UNAVAILABLE: 
       $message_area.append('Position unavailable error while finding your location'); 
       break; 
      case error.PERMISSION_DENIED: 
       $message_area.append('Permission denied error while finding your location'); 
       break; 
      case error.UNKNOWN_ERROR: 
       $message_area.append('Unknown error while finding your location'); 
       break; 
     } 
    }); 






} 
}); 

</script> 

我需要添加任何參考顯示谷歌地圖？

Answer 1

如果你看一下「管理資源」你的小提琴標籤，你必須谷歌地圖API這是不是在你的代碼上面的引用，請確保您添加

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>