[英]How to change the marker position in google javascript maps api v3?
I have this map: 我有这张地图:
.... class Maps ....
Maps.prototype.initialize = function (x, y) {
var latitude = x;
var longitude = y;
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(latitude, longitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
title: 'Click to zoom'
});
};
Maps.prototype.changePosition = function (x, y) {
var latitude = x;
var longitude = y;
var map = new google.maps.LatLng(latitude, longitude);
marker.setPosition(map);
}
....
then: 然后:
var maps = new Maps();
var marker = maps.initialize(x, y);
window.setTimeout(function() {
maps.changePosition(x, y));
}, 3000);
the initialize
method works, and renders the map and the marker initialize
方法起作用,并呈现地图和标记
but the second one doesn't work, doesn't know what setPosition
is 但是第二个不起作用,不知道什么是
setPosition
any ideas on this issue? 关于这个问题有什么想法吗?
There are different issues. 有不同的问题。
the first one, which will prevent the code from executing: your iinitialize-function doesn't have a return-value, so your maps
-variable is undefined and didn't have a method changePosition
. 第一个将阻止代码执行:您的iinitialize-function没有返回值,因此
maps
-variable是未定义的,并且没有方法changePosition
。
Later: the changePosition has to arguments , z
and y
, but inside the function you access the variables x
and y
稍后:changePosition必须具有参数,
z
和y
,但是在函数内部您可以访问变量x
和y
However, I don't see any code that modifies x
and y
, so even when the code would work it doesn't have any visible effect. 但是,我看不到任何修改
x
和y
的代码,因此即使该代码可以工作,也没有任何可见的效果。
function Maps(){}
Maps.prototype.initialize = function (x, y, z, o) {
this.center = new google.maps.LatLng(x, y)
this.zoom = z;
this.node = document.getElementById(o);
this.markers = [];
var mapOptions = {
zoom: this.zoom,
center: this.center,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
this.map = new google.maps.Map(this.node, mapOptions);
return this;
};
Maps.prototype.addMarker=function(x, y, t , c){
var marker = new google.maps.Marker({
position: new google.maps.LatLng(x,y),
map: this.map,
title: t||'Click to zoom'
});
this.markers.push(marker);
if(c)this.map.setCenter(marker.getPosition());
return marker;
}
Maps.prototype.changePosition = function (m , x, y, c, f) {
var latLng = new google.maps.LatLng(x, y);
m.setPosition(latLng);
if(c)this.map.setCenter(latLng);
if(f)f();
}
//create the Maps-instance
var maps = new Maps(),
x = 10,
y = 10;
//do something onload
google.maps.event.addDomListener(window,'load',function(){
//initialize maps
maps.initialize(x, y , 3, 'map_canvas');
//add a marker
var marker=maps.addMarker(x, y ,'hello marker', true);
//change position of marker
window.setTimeout(function() {
maps.changePosition(marker, x+50, y+50 ,true,
function(){alert('position changed');});
}, 5000);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.