Question

我只是想让我的谷歌地图插件工作。我的代码到目前为止我刚写完了：

    <html class="ui-mobile">
    <head>
        ............
        <script type="application/javascript" src="js/jquery-2.1.0.js"></script>
        <script type="application/javascript" src="js/jquery.mobile-1.4.2.min.js"></script>
        .............
        <script type="text/javascript" src="https://maps.google.com/maps/api/js?v=3.exp&amp;sensor=true"> </script>
        <script type="text/javascript">

            var fromLat = 0.000;
            var fromLng = 0.000;
            var toLat;
            var toLng;
            var mapcontainer;
            var map;

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


            function onGeoGetSuccess (p){
                fromLat = parseFloat(p.coords.latitude);
                fromLng = parseFloat(p.coords.longitude);
                alert("run"); //is fired
                calcRoute();

            }
            function onGeoGetFail(e){
                fromLat = 0.00;
                fromLng = 0.00;
                alert("fail");
            }
            function calcRoute() {
                var request = {
                    origin: new google.maps.LatLng(fromLat, fromLng),
                    destination:new google.maps.LatLng(toLat, toLng),
                    travelMode: google.maps.TravelMode.WALKING
                };
                directionsService.route(request, function(response, status) {
                    alert("status "+status )
                    if (status == google.maps.DirectionsStatus.OK) {
                      directionsDisplay.setDirections(response);
                    }
                });
            }
            function initGmap(){
                directionsDisplay = new google.maps.DirectionsRenderer();
                var mapOptions = {
                    zoom: 7,
                    disableDefaultUI : true,
                    draggable : false,
                    keyboardShortcuts : false,
                    scrollwheel : false,
                    mapTypeId: google.maps.MapTypeId.WALKING
                }
                map = new google.maps.Map(mapcontainer.find(".map-canvas").get(0), mapOptions);
                directionsDisplay.setMap(map);
                directionsDisplay.setPanel(t.find(".mapcontainer").get(0));

            }

        ///// just to show - this is triggered on a subpage which is autoloaded by jquery mobile
        $(".building_page").on("pageshow",function(){
                    t = $(this)
                    c = t.attr('data-destination').split(',');
                    toLat = c[0];
                    toLng = c[1];
                    mapcontainer = t;
                    google.maps.event.addDomListener(t, 'load', initGmap); 
                    navigator.geolocation.getCurrentPosition(onGeoGetSuccess, onGeoGetFail);
                });

        </script>
    </head>
    <body >
    <ul class="nativeDroidCards">
        <li>.........</li>
        <li>........</li>
        <li id="building_E_map" >
            <div class="map-canvas"></div>
            <div class="mapcontainer"></div>
            <a  href="maps:q=dfsfdsfdsfffdsf"><i class="icon-screenshot"></i>Navigation </a>
        </li>
    </ul>
    </body>
</html>

我可以说一切都被触发了，lat lon设置正确，设备的地理定位是正确的。

但我的容器是空的，没有错误。没有。我调试了它，因此很清楚：

directionsService.route(request, function(response, status) {
                    alert("status "+status )
                    if (status == google.maps.DirectionsStatus.OK) {
                      directionsDisplay.setDirections(response);
                    }
                });

从未打过。它只是从未打过电话。但也没有在任何地方发生错误。

只是，......荒谬。

任何想法？

提前致谢

Answer 1

您要包含两次API。一旦记录的方式，一旦错误：

<script type="text/javascript" src="https://maps.google.com/maps/api/js?v=3.exp&amp;sensor=true"> </script>
<script src="https://maps.gstatic.com/intl/de_de/mapfiles/api-3/16/5/main.js" type="text/javascript"></script>

删除不正确的一个（第二个，您不能直接访问API ...）

GMaps API - 没有回应

1 个答案: