Question

下面的代码在html页面中工作，但是当我在aspx页面中使用相同的代码时，地图没有出现。任何人都能说出我做错了什么。

我有5次停留作为航路点。我想在地图中显示所有这些作为推动点和旅行路线。

<html>
 <head>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script type="text/javascript">
        var directionsDisplay;
        var directionsService = new google.maps.DirectionsService();
        var map;

        function initialize() {
            directionsDisplay = new google.maps.DirectionsRenderer();
            var chicago = new google.maps.LatLng(17.42354, 78.46290);
            var mapOptions = {
                zoom: 6,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                center: chicago
            }
            map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

            directionsDisplay.setMap(map);

        }

        function calcRoute() {

            var start = "17.44438,78.44251";
            var end = "17.3687826,78.5246706";
            var waypts = [];
            waypts.push({
                location: "17.44438,78.44251",
                stopover: true
            });
            waypts.push({
                location: "17.413384,78.461142",
                stopover: true
            });
            waypts.push({
                location: "17.38364,78.466964",
                stopover: true
            });
            waypts.push({
                location: "17.3836013,78.4869135",
                stopover: true
            });
            waypts.push({
                location: "17.3687826,78.5246706",
                stopover: true
            });




            var request = {
                origin: start,
                destination: end,
                waypoints: waypts,
                optimizeWaypoints: true,
                travelMode: google.maps.TravelMode.DRIVING
            };
            directionsService.route(request, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);

                }
            });
        }
        google.maps.event.addDomListener(window, 'load', initialize);
        window.onload = function () { initialize(); calcRoute(); };
    </script></head>
<body>
    <form id="form1" runat="server">

    <div id="map-canvas"></div>
    </form>
</body>
</html>

Answer 1

您必须指定地图为对齐的div的高度和宽度

对于html，无需指定宽度

谷歌地图与方式点不在aspx页面工作同样的事情是在HTML中工作

1 个答案: