同一地址的Google标记未显示所有标记。如何显示所有？ [英] Google markers at same address not showing all markers. How to show all?
本文介绍了同一地址的Google标记未显示所有标记。如何显示所有？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一张地图，显示多达30,000个标记，所有标记都是在用户查询时从商店数据库表中加载的。但通常它会显示多达1000个标记。
问题：
数据库中的纬度和经度是重复的，这是必需的。当这些在地图上绘制时，它们彼此重叠。导致用户无法看到所有标记，用户需要点击这些标记以显示更多信息等。
问题：
可以在地图上显示那些隐藏的标记吗？
谢谢。
我尝试了什么：
var map;
// marker clusterer
var mc;
var mcOptions = {gridSize： 20 ，maxZoom： 17 };
// global infowindow
var infowindow = new google.maps.InfoWindow（）;
// 地理编码器
var geocoder = new google.maps.Geocoder（）;
var address = new 数组（ 1000 Market St，Philadelphia，PA， 1000 Market St，Philadelphia，PA， 1002 Market St，Philadelphia，PA， 1004 Market St，Philadelphia ，PA）;
var content = new 数组（ 1， < span class =code-string> 2， 3， 4）;
var min =。 999999 ;
var max = 1 。 000001 ;
function createMarker（latlng，text）{
// /获取当前在群集中的标记数组
var allMarkers = mc.getMarkers （）;
// 标记的最终位置，如果另一个标记已存在于同一位置，则可以更新
var finalLatLng = latlng;
// 检查是否有任何现有标记与新标记的latlng匹配
if （allMarkers.length！= 0 ）{
for （i = 0 ; i< allMarkers.length; i ++）{
var existingMarker = allMarkers [i];
var pos = existingMarker.getPosition（）;
// 如果标记已存在于与此标记相同的位置
if （latlng.equals（pos））{
// 通过在坐标上应用小型多重符来更新重合标记的位置
var newLat = latlng.lat（）*（ Math .random（）*（max - min）+ min）;
var newLng = latlng.lng（）*（ Math .random（）*（max - min）+ min）;
finalLatLng = new google.maps.LatLng（newLat，newLng）;
}
}
}
var marker = new google.maps.Marker（{
position：finalLatLng
}）;
google.maps.event.addListener（marker，' click'， function （）{
infowindow.close（）;
infowindow.setContent（text）;
infowindow.open（map，marker ）;
}）;
return 标记;
}
function geocodeAddress（address，i）{
geocoder.geocode（{' address'：address}， function （结果，状态）{
if （status == google.maps.GeocoderStatus.OK）{
var marker = createMarker（results [ 0 ]。geometry。 location ，content [i]）;
mc.addMarker（marker）;
} else {
alert（ 由于以下原因，地理编码未成功： + status）;
}
}）;
}
function initialize（）{
var options = {
zoom： 13 ，
center： new google.maps.LatLng（ 39 。 96225 ， - 75. 13222 ），
mapTypeId：google.maps.MapTypeId.ROADMAP
};
map = new google.maps。地图（ document .getElementById（' map'），options）;
// marker cluster
mc = new MarkerClusterer（map，[]，mcOptions）;
for （i = 0 ; i< address.length;>
geocodeAddress（address [i]，i）;
}
}
解决方案
< blockquote>通过在每个标记上添加数字。
for （ var i = 0 ; i< filtered.length; i ++）{
var item = records [filtered [i]];
chosenRecords + = ， + item.lat;
chosenRecords1 + = ， + item.lng;
dup = item.cnt;
recordCont + = item.cnt;
if （filtered.length< = 30000 ）{
if （dup == 1 ）{
dup = ' ';
}
var img;
if （dup> 5 ）{
img = http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + < span class =code-string>' | a15ecb | FFFFFF';
}
else {
img =（（item.status == RES）？' http：// chart.apis.google.com/chart?chst=d_map_pin_letter&chld =' + dup + ' | 6abf24 | FFFFFF' :( item.status == NON）？' http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + ' | 0061e2 | FFFFFF' :( item.status == OCP）？' http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + ' | e27500 | FFFFFF' :( item.status == DEC）？ ' http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + ' | eed100 | FFFFFF' :( item.status == ???）？ ' http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + ' | FF0000 | FFFFFF'：' http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + ' | FF0000 | FFFFFF'）;
}
var Mrkr_txt = item.status;
if （dup> 1 ）{
Mrkr_txt = 多个属性'
}
// var lb =''+ dup +''
var marker = new google.maps.Marker（{
position： new google.maps.LatLng（item.lat， item.lng），
// icon：（（item.status ==RES）？markerIcon1 ：（item.status ==NON）？markerIcon2：（item.status ==OCP）？markerIcon3：（item.status ==DEC）？markerIcon4：（item.status ==??? ）？markerIcon5：markerIcon5），
// label：lb，
icon：img，
title：Mrkr_txt，
map：map，
}）;
}）;
Hi,
I have a map that shows up to 30,000 markers, all loaded from the store database table upon user query. but normaly it shows upto 1000 markers.
Problem:
Some latitude and longitude in database are duplicate, which are needed. when these are plotted on the map they overlapping each other. Resulting the user cant see all the markers, these need to be clicked by the user to show more info and etc.
Question:
Is is possible to show on the map, those hidden markers?
Thanks.
What I have tried:
var map;
//marker clusterer
var mc;
var mcOptions = {gridSize: 20, maxZoom: 17};
//global infowindow
var infowindow = new google.maps.InfoWindow();
//geocoder
var geocoder = new google.maps.Geocoder();
var address = new Array("1000 Market St, Philadelphia, PA","1000 Market St, Philadelphia, PA","1002 Market St, Philadelphia, PA","1004 Market St, Philadelphia, PA");
var content = new Array("1","2","3","4");
var min = .999999;
var max = 1.000001;
function createMarker(latlng,text) {
///get array of markers currently in cluster
var allMarkers = mc.getMarkers();
//final position for marker, could be updated if another marker already exists in same position
var finalLatLng = latlng;
//check to see if any of the existing markers match the latlng of the new marker
if (allMarkers.length != 0) {
for (i=0; i < allMarkers.length; i++) {
var existingMarker = allMarkers[i];
var pos = existingMarker.getPosition();
//if a marker already exists in the same position as this marker
if (latlng.equals(pos)) {
//update the position of the coincident marker by applying a small multipler to its coordinates
var newLat = latlng.lat() * (Math.random() * (max - min) + min);
var newLng = latlng.lng() * (Math.random() * (max - min) + min);
finalLatLng = new google.maps.LatLng(newLat,newLng);
}
}
}
var marker = new google.maps.Marker({
position: finalLatLng
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.close();
infowindow.setContent(text);
infowindow.open(map,marker);
});
return marker;
}
function geocodeAddress(address,i) {
geocoder.geocode( {'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var marker = createMarker(results[0].geometry.location,content[i]);
mc.addMarker(marker);
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
function initialize(){
var options = {
zoom: 13,
center: new google.maps.LatLng(39.96225,-75.13222),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map'), options);
//marker cluster
mc = new MarkerClusterer(map, [], mcOptions);
for (i=0; i<address.length;>
geocodeAddress(address[i],i);
}
} 解决方案
By add number on each marker.
for (var i = 0; i < filtered.length; i++) { var item = records[filtered[i]]; chosenRecords += "," + item.lat ; chosenRecords1 += "," + item.lng; dup = item.cnt; recordCont += item.cnt; if (filtered.length <= 30000) { if (dup == 1) { dup = ''; } var img; if (dup > 5) { img = 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|a15ecb|FFFFFF'; } else { img = ((item.status == "RES") ? 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|6abf24|FFFFFF' : (item.status == "NON") ? 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|0061e2|FFFFFF' : (item.status == "OCP") ? 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|e27500|FFFFFF' : (item.status == "DEC") ? 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|eed100|FFFFFF' : (item.status == "???") ? 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|FF0000|FFFFFF' : 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=' + dup + '|FF0000|FFFFFF'); } var Mrkr_txt = item.status; if (dup > 1) { Mrkr_txt = 'Multiple Properties' } // var lb = ''+dup+'' var marker = new google.maps.Marker({ position: new google.maps.LatLng(item.lat, item.lng), // icon: ((item.status == "RES") ? markerIcon1 : (item.status == "NON") ? markerIcon2 : (item.status == "OCP") ? markerIcon3 : (item.status == "DEC") ? markerIcon4 : (item.status == "???") ? markerIcon5 : markerIcon5), //label: lb, icon: img, title: Mrkr_txt, map: map, }); });
这篇关于同一地址的Google标记未显示所有标记。如何显示所有？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
