热图上的标记不隐藏（JS） [英] Markers on heatmap is not hiding (JS)

问题描述

我有JS代码来过滤地图上的标记

这是它

 <$ $（'＃start'）。$（$＃$）$ endValue = $（'＃endDate'）。val（）; 
 
 map.markers = []; 
 map.markers.push（marker）; 
 // console。 log（map.markers）; 
 $ .each（map.markers，function（i，marker）{
 console.log（marker）; 
 if（marker.date === startValue ）
 marker.setMap（null）; 
 
 
}）; 
}）; 
  

但标记不会隐藏。

是控制台日志的屏幕

code> startValue 是

据我了解，它不会隐藏，因为数组中的值和输入的值是不同的？

我该如何解决它？

UPDATE

在@scaisEdge答案后，我编辑了这样的代码

$（'＃c'c）$（'＃filter'）。on（'click'，
function（）{
var startValue = $（'＃startDate '）.val（）;
var endValue = $（'＃endDate'）。val（）;
var myDate = new Date（startVa lue）;
map.markers = [];
map.markers.push（marker）;
//console.log（map.markers）;
$ .each（map.markers，function（i，marker）{
console.log（marker）;
if（marker.date === myDate）
marker。 setMap（null）;
}）;

}）;

但标记仍然可见。

这里是所有脚本的小提琴

jsfiddle.net/nemesises666/pj6wa52h/3

解决方案日期实例（如 new Date（））是对象。两个对象不相等，除非它们是相同的对象。

您可以尝试：

  var getDate = marker.date.match（/ \d / g）.join（''）; //1508341846000
 var markerDate = new Date（parseFloat（getDate））; 
 var valDate = new Date（startValue）; 
 if（markerDate.getTime（）=== valDate.getTime（））{
 marker.setMap（null）; 
} else {
 console.log（'marker date is'，markerDate.getTime（），'valdate is'，valDate.getTime（））; 
} 
  

比较数字与数字

编辑：添加了其他条件以检查日期时间不同的原因。

EDIT2 ：我可以看到现在您的标记不是 google.maps.Marker 个实例，而是 google.maps.visualization.WeightedLocation 没有setMap方法。 Heatmaps可以整体更新其数据，而不是关闭特定的数据点。

您的循环应该像

  var auxMarkers = []; 
 
 $ .each（map.markers，function（i，datapoint）{
 if（datapoint应该保存在热图中）{
 auxMarkers.push（datapoint）; 
} 
}）; 
 
 Heatmap.setData（auxMarkers）; 
  

I have JS code to filter markers on map

Here is it

 $('#filter').on('click',
   function () {
       var startValue = $('#startDate').val();
       var endValue = $('#endDate').val();

       map.markers = [];
       map.markers.push(marker);
       //console.log(map.markers);
       $.each(map.markers, function (i, marker) {
           console.log(marker);
           if (marker.date === startValue)
               marker.setMap(null);


       });
   });

But markers not hiding.

Here is screen of console log

value of startValue is

As I understood it not hiding because of value in array and value from input is different?

How I can fix it?

UPDATE

After @scaisEdge answer I edited code like this

 $('#filter').on('click',
   function () {
       var startValue = $('#startDate').val();
       var endValue = $('#endDate').val();
       var myDate = new Date(startValue);
       map.markers = [];
       map.markers.push(marker);
       //console.log(map.markers);
       $.each(map.markers, function (i, marker) {
           console.log(marker);
           if (marker.date === myDate)
               marker.setMap(null);
       });

   });

But markers are still visible.

Here is fiddle of all script

jsfiddle.net/nemesises666/pj6wa52h/3

解决方案

Date instances (as in new Date()) are objects. Two objects are not equal unless they are the same object.

You could try:

       var getDate = marker.date.match(/\d/g).join(''); // "1508341846000"
       var markerDate = new Date( parseFloat( getDate ) );
       var valDate = new Date(startValue);
       if ( markerDate.getTime() === valDate.getTime() ) {
           marker.setMap(null);
       } else {
          console.log('marker date is',markerDate.getTime(),'valdate is',valDate.getTime());
       }

To compare number vs number

EDIT: added an else condition to check why dates time differs

EDIT2: I can see now that your markers are not google.maps.Marker instances but instead google.maps.visualization.WeightedLocation objects which don't have a "setMap" method. Heatmaps can update their data as a whole, not by turning off a particular datapoint.

You loop should be something like

var auxMarkers=[];

$.each(map.markers, function (i, datapoint) {
      if (datapoint should be kept in the heatmap) {
         auxMarkers.push(datapoint);
      }
});

Heatmap.setData(auxMarkers);

这篇关于热图上的标记不隐藏（JS）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！