【发布时间】:2017-11-02 07:39:16
【问题描述】:
我正在加载我的地图以及从 FusionTable 中提取的标记。如果他们接受请求,我现在尝试将地图围绕用户位置居中。
在加载页面时,浏览器要求访问我的位置,我同意,但地图没有以我的位置为中心。我也有搜索地址功能,但不认为这会影响事情。
我的代码:
function initMap() {
var coords = new google.maps.MVCObject();
coords.set('latlng', new google.maps.LatLng(51.525, -0.1));
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success);
}
//set new value for coords
function success(position) {
coords.set('latlng',
new google.maps.LatLng(position.coords.latitude,
position.coords.longitude));
}
var defaultZoom = 13;
var tableId = '#############';
var locationColumn = 'Location';
var geocoder = new google.maps.Geocoder();
var styles = [
...
];
var map = new google.maps.Map(document.getElementById('map'), {
center: coords.get('latlng'),
zoom: defaultZoom,
styles: styles
});
var layer = new google.maps.FusionTablesLayer({
query: {
select: locationColumn,
from: tableId
},
options: {
styleId: 2,
templateId: 2
},
map: map
});
var zoomToAddress = function() {
var address = document.getElementById('address').value;
geocoder.geocode({
address: address
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
map.setZoom(16);
// OPTIONAL: run spatial query to find results within bounds.
var sw = map.getBounds().getSouthWest();
var ne = map.getBounds().getNorthEast();
var where = 'ST_INTERSECTS(' + locationColumn +
', RECTANGLE(LATLNG' + sw + ', LATLNG' + ne + '))';
layer.setOptions({
query: {
select: locationColumn,
from: tableId,
where: where
}
});
} else {
window.alert('Address could not be geocoded: ' + status);
}
});
};
google.maps.event.addDomListener(document.getElementById('search'),
'click', zoomToAddress);
google.maps.event.addDomListener(window, 'keypress', function(e) {
if (e.keyCode == 13) {
zoomToAddress();
}
});
google.maps.event.addDomListener(document.getElementById('reset'),
'click', function() {
map.setCenter(defaultCenter);
map.setZoom(defaultZoom);
layer.setOptions({
query: {
select: locationColumn,
from: tableId
}
});
});
}
google.maps.event.addDomListener(window, 'load', initialize);
【问题讨论】:
-
有没有机会为 jsfiddle 提供虚拟数据?
-
嗨@John 虚拟数据来自哪里?
-
只是来自 FusionTable 的数据,我们可以从那里看到地图的工作和调试
-
您可以在这里查看表格fusiontables.google.com/… 我认为 fusiontable 不是问题。我能够很好地加载地图上的所有标记。我只是无法让地图专注于用户当前的位置。
标签: javascript google-maps google-maps-api-3 google-fusion-tables