设置中心错误谷歌地图V3
setCenter error Google maps V3
我在从谷歌地图API v2迁移到v3时遇到问题。
我可以显示地图,但是当我尝试根据数据库提供的搜索结果显示标记时,地图停止工作。我收到错误"无法调用方法集中心"
有人可以帮忙吗?谢谢。
原文:
<script type="text/javascript">
var points =new Array();
var pointtexts =new Array();
var pointflags =new Array();
var map, bounds;
var baseIcon = new GIcon();
baseIcon.shadow = "flag_shadow_small.png";
baseIcon.iconSize = new GSize(11, 25);
baseIcon.shadowSize = new GSize(13, 27);
baseIcon.iconAnchor = new GPoint(5, 12);
baseIcon.infoWindowAnchor = new GPoint(11, 2);
baseIcon.infoShadowAnchor = new GPoint(11, 2);
function createMarker(point, detail, paidFlag) {
var markIcon = new GIcon(baseIcon);
if (paidFlag) {
markIcon.image = "flag_blue_small.png";
}
else {
markIcon.image = "flag_black_small.png";
}
var marker = new GMarker(point, {icon:markIcon});
GEvent.addListener(marker,"click", function() {
map.openInfoWindowHtml(point, detail+"<br/>");
});
bounds.extend(point);
return marker;
}
function showAddress(point, propdetail, paidFlag) {
if (!point) {
alert(point + " not found");
} else {
var pointarray = point.split(",");
var latlng = new GLatLng(pointarray[0],pointarray[1]);
map.addOverlay(createMarker(latlng, propdetail, paidFlag));
recentre(points.length);
}
}
function recentre(items) {
var zlevel, newCentre, place;
place = items + 1;
if (items==1){
zlevel=10;
}
else{
zlevel=map.getBoundsZoomLevel(bounds);
}
newCentre = bounds.getCenter();
map.setCenter(newCentre,zlevel);
map.savePosition();
}
// Call this function when the page has been loaded
function initialize() {
if (GBrowserIsCompatible()) {
bounds = new GLatLngBounds();
map = new GMap2(document.getElementById("google_div"));
map.addControl(new GLargeMapControl());
map.addControl(new GOverviewMapControl());
map.addControl(new GMapTypeControl());
map.enableDoubleClickZoom();
map.setCenter(new GLatLng(56.866991,-4.185791), 6);
for (var singlepoint in points) {
showAddress(points[singlepoint], pointtexts[singlepoint], pointflags[singlepoint]);
}
}
}
我的修改:
<script type="text/javascript">
var points =new Array();
var pointtexts =new Array();
var pointflags =new Array();
var map, bounds;
var baseIcon = new google.maps.MarkerImage();
baseIcon.shadow = "flag_shadow_small.png";
baseIcon.iconSize = new google.maps.Size(11, 25);
baseIcon.shadowSize = new google.maps.Size(13, 27);
baseIcon.iconAnchor = new google.maps.Point(5, 12);
baseIcon.infoWindowAnchor = new google.maps.Point(11, 2);
baseIcon.infoShadowAnchor = new google.maps.Point(11, 2);
function createMarker(point, detail, paidFlag) {
var markIcon = new google.maps.MarkerImage(baseIcon);
if (paidFlag) {
markIcon.image = "flag_blue_small.png";
}
else {
markIcon.image = "flag_black_small.png";
}
var marker = new google.maps.Marker(point, {icon:markIcon});
google.maps.event.addListener(marker,"click", function() {
map.openInfoWindowHtml(point, detail+"<br/>");
});
bounds.extend(point);
return marker;
}
function showAddress(point, propdetail, paidFlag) {
if (!point) {
alert(point + " not found");
} else {
var pointarray = point.split(",");
var latlng = new google.maps.LatLng(pointarray[0],pointarray[1]);
/*map.addOverlay(createMarker(latlng, propdetail, paidFlag));*/
/*createMarker.setMap(latlng, propdetail, paidFlag);*/
overlay = new createMarker(latlng, propdetail, paidFlag);
recentre(points.length);
}
}
function recentre(items) {
var zlevel, newCentre, place;
place = items + 1;
if (items==1){
zlevel=10;
}
else{
/*zlevel=map.getBoundsZoomLevel(bounds);*/
zlevel=new google.maps.LatLngBounds();
}
newCentre = bounds.getCenter();
/*map.setCenter(newCentre,zlevel);*/
map.setCenter(newCentre,zlevel);
map.savePosition();
}
function initialize() {
bounds = new google.maps.LatLngBounds();
var mapOptions = {
zoom: 6,
center: new google.maps.LatLng(56.866991,-4.185791),
panControl: true,
zoomControl: true,
scaleControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
for (var singlepoint in points) {
showAddress(points[singlepoint], pointtexts[singlepoint], pointflags[singlepoint]);
}
var map = new google.maps.Map(document.getElementById('google_div'),mapOptions);
setMarkers(map, point, detail, paidFlag);
}
google.maps.event.addDomListener(window, 'load', initialize);
谢谢。
API v3 中地图类上的 setCenter 函数只接受一个参数,即 LatLng 对象来居中。 您正在传入两个参数,因此出现错误:
map.setCenter(newCentre,zlevel);
您可能只想执行以下操作:
map.setCenter(newCentre);
在函数中重新中心映射是未定义的,因为在函数初始化中你重新声明了映射更改此内容:
var map = new google.maps.Map(document.getElementById('google_div'),mapOptions);
在
map = new google.maps.Map(document.getElementById('google_div'),mapOptions);
函数createMarker
实例化超出范围并在调用 createMarker 后在功能块中本地销毁的 GMarker 实例。
当你使用对象文字实例化 GMarker 时,你需要在调用 GMarker 的构造函数原型时构造 GIcon。
这适用于版本 2。
这是工作代码:
<script type="text/javascript">
var points =new Array();
var pointtexts =new Array();
var pointflags =new Array();
var map, bounds;
function createMarker(point, detail, paidFlag) {
var flagURL;
if (paidFlag) {
flagURL = 'flag_blue_small.png';
}
else {
flagURL = 'flag_black_small.png';
}
var infowindow = new google.maps.InfoWindow({
content: detail
});
var image = {
url: flagURL,
size: new google.maps.Size(11, 25),
origin: new google.maps.Point(0,0),
anchor: new google.maps.Point(11, 25)
};
var marker = new google.maps.Marker({
position: point,
map: map,
icon: image,
shadow: 'flag_shadow_small.png',
title:''
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
bounds.extend(point);
marker.setMap(map);
}
function showAddress(point, propdetail, paidFlag) {
if (!point) {
alert(point + " not found");
} else {
var pointarray = point.split(",");
var latlng = new google.maps.LatLng(pointarray[0],pointarray[1]);
createMarker(latlng, propdetail, paidFlag);
recentre(points.length);
}
}
function recentre(items) {
var zlevel, newCentre, place;
place = items + 1;
if (items==1){
zlevel=10;
map.setZoom(zlevel);
}
else{
//map.panToBounds(bounds);
map.fitBounds(bounds);
}
newCentre = bounds.getCenter();
map.setCenter(newCentre);
//map.setZoom(zlevel);
}
function initialize() {
bounds = new google.maps.LatLngBounds();
var mapOptions = {
zoom: 7,
center: new google.maps.LatLng(56.866991,-4.185791),
panControl: true,
zoomControl: true,
scaleControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('google_div'),mapOptions);
for (var singlepoint in points) {
showAddress(points[singlepoint], pointtexts[singlepoint], pointflags[singlepoint]);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
相关文章:
- 谷歌地图API v3不适用于移动浏览器或PhoneGap
- 标记的实时更新,无需加载页面谷歌地图API V3
- 谷歌地图v3标记没有显示ie8和9
- 谷歌地图停止显示点v3
- 覆盖在赢得'不允许点击下面的标记,谷歌地图api v3
- 如何在多承诺链中处理谷歌地图API V3事件
- 谷歌地图API v3:Initial View is Fine,but Gray Box with No Map if
- 使用谷歌地图api v3自动完成字段(法国大道、邮编、城市)
- 谷歌地图v3:当函数'失败'呼叫
- 谷歌地图V3
- 谷歌地图V3-我无法调和关闭
- 如何在谷歌地图api v3中获得无公里驾驶距离
- 谷歌地图API v3:处理使用限制限制
- 在谷歌地图V3上选择多边形
- markrimage在谷歌地图api v3中的特定位置后消失
- 谷歌地图API JS V3包含但不起作用
- 谷歌地图v3侦听器(单击)-更改URL
- 如何限制谷歌地图API V3半径搜索仅限于圆圈内的标记
- 将 v2 更新到 v3 谷歌地图 API 未加载
- Javascript v3谷歌地图旋转地图