我正在使用 Sencha Touch 为波士顿大学开发移动版本的 Bus Tracker。我遇到的问题是 google.maps.Marker 的方法 setPosition() 没有在 Safari 或任何移动浏览器中呈现位置变化。
设置的代码如下：
- 我初始化一个空标记数组
- 我使用 Ext.Map() 初始化地图（sencha 调用）
- 我每隔 5 秒使用一次 JSONP 请求加载数据
- 每次我获得新数据时，我都会检查我的标记数组中是否有该总线 ID 的标记
- 如果我不创建一个新标记并将其推入我的标记数组
- 否则，我用我的标记数组中该标记上的新位置调用 setPosition。
- 然后我运行检查以确保标记的位置已更新为从我的 JSON 请求接收到的位置
我已经验证（我认为）标记数组中的标记每次都获得新位置。此外，在 Chrome 和 Firefox 中，我的公共汽车移动（如预期的那样），但在 safari 和 iPhone/Android 浏览器中，没有任何移动。
这是代码片段：
var markers = {};
var busesFunc = function()
{
Ext.util.JSONP.request({
url: 'http://m.cms-devl.bu.edu/rpc/bus/livebus.json.php',
callbackKey: 'callback',
params: {
},
callback: function(data) {
buses = data.ResultSet.Result;
for (var i = 0, ln = buses.length; i < ln; i++) {
var bus = buses[i];
var position = new google.maps.LatLng(bus.lat, bus.lng);
if(!markers[bus.id])
{
markers[bus.id] = new google.maps.Marker({
map: map.map,
title: 'hello',
clickable: true,
draggable: false,
position: position,
icon: "images/bg.png",
zIndex: 100
});
}
markers[bus.id].setPosition(position);
//markers[bus.id].setIcon("images/bg.png");
//markers[bus.id].setMap(map.map);
//markers[bus.id].setMap(map.map);
if(bus.lat != markers[bus.id].position.lat() || bus.lng != markers[bus.id].position.lng())
{
console.log(bus.id + " " + bus.lat + " " + bus.lng);
console.log(bus.id + " " + markers[bus.id].position.lat() + " " + markers[bus.id].position.lng());
}
}
}
});
}
setInterval(busesFunc, 5000);
您可以在此处查看示例：http ://www.bu.edu/nisdev/students/luiscarr/liveBusMobile/
整个javascript被称为functions.js（我不能发布多个链接）