Question

使用谷歌地图javascript api，我想为每个叠加创建两个具有不同颜色渐变的热图叠加。到目前为止，我已经能够创建两个叠加层，但是当我尝试为每个叠加层应用不同的渐变时，没有输出。

以下是代码：

  var map, heatmap, heatmap2;
  function initMap() {
    map = new google.maps.Map(document.getElementById('map'), {
        zoom: 11,
        center: {lat: 47.608013, lng: -122.335167},
        mapTypeId:'hybrid'
    });
    heatmap = new google.maps.visualization.HeatmapLayer({
        data: getPoints(),
        map: map
        gradient: getGrad()
    });
    heatmap2 = new google.maps.visualization.HeatmapLayer({
        data:   getPoints1(),
        map:    map
        gradient: getGrad1()
    });
  }
function getGrad () {
return [
    rgba(255,0,0,0),
        // more values here
];
}   
function getGrad1 ()    {
return [
    rgba(0,255,255,0),
        //more values here
];
}

澄清一下，每当渐变属性被注释掉时，一切都可以使用默认渐变。上面的代码不产生输出。有什么想法吗？

Answer 1

渐变值应该是字符串。 rgba是一个css函数，而不是一个js，所以在开发人员控制台中你应该看到几个错误，说明函数没有定义。

function getGrad1 ()    {
    return [
        'rgba(0,255,255,0)',
            //more values here
    ];
}

请查看此处的示例：https://developers.google.com/maps/documentation/javascript/examples/layer-heatmap

用于多个层的Javascript google热图渐变设置

1 个答案: