phonegap cordova凝胶位置未显示在手机上

phonegap cordova gelocation not showing out on phone

本文关键字:显示 手机 位置 cordova phonegap      更新时间:2023-09-26

var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');
        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');
        console.log('Received Event: ' + id);
    }
};
 var myLatlng = new google.maps.LatLng(37.3000, -120.4833);
 
        var mapOptions = {
            center: myLatlng,
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map"), mapOptions);
 var marker = new google.maps.Marker({
position: myLatlng,
map: map,
draggable: true,
animation: google.maps.Animation.DROP
 });
  
        navigator.geolocation.getCurrentPosition(function(pos) {
            map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
            var myLocation = new google.maps.Marker({
                position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),
                map: map,
                title: "My Location"
            });
        });
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Geo Location</title>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map { height: 100% }
</style>
<script type="text/javascript" src="cordova.js"></script>
 <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyB1oJGDZP2lM3c1dnPBmAbPBOb_Rh4u8n0&sensor=true"></script>
 <script type="text/javascript" src="js/index.js"></script>
</head>
<body>
	asd
<div id="map"></div>
</body>
</html>

当我运行这两个文件时,谷歌地图没有出现在我的手机中,我不知道为什么,但当在网络浏览器中运行时,它可以工作,我还安装了cordova地理定位插件并添加了权限,但仍然无法工作,你们中的任何人能帮我吗?

@user3711175,你有几个问题@Joerg是对的。您将需要使用whitelist系统 您有两(2)个问题

更新-2015-12-23:我误读了代码#1不适用

###1.您在中的错误上下文中使用this

document.addEventListener('deviceready', this.onDeviceReady, false);

你想写app.onDeviceReady,像这样:

document.addEventListener('deviceready', app.onDeviceReady, false);

当EventListener最终激发时,它不再位于app对象的上下文中。它现在是全球性的。有关详细信息,请参阅此SO post

  • iOS上的PhoneGap网络信息插件存在问题

2.您需要应用whitelist系统

这个白名单工作表应该会有所帮助
如何应用Cordova/Phonegap白名单系统

以下内容需要添加到谷歌地图制作whitelist中。

以下域名是谷歌地图所必需的。

  • maps.googleapis.com
  • mt0.googleapis.com mt1.googleapis.com
  • fonts.googleapis.com
  • csi.gstatic.com
  • maps.gstatic.com

可用通配符(*)。阅读文档。