1

我已经尝试了几个小时，也提到了这个论坛上的一个帖子，但失败了。我有大量的标记，地图上最多有 1000 个标记。当我尝试移动地图的位置时，它会减慢我的地图速度。所以我需要设置要在地图上显示的标记间隔。当有超过 300 个标记时，假设间隔为 10。我怎样才能做到这一点？下面是我的代码：

var trace_markers= [];
var pins = [];
var pin;
function Trace_Pin(Lat, Long, immat, type, site, vitesse, date){    
 pin = {
    latitude: document.getElementById('Lat'),
    longitude: document.getElementById('Long'),
    immat: document.getElementById('immat'),
    date: document.getElementById('date'),
    type: document.getElementById('type'),
    site: document.getElementById('site'),
    speed: document.getElementById('vitesse')
};
pins.push(pin);
ListPin();}

function ListPin()
{ 
var image_trace = new google.maps.MarkerImage('http://maps.google.com/mapfiles/kml/pal3/icon61.png',
    new google.maps.Size(32, 32),
    new google.maps.Point(0,0),
    new google.maps.Point(16, 16));


if (pins.length > 200){
for ( var i=0; i< pins.length ;i+10){   
  var vehlatlng = new google.maps.LatLng(pins[i].latitude, pins[i].longitude) ;
  var trace_marker = new google.maps.Marker({
     map: map,
     position: vehlatlng,
     icon: image_trace  });
  trace_marker.tooltip_html = '<div class="tooltip">' + 'Date : ' + pins[i].date + '<br>' + 'Vitesse : ' + pins[i].vitesse + ' km/h' + '<br>' + '<\/div>';   
  trace_markers.push(trace_marker);
  trace_marker.setMap(map);
  Liste_Points.push(trace_marker.getPosition());
  TraceBounds.extend(trace_marker.position); }


   }
   if (pins.length < 200){
   for ( var i=0;i< pins.length ;i++){  
  var vehlatlng = new google.maps.LatLng(pins[i].latitude, pins[i].longitude) ;
  var trace_marker = new google.maps.Marker({
     map: map,
     position: vehlatlng,
     icon: image_trace  });
  trace_marker.tooltip_html = '<div class="tooltip">' + 'Date : ' + pins[i].date + '<br>' + 'Vitesse : ' + pins[i].vitesse + ' km/h' + '<br>' + '<\/div>';   
  trace_markers.push(trace_marker);
  trace_marker.setMap(map);
  Liste_Points.push(trace_marker.getPosition());
  TraceBounds.extend(trace_marker.position); }
   }
  // Evenement MouseOver 
  //-----------------------------------------------------
   google.maps.event.addListener(map, 'mouseover', function() {
        showTooltip(trace_marker);
        });
   }
// ------------------------------------------------------------------------------------
//**************************************************************************************
//                          On joint les points du parcours
//**************************************************************************************
// ------------------------------------------------------------------------------------
function Trace_Route() {
   if (route) { route.setMap(null); }
   if (Liste_Points.length > 1) {
        route = new google.maps.Polyline({
                path: Liste_Points,
                strokeColor: "#FF0000",
                strokeOpacity: 1.0,
                strokeWeight: 2});
        route.setMap(map);
    }
}
4

1 回答 1

0

创建一个数组，其中包含所有标记（其中 300 个）。让我们假设它被称为

allMarkersArray[]

创建标记时，您不会设置地图，而是将其保留为空，因此它不会显示在地图上。当你想显示标记时，你会做一些数学运算。假设您只想显示标记的 1/30（300 个中的 10 个）。您创建另一个数组

shownMarketsArray[]

您放置要显示的标记的位置，当您将它们放在那里时，您设置了地图

marker.setMap(map)

现在，哪些标记将被显示，哪些标记将保持隐藏的标准由您决定。如果你想要 1/30 的标记只有一个 for 循环

for(var i = 0; i < allMarketsArray.length/30; i++)

不过，您应该采取一些预防措施（即数组太小而您想显示所有这些）。

更新

if (pins.length > 200){
for ( var i=0; i< pins.length ;i+10){   
  var vehlatlng = new google.maps.LatLng(pins[i].lat, pins[i].long) ;
  var trace_marker = new google.maps.Marker({
     map: map,
     position: vehlatlng,
     icon: image_trace  });
  trace_marker.tooltip_html = '<div class="tooltip">' + 'Date : ' + pins[i].date + '<br>' + 'Vitesse : ' + pins[i].vitesse + ' km/h' + '<br>' + '<\/div>';     
  trace_markers.push(trace_marker);
  trace_marker[i].setMap(map);
  Liste_Points.push(trace_marker.getPosition());
  TraceBounds.extend(trace_marker.position); }


   }
   if (pins.length < 200){
   for ( var i=0;i< pins.length ;i++){  
  var vehlatlng = new google.maps.LatLng(pins[i].lat, pins[i].long) ;
  var trace_marker = new google.maps.Marker({
     map: map,
     position: vehlatlng,
     icon: image_trace  });
  trace_marker.tooltip_html = '<div class="tooltip">' + 'Date : ' + pins[i].date + '<br>' + 'Vitesse : ' + pins[i].vitesse + ' km/h' + '<br>' + '<\/div>';     
  trace_markers.push(trace_marker);
  trace_marker[i].setMap(map);
  Liste_Points.push(trace_marker.getPosition());
  TraceBounds.extend(trace_marker.position); }
   }
于 2013-06-10T11:34:18.240 回答