Javascript Google maps api v3在一定的缩放级别上显示标记
我是JS和google地图的新手,但我正在尝试使用自己的分幅创建一个样式化的地图,我想根据缩放级别添加一些标记,因为当我的地图处于minZoom(0)时,标记会水平重复。因此,我正在寻找一种方法来禁用标记的水平重复,或者根据缩放级别切换标记Javascript Google maps api v3在一定的缩放级别上显示标记,javascript,api,google-maps,Javascript,Api,Google Maps,我是JS和google地图的新手,但我正在尝试使用自己的分幅创建一个样式化的地图,我想根据缩放级别添加一些标记,因为当我的地图处于minZoom(0)时,标记会水平重复。因此,我正在寻找一种方法来禁用标记的水平重复,或者根据缩放级别切换标记 var ItalieTypeOptions = { getTileUrl: function (coord, zoom) { var normalizedCoord = getNormalizedCoord(coord, zoom
var ItalieTypeOptions = {
getTileUrl: function (coord, zoom) {
var normalizedCoord = getNormalizedCoord(coord, zoom);
if (!normalizedCoord) {
return null;
}
var bound = Math.pow(2, zoom);
return 'http://mysite.fr/folder' + '/' + zoom + '/' + normalizedCoord.x + '/' + (bound - normalizedCoord.y - 1) + '.png';
},
tileSize: new google.maps.Size(256, 256),
maxZoom: 4,
minZoom: 0,
name: 'Italie'
};
var ItalieMapType = new google.maps.ImageMapType(ItalieTypeOptions);
function initialize() {
var myLatlng = new google.maps.LatLng(0, 0);
var mapOptions = {
center: myLatlng,
zoom: 0,
draggable: true,
zoomControl: true,
scaleControl: false,
mapTypeControl: false,
streetViewControl: false,
backgroundColor: '#6AAECB',
mapTypeControlOptions: {
mapTypeIds: ['Italie']
}
};
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
map.mapTypes.set('Italie', ItalieMapType);
map.setMapTypeId('Italie');
var locations = [
['Lorem', 20, -30],
['Ipsum', 20, 75],
['Dolor', 53, 45]
];
var infowindow = new google.maps.InfoWindow();
var image = {
url: 'img/marker.png',
size: new google.maps.Size(33, 41),
origin: new google.maps.Point(0, 0),
};
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map,
draggable: false,
icon: image,
animation: google.maps.Animation.DROP
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
function getNormalizedCoord(coord, zoom) {
var y = coord.y;
var x = coord.x;
var tileRange = 25 << zoom; // I wrote 25 to display only one image but i'm not ure if it's the right way
if (y < 0 || y >= tileRange) {
return null;
}
if (x < 0 || x >= tileRange) {
x = (x % tileRange + tileRange) % tileRange;
}
return {
x: x,
y: y
};
}
google.maps.event.addDomListener(window, 'load', initialize);
var italiteypeoptions={
getTileUrl:函数(坐标、缩放){
var normalizedCoord=getNormalizedCoord(坐标,缩放);
如果(!normalizedCoord){
返回null;
}
var-bound=Math.pow(2,缩放);
返回'http://mysite.fr/folder'+'/'+zoom+'/'+normalizedCoord.x+'/'++(绑定-normalizedCoord.y-1)+'.png';
},
tileSize:new google.maps.Size(256256),
最大缩放:4,
最小缩放:0,
名称:'意大利'
};
var ItalieMapType=新的google.maps.ImageMapType(ItalieTypeOptions);
函数初始化(){
var mylatng=new google.maps.LatLng(0,0);
变量映射选项={
中心:myLatlng,
缩放:0,
真的,
动物控制:对,
scaleControl:false,
mapTypeControl:false,
街景控制:错误,
背景颜色:“#6AAECB”,
mapTypeControlOptions:{
MapTypeId:['Italie']
}
};
var map=new google.maps.map(document.getElementById('map_canvas'),mapOptions);
map.mapTypes.set('Italie',ItalieMapType);
map.setMapTypeId('Italie');
变量位置=[
[Lorem',20,-30],
[Ipsum',20,75],
['Dolor',53,45]
];
var infowindow=new google.maps.infowindow();
变量图像={
url:'img/marker.png',
尺寸:新谷歌地图尺寸(33,41),
来源:新google.maps.Point(0,0),
};
对于(i=0;i=tilerage){
x=(x%Tilerage+Tilerage)%Tilerage;
}
返回{
x:x,
y:y
};
}
google.maps.event.addDomListener(窗口“加载”,初始化);
谢谢
编辑
因此,我设法根据缩放级别显示一个标记,如下所示:
google.maps.event.addListener(map, 'zoom_changed', function () {
var currentZoom = map.getZoom();
if (currentZoom >= 3 && currentZoom <= 4) {
marker.setMap(map);
alert('lol');
} else if (currentZoom == 0) {
marker.setMap(null);
} else if (currentZoom == 1) {
marker.setMap(null);
} else if (currentZoom == 2) {
marker.setMap(null);
} else if (currentZoom == 4) {
marker.setMap(null);
} else {
marker.setMap(null);
}
});
google.maps.event.addListener(映射'zoom\u changed',函数(){
var currentZoom=map.getZoom();
如果(currentZoom>=3&¤tZoom Location['Dolor',53,45]),我想找到一种方法说“显示Location变量中的所有标记”
谢谢为您的标记创建一个数组,比如:
var allMarkers = [];
然后,当您创建标记时,您可以将它们推入数组中,并简单地通过数组运行到setMap(map),如下所示:
allMarkers.push(标记器);
//当您准备好显示它们时,请执行循环
对于(var i=0;i)(是的,我已经在Stack、google和google maps api文档上搜索了很多次,但我无法禁用水平标记重复),如果有人知道如何让所有标记像这样使用它们:Allmarkers.setMap(map);这将非常有帮助^^
allMarkers.push(marker);
//when you are ready to display them do the loop
for(var i = 0; i <= allMarkers.length-1; i++){
allMarkers[i].setMap(map);
}