0

HTML5地理位置情報を使用してGoogleマップを表示しようとしていますが、コードはjsfiddleで正常に動作していますが、私のmvcアプリケーションではマップが表示されていません..以下のコードを投稿しています..これはリンク 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>

Googleマップを表示するための参照を追加する必要がありますか?

4

1 に答える 1

0

フィドルの「リソースの管理」タブを見ると、上記のコードには含まれていない Google Maps API への参照があります。必ず追加してください

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
于 2013-02-11T10:23:40.810 に答える