使用 Google Map API JS 无法在 intel xdk 中看到 google map

Question

这是我的第一个 Google 地图 API 项目，我正在创建一个交通应用程序，但不幸的是它不起作用，早些时候它可以工作但现在它只能在浏览器中工作而不是在手机和模拟器。

在模拟器中它只显示 Google 标志和 Terms Link.

我正在使用这个参考 google link

<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=MYKEY&libraries=places"></script>

我的 JS 代码：(mapwork.js)

function currentpostionmap()
{
     if ( navigator.geolocation ) {


        function success(pos) 
         {
             var latlng = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
             var myOptions = {
            zoom: 15,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map"), myOptions);
          var image123 = 'https:///developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png';
             var bounds = new google.maps.LatLngBounds();
        marker = new google.maps.Marker({
            position: latlng,
            map: map,
            icon: image123
        
        });
              bounds.extend(latlng);
                    map.fitBounds(bounds);
//            
                    multimarker(map);
//               

        }
        function fail(error) {
           var latlng = new google.maps.LatLng(18.5204, 73.8567);
             var myOptions = {
            zoom: 10,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
            map = new google.maps.Map(document.getElementById("map"), myOptions);
      
            marker = new google.maps.Marker({
            position: latlng,
            map: map
           
            });


        }
        // Find the users current position.  Cache the location for 5 minutes, timeout after 6 seconds
        navigator.geolocation.getCurrentPosition(success, fail, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});
    } 
}
function multimarker(map)
{
          jQuery.ajax({                              
    url: baseurl +  "getdriverlocation.php",

    async: true,
    success: function(data){
       var myArray = jQuery.parseJSON(data);// instead of JSON.parse(data)

        jQuery(myArray).each(function( index, element ) {     
        driverlat = element.driver_lat;
        driverlng = element.driver_lng;
        locations.push([driverlat , driverlng])
});



 for (i  = 0; i < locations.length; i++)
                 { 
                var latlng1 = new google.maps.LatLng(locations[i][0], locations[i][1]);

            drivermarker=new google.maps.Marker({position:latlng1});
            drivermarker.setMap(map);

           google.maps.event.addListener(drivermarker, 'click', (function(marker, i) {
            return function() {

            //DRIVER CLICK EVENT
        }
      })(drivermarker, i));



                 }


} 

});

}
 function watchDriverPosition(userid)
{
    function success(pos)
    {
         window.setInterval(function(){
          saveDriverLocation(pos.coords.latitude, pos.coords.longitude,userid);
        }, 50000);
    }
    function fail()
    {
        alert ('Fail to watch drivers Position');
    }
    watchId = navigator.geolocation.watchPosition(success, fail, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});

}
function saveDriverLocation(latc,lngc,userid)
{

     jQuery.ajax({
url: baseurl + "postdriverlocation.php",
data:'latitude='+latc +'&longitude='+lngc+'&login_id='+userid,
type: "POST",
success:function(response){
    response = $.trim(response);
    if (response == "false"){
       console.log(response);


  }else{
      console.log(response);
  }


},
error:function (){}
});
}

在这里调用地图函数(main.js)

function showmap(usertype,userid)
    {
        if (usertype==1)
            {
                          changepage('#main');
                currentpostionmap();

            }
        else if (usertype==0)
            {

                watchDriverPosition(userid);

            }
        else{
            alert('You are not logged in.');
            changepage('#login');
        }
    }

它适用于所有浏览器，但不适用于 EMULATOR 或 MOBILE PHONE。

请告诉我为什么会这样并提供更好的解决方案

谢谢

Answer 1

将您的地图代码包装到

 $( document ).on( "pageshow", "#YOUR_MAP_PAGE", function() {

//your map code...

});

使用 Google Map API JS 无法在 intel xdk 中看到 google map

Not able to see google map in intel xdk using Google Map API JS

javascript

google-maps

geolocation

cordova

intel-xdk