Google Maps API asp.net

Question

我正在尝试在ASR.NET MVC中使用Google Map API。 我想使用DirectionsRenderer。 我在这里阅读了有关该文档的文档，并尝试使用示例。但是此地图未在我的网站中呈现。 哪里可能有问题？

<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=MY_KEY&sensor=false">
    </script>
    <script>
        var directionDisplay;
        var directionsService = new google.maps.DirectionsService();

        function initialize() {
            directionsDisplay = new google.maps.DirectionsRenderer();
            var mapOptions = {
                zoom: 7,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                center: new google.maps.LatLng(41.850033, -87.6500523)
            };
            var map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);
            directionsDisplay.setMap(map);
            directionsDisplay.setPanel(document.getElementById('directions-panel'));

            var control = document.getElementById('control');
            control.style.display = 'block';
            map.controls[google.maps.ControlPosition.TOP].push(control);
        }

        function calcRoute() {
            var start = document.getElementById('start').value;
            var end = document.getElementById('end').value;
            var request = {
                origin: start,
                destination: end,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };
            directionsService.route(request, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                }
            });
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>
<body onload="initialize()">
    <div id="control">
        <strong>Start:</strong>
        <select id="start" onchange="calcRoute();">
            <option value="chicago, il">Chicago</option>
            <option value="st louis, mo">St Louis</option>
        </select>
        <strong>End:</strong>
        <select id="end" onchange="calcRoute();">
            <option value="chicago, il">Chicago</option>
            <option value="st louis, mo">St Louis</option>
        </select>
    </div>
    <div id="map-canvas" style="float: left; width: 70%; height: 100%">
    </div>
    <div id="directions-panel" style="float: right; width: 30%; height: 100%">
    </div>
</body>

Answer 1

确保已在脚本src="http://maps.googleapis.com/maps/api/js?key=MY_KEY&sensor=false"设置了正确的密钥，因为我已经尝试过使用自己的密钥来编写代码并且它可以工作..如果您需要calcRoute();函数calcRoute(); 要在页面加载时调用，只需在初始化函数calcRoute();的末尾添加此行calcRoute();

Google Maps API asp.net

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-03-28 11:34:27

Google Maps API asp.net

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-03-28 11:34:27

解决方案1
0 已采纳 2013-03-28 11:34:27