当我更改google.maps.LatLng时,路线服务在Google地图中不起作用 [英] Route service doesn't work in google map when i change google.maps.LatLng

查看:148
本文介绍了当我更改google.maps.LatLng时,路线服务在Google地图中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



应用程序描述:



用户在屏幕上看到谷歌地图,并且应该能够点击地图并看到被点击的点(第一次点击),并且当用户再次点击两个位置之间的路线时应该被绘制,

我发现这个:

解决方案

看起来位置离任何道路都太远,所以方位服务不知道从哪里开始路线。如果您将位置移到更接近道路的位置,例如如下所示: var myLatlng = new google.maps.LatLng(35.49000000000,51.36565089010); 然后您会看到它作品。


I am trying to develop a application using google map .

Description of application :

The user show see the google map on the screen and should be able to click on the map and see the point that is clicked (first click) and when the user click again the route between two location should be drawn ,

i found this : Working jsFiddle here

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Show Google Map with Latitude and Longitude in asp.net website</title>

<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false">
</script>
<script type="text/javascript">

    var map;
    var directionsDisplay = new google.maps.DirectionsRenderer();
    var directionsService = new google.maps.DirectionsService();

    function calcRoute(start, end) {

        directionsDisplay.setMap(map);

        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);
            }
        });
    }

    function initialize() {
        var myLatlng = new google.maps.LatLng(35.18061975930, 51.36565089010);
        var myOptions = {
            zoom: 7,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("gmap"), myOptions);
        // marker refers to a global variable
        marker = new google.maps.Marker({
            position: myLatlng,
            map: map
        });

        google.maps.event.addListener(map, "click", function (event) {
            // get lat/lon of click
            var clickLat = event.latLng.lat();
            var clickLon = event.latLng.lng();

            // show in input box
            document.getElementById("lat").value = clickLat.toFixed(5);
            document.getElementById("lon").value = clickLon.toFixed(5);

            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(clickLat, clickLon),
                map: map
            });

            var newLatLon = new google.maps.LatLng(clickLat, clickLon);
            calcRoute(myLatlng, newLatLon);

        });
    }

    window.onload = function () { initialize() };
</script>
     <style>
 div#gmap {
        width: 80%;
        height: 500px;
        border:double;
 }
    </style>
</head>

<body>
    <form id="form1" runat="server">
        Lat: <input type="text" id='lat'>
Lon: <input type="text" id='lon'>
        <center>
            <!-- MAP HOLDER -->
            <div id="gmap"></div>
            <!-- REFERENCES -->

            lat:
            lon:

        </center>

    </form>
</body>

</html>

In the sample code i just change this var myLatlng = new google.maps.LatLng(35.18061975930, 51.36565089010);,and when i changed it ,the routing service doesn't work .why ? i tried that in map.google.com and it works :

解决方案

It looks like the location is too far away from any roads, so the directions service does not know where to start the route from. If you move the position closer to a road, for example like so: var myLatlng = new google.maps.LatLng(35.49000000000, 51.36565089010); then you'll see that it works.

这篇关于当我更改google.maps.LatLng时,路线服务在Google地图中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆