Question

我已经尝试了几个小时，并且在这个论坛中也提到了一个帖子但是失败了。我有大量标记，地图上最多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);
    }
}

Answer 1

创建一个数组，其中包含所有标记（其中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); }
   }

Google Maps V3-以间隔放置标记和折线

1 个答案: