小册子地图相对于dc.js图表​​中的选择进行更改

时间:2018-05-05 13:03:58

标签: leaflet underscore.js dc.js

我想使用传单实现地图叠加。在下面的代码中,mainmap是baselayer; heat和markLayer是两个热图。我想只链接' heat'层到我的dc.js图表​​。两个覆盖层成功地工作,但是“热量”#图层中的选择不会改变图层。

我无法弄清楚我错在哪里。我的问题是我无法将dcCharts(dc图表数组)与传单地图热图链接起来。即使在选择之后,地图上的可视化也保持不变。

`var mainmap;
  var heat;
  mapLink = '<a href="http://openstreetmap.org">OpenStreetMap</a>';
  mainmap = L.tileLayer(
      'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: '&copy; ' + mapLink + ' Contributors',
        maxZoom: 15,
      });

    //1st HeatMap
  var geoData = [];
  _.each(allDim.top(Infinity), function(d) {
      geoData.push([d["lat"], d["long"], 1]);
        });
   heat = L.heatLayer(geoData,{
      radius: 10,
      blur: 20, 
      maxZoom: 1,
    });

   //2nd HeatMap
    var geoDataa =[];
    _.each(allDimm.top(Infinity), function(d){

      geoDataa.push([d["lat"], d["long"], 1]);
    });


  var markerLayer = L.heatLayer(geoDataa, {
    radius: 10,
      blur: 20, 
      maxZoom: 1,
});



  map = L.map('map',{
  layers: [mainmap, heat, markerLayer]
});
  map.setView([22.97, 100.65], 4);

  var baseMaps = {
    "BaseMap": mainmap
    };

var overlayMaps = {
    "heat": heat,
    "markerLayer": markerLayer 
};


 mainmap.addTo(map);

 function drawMap()
  {
    heat.addTo(map);
    mainmap.addTo(map);
  }   
  L.control.layers(baseMaps, overlayMaps).addTo(map);
  drawMap();

  //Update the heatmap if any dc chart get filtered

  _.each(dcCharts, function (dcChart) {
    dcChart.on("filtered", function (chart, filter) {
        map.eachLayer(function (layer) {
          map.removeLayer(layer)
        }); 
        console.log("Yes, I am called");
    drawMap();
    });
  dc.renderAll();

}); `

0 个答案:

没有答案