本文介绍了热图上的标记不隐藏(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)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-18 04:29