Javascript 热图本地问题

Question

我在使用 heatmap.js 时遇到了一些代码问题。我需要使用渲染鼠标移动热图，然后将其保存到 csv。 Chrome 错误现在在将 heatmap 更改为 .heatmap 后消失，但仍然没有渲染。 Div 现在有其固定大小。

window.onload = function(){
    var heatmapInstance = h337.create({
        container: document.querySelector('.heatmap'),
        radius: 90
      });
      document.querySelector('.heatmap').onmousemove = function(ev) {
        heatmapInstance.addData({
          x: ev.layerX,
          y: ev.layerY,
          value: 1
        });
      };
}

<script src="heatMapJs/build/heatmap.min.js"></script>

<script src="js/heatMap.js"></script>





<div class="heatmap"> </div>

Answer 1

以下代码片段似乎有效

window.onload = function(){
  var heatmapInstance = h337.create({
    container: document.querySelector('.heatmap'),
    radius: 90
  });
  
  document.querySelector('.heatmap').onmousemove = function(ev) {
    heatmapInstance.addData({
      x: ev.layerX,
      y: ev.layerY,
      value: 1
    });
  };
}

.heatmap {
  width: 100vw;
  height: 100vh;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/heatmap.js/2.0.0/heatmap.min.js"></script>

<div class="heatmap"></div>

Javascript 热图本地问题

Javascript heatmap local issue

javascript

frameworks

web