javascript - 传单热图呈现黑色渐变 - 无颜色

Question

我正在使用 leaflet ( http://leafletjs.com/ ) 和 leaflet-heat.js 热图插件 ( https://github.com/Leaflet/Leaflet.heat )。

我已将它们添加到我的项目中，加载 map 、数据，最后在顶部添加热图图层，但最终得到黑点的分布:

var map = new L.map('map', {zoomControl: false, tap: false}).setView(careLatLng, 7);

var baseLayer = 
        L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);

var heat = L.heatLayer(testData).addTo(map);

基本上直接来自此演示:http://leaflet.github.io/Leaflet.heat/demo/

我不明白为什么我的热图呈现为黑色而不是渐变。我想我可能错过了配置中的某些内容，并尝试添加它以确保我定义了颜色:

       var heat = L.heatLayer(testData,{            
        minOpacity: 0.5,
        radius: 20,
        blur: 50, 
        maxZoom: 7,
        max: 4,
        gradient: {0: "#000000",0.2: "#570000",0.4: "#ff0000",0.6: "#ffc800",0.8: "#ffff00",1: "#FFFFFF"}            
    }).addTo(map);

最终渲染如下:

这让我相信配置正在工作，我只是在梯度方面遗漏了一些东西。但正如您在配置中看到的，我设置了渐变颜色，但浏览器仍然将它们呈现为黑色!？

我检查了此条目:Leaflet Heatmap did not produce gradient color它们的值是我用于配置的值，我被难住了。

Answer 1

事实证明，问题是由该组件运行的框架引起的。我在 Lightning 组件中使用了它，在更改了它运行的框架的版本(v42 到 v38)后，我设法获得了预期的颜色:

感谢@NettaB 的帮助!