0
我尝试显示使用HTML5地理位置谷歌地图,代码工作正常是的jsfiddle但在我的MVC应用程序,该地图是不是被displayed..posting下面的代码.. 这是链接 http://jsfiddle.net/PhzsR/62/在mvc3中显示带有html5地理位置的谷歌地图?
@{
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>
我需要添加任何参考显示谷歌地图?
与实现,即使现在地图不显示,但积极的是,添加脚本后,经纬度值显示...请检查我编辑的代码在我的问题 – 2013-02-11 11:58:37
默认情况下地图div不会有一个高度,所以它会崩溃,但可能都会工作。尝试为'#map' div添加明确的高度,例如'
' – 2013-02-11 12:12:59thnku,现在工作正常 – 2013-02-11 12:25:02