HTML5 地理位置:获取初始位置和 watchLocation 的逻辑?

Posted

技术标签:

【中文标题】HTML5 地理位置:获取初始位置和 watchLocation 的逻辑?【英文标题】:HTML5 geolocation: logic to get initial position as well as watchLocation? 【发布时间】:2011-06-21 10:02:20 【问题描述】:

我正在使用 html 地理定位,我想实现以下目标:

1. User arrives at page
2. User is asked to share location
3. When user says yes, Google Maps initialises and centres on their position
4. We add marker to map showing their position
5. (ongoing) As the user moves, the marker continues to move with them

我的实现如下:

// Add a marker
function addMarker(loc)  // adds marker 
function setupMap(loc)  // initialise map and centre on user's position ;
setUpMap(???????);
// Start watching user's position
var watchID = navigator.geolocation.watchPosition(addMarker);

所以我的问题是:如何获得初始位置以设置地图?

我可以看到两个选项,它们都有缺陷:

    addMarker 内部调用setUpMap,但是每次用户移动时地图都会重新初始化,这显然是低效的。 在调用watchLocation 之前先调用navigator.geolocation.getCurrentPosition - 但随后用户似乎会收到两次提示他们的位置,这看起来很笨重。

有更好的想法吗?

谢谢大家。

更新

好的,看来我没有很好地解释这一点。我的问题真的是:如何一次性从 watchPosition 获取用户的位置,以便我可以初始化地图一次?

【问题讨论】:

【参考方案1】:

这样称呼:

navigator.geolocation.watchPosition

而不是这个:

navigator.geolocation.getCurrentPosition

watchPosition 函数也会初始化位置。

【讨论】:

我称之为(见问题文本)。我的问题是:如何在 watchPosition 中初始化地图一次,而不是每隔几秒再这样做一次? watchPosition 中的成功函数似乎是定期调用的,这显然不是您在将地图设置为一次性时想要的。 @Richard watchPosition() 不会每秒钟初始化一次。它在位置数据发生变化时进行初始化。 当然,但如果有人在移动设备上,他们可能会四处走动,而您不希望每次发生这种情况时都重新初始化地图。 我注意到初始位置是准确的,然后它移动到不太准确的位置,然后又回到更准确的位置。我想知道初始位置是否是缓存位置。然后它得到一个“关闭”位置(通过一些启发式),然后对其进行改进?【参考方案2】:

3.在第二步调用watchLocation,即获取初始位置(因此用户只会得到一次提示)

【讨论】:

啊,这就是我不明白的 - 我如何从 watchPosition 获取初始位置?我看到我可以从观察位置调用 a 函数,但似乎每次用户移动时都会重新运行该函数,而且我不想每次移动时都重新初始化地图. 有一个布尔标志,例如IsPositionInitialized=假;如果 !IsPositionInitialised 在第一次运行 watchPosition 回调时,初始化地图,否则移动标记并将 IsPositionInitialised 设置为 true。我认为您还应该检查标记是否移出地图边界以重新绘制它。 好的。我曾想过这个,但它似乎有点粗略,但如果这是最好的方法......谢谢!

以上是关于HTML5 地理位置:获取初始位置和 watchLocation 的逻辑?的主要内容,如果未能解决你的问题,请参考以下文章

微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)

微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)

视频完成后如何将html5视频设置为初始位置?

html5获取地理位置和定位

HTML5API之获取地理位置详解

前端获取用户位置信息