Question

我想创建一个应用程序，要求我获取我的位置并在谷歌地图上显示它。我使用了http://wiki.phonegap.com/w/page/16494764/PhoneGap%20Geolocation%20Sample%20Application中的代码。我正在使用phonegap 2.0.0为Android 2.2开发。我正在使用模拟器2.2。

我已正确安装Phonegap中的所有内容，并且我获得了地图的Google Api3密钥。我把钥匙放在：http://maps.google.com/maps/api/staticmap?center=(here后放钥匙）。现在当我启动应用程序时，我使用CMD发送coördinates。 Telnet Localhost 5554，geo fix et cetera。当我启动应用程序时，它会给出一个错误：无法检索位置错误[对象位置错误]。

我不再收到错误（我添加了启用HighAccuracy）。但它也没有显示任何东西。所以我觉得我在谷歌地图上做错了什么，或者我忘记了什么。

有人能帮帮我吗？它在左上角显示一个问号。

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

     <head>

<meta name="viewport" content="width=device-width; height=device-height; user-scalable=no" />

<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Beer Me</title>
<link rel="stylesheet" href="/master.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript">

               function loader() {

                    var state = document.readyState;

                    if (state == 'loaded' || state == 'complete') {

                         run();

                    } else {

                         if (navigator.userAgent.indexOf('Browzr') > -1) {

                              setTimeout(run, 250);

                         } else {

                              document.addEventListener('deviceready',run,false);
                         }
                         }
                         }

               function run() {
                   var imageUrl = "http://maps.google.com/maps/api/staticmap?sensor=false&center=" + latitude + ',' + longitude +
                   "&zoom=14&size=300x400&markers=color:blue|label:S|" + latitude + ',' + longitude;
               console.log("imageUrl-" + imageUrl);
               $("#map").remove();
               $(document.body).append(
                   $(document.createElement("img")).attr("src", imageUrl).attr('id', 'map')
               );

                    var fail = function(e) {
                         alert('Can\'t retrieve position.\nError: ' + e);
                    };
                    navigator.geolocation.getCurrentPosition(imageUrl, fail,{ enableHighAccuracy: true });
               } 

          </script>
     </head>

Answer 1

/* enter code here */ function GetCurrentLocation()
            {
                if (navigator.geolocation) { 
                    navigator.geolocation.getCurrentPosition(function(position) {  

                                                             var point = new google.maps.LatLng(position.coords.latitude, 
                                                                                                position.coords.longitude);

                                                             // Initialize the Google Maps API v3
                                                             var map = new google.maps.Map(document.getElementById('map'), {
                                                                                           zoom: 16,
                                                                                           center: point,
                                                                                           mapTypeId: google.maps.MapTypeId.ROADMAP
                                                                                           });

                                                             // Place a marker
                                                             new google.maps.Marker({
                                                                                    position: point,
                                                                                    map: map
                                                                                    });
                                                             }); 
                } 
                else {
                    alert('W3C Geolocation API is not available');
                }
            }

使用此代码并在

上设置sensor = false

希望它会有所帮助。请记住，它不是静态地图。

Answer 2

您需要将google java脚本文件导入到您的解决方案中

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

然后可以使用下面的代码来显示您的位置...只需替换您的纬度和经度

   var imageUrl = "http://maps.google.com/maps/api/staticmap?sensor=false&center=" + latitude + ',' + longitude +
        "&zoom=14&size=300x400&markers=color:blue|label:S|" + latitude + ',' + longitude;
    console.log("imageUrl-" + imageUrl);
    $("#map").remove();
    $(document.body).append(
        $(document.createElement("img")).attr("src", imageUrl).attr('id', 'map')
    );

手机差距地理定位与谷歌地图

2 个答案: