1

我正在工作灯中开发一个多页应用程序。
在这个应用程序中，我试图基于示例应用程序（也由 Worklight 提供）实现 Worklight 提供的位置服务。

我能够得到纬度和经度。通过纬度和经度，我试图在谷歌地图中定位位置并显示地图。另外我想根据纬度和经度添加一个标记。

下面是我的 HTML 页面：

<div class="longitude">Longitude: 
                <input type="text" id="long"/>
            </div>
            <div class="latitude">Latitude: 
                <input type="text" id="lat"/>
            </div>
            <div id="googleMap" style="width:500px;height:380px;"></div>  
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js key=AIzaSyBGTVsuc8dBv8o0sgBV9A8huVo36LPFMA8&sensor=false"> </script>

以及对应的 .js 文件：

currentPage={};
currentPage.init = function() {
    WL.Logger.debug("LocationServices : : init");
};

function loadLatLong() {
    // start up acquisition process
    getFirstPositionAndTrack();
   // keep running while in background on Android; will show a notification
    WL.App.setKeepAliveInBackground(true);  
};



 function getFirstPositionAndTrack() {  
        window.alert('Click OK to proceed to acquire starting position');
   // we want to have an up to date, rough idea where the user is:
        var geoPolicy = WL.Device.Geo.Profiles.RoughTracking();
        // RoughTracking policy can re-use old positions (so it may only update once a minute)
        // change our policy to once a second:
        geoPolicy.maximumAge = 1000; 

    // note: to see at high-accuracy, change RoughTracking above to LiveTracking
    // get the user's current position
    WL.Device.Geo.acquirePosition(
            function(pos) {
                // when we receive the position, we display it and starton-going acquisition
                displayPosition(pos);
                triggers = {
                    Geo: {
                        posChange: { // display all movement
                            type: "PositionChange",
                            callback: function(deviceContext) {
                                    displayPosition(deviceContext.Geo);
                                }
                        },

                        leftArea: { // alert when we have left the area
                            type: "Exit",
                            circle: {
                                longitude: pos.coords.longitude,
                                latitude: pos.coords.latitude,
                                radius: 200
                            },
                            callback: function() {
                                window.alert('Left the area');
                            }
                        },

                        dwellArea: { // alert when we have stayed in the vicinity for 3 seconds
                            type: "DwellInside",
                            circle: {
                                longitude: pos.coords.longitude,
                                latitude: pos.coords.latitude,
                                radius: 50
                            },
                            dwellingTime: 3000,
                            callback: function() {
                                window.alert('Still in the vicinity');
                            }
                        }
                    }   
                };

                WL.Device.startAcquisition({ Geo: geoPolicy }, triggers, { Geo: alertOnGeoAcquisitionErr } );               
            },
            function(geoErr) {
                alert("geoErr");
                alertOnGeoAcquisitionErr(geoErr);
                // try again:
                getFirstPositionAndTrack();
            },
            geoPolicy
        ); 
}   

// display the position to the user
function displayPosition(pos) {
    /*alert(pos.coords.longitude);
    alert(pos.coords.latitude);*/
    $('#long').val(pos.coords.longitude);
    $('#lat').val(pos.coords.latitude);
    var mapProp = {
              center:new google.maps.LatLng(pos.coords.latitude,pos.coords.longitude),
              zoom:5,
              mapTypeId:google.maps.MapTypeId.ROADMAP
              };
            var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

function alertOnGeoAcquisitionErr(geoErr) {
    window.alert('Error acquiring geo (' + geoErr.code + '): ' + geoErr.message);
}

}

我还在以下位置添加了权限AndroidManifest.xml：

<meta-data
    android:name="com.google.android.maps.v2.API_KEY"
    android:value="AIzaSyAuYLZwW-9mFrw4mHkf-CLXOWglZBwhbhk"/> 

    <permission
        android:name="com.DemoPoC.permission.MAPS_RECEIVE"
        android:protectionLevel="signature" />

    <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/>
    <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/>
    <uses-permission android:name="com.DemoPoC.permission.MAPS_RECEIVE" />
    <uses-permission android:name="android.permission.INTERNET"/>  
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>  
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>  
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>  
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>


谁能告诉我我做错了什么？

4

1 回答 1

0

有很多小事……首先，您缺少一个？在 maps.googleapis.com/maps/api/js 和 HTML 中的 API 密钥之间。

如果你想在你的位置上有一个标记，你需要在 displayPosition() 中添加它：

var centerMarker = new google.maps.Marker({
    position : new google.maps.LatLng(pos.coords.latitude,
            pos.coords.longitude),
    clickable : false,
    zIndex : 999,
    map : map
});

您可能应该在全局变量中保存地图标记，以便在有更新时移动它们，而不是创建新对象。

getFirstPositionAndTrack 引用 alertOnGeoAcquisitionErr，但该函数未在其范围内定义。

当然你没有提到它，但是 loadLatLong() 需要在 wlCommonInit 期间或之后的某个时间调用

有了它，它似乎工作了。

于 2013-11-19T15:03:16.143 回答