Question

我正在网站上制作美国的选举氯空图。我需要有鲜明的颜色（红色，黄色，蓝色，绿色，紫色等），而不是颜色从浅红色到深红色的热图。我填充颜色的数据来自CSV文件。我找不到一个很好的示例作为参考，可用于从具有这种不同颜色的CSV来制作氯体积图。我目前正在使用Plotly，但可以接受其他想法。

我作为指南发现的最接近的参考文献是：https://plot.ly/javascript/choropleth-maps/，但这仍然不是我所需要的。叶绿体热类型图使用CSV文件引用，而不同颜色的叶绿体图则不使用。

<!DOCTYPE html>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<html>

<div id="myDiv"></div>
<script>
Plotly.d3.csv("states.csv", function(err, rows){

  function unpack(rows, key) {
    return rows.map(function(row) { return row[key]; });
  }

  var data = [{
    type: 'choropleth',
    locationmode: 'USA-states',
    locations: unpack(rows, 'code'),
    z: unpack(rows, 'id'),
    zmin: 1,
    zmax: 3,
    color: [
      [1, 'rgb(251,128,114)'], [2, 'rgb(255,237,111)'],
      [3, 'rgb(179,222,105)']
    ]
  }];

console.log(data.locations);
var layout = {
        geo:{
          scope: 'usa',
        }
    };
    Plotly.plot(myDiv, data, layout, {showLink: true});
});

</script>
</html>

我的CSV文件如下：

code,id
AK,1
AL,1
AR,2
AS,2
AZ,1
CA,3
CO,1

我希望各州的颜色分别为绿色，黄色和红色，但我看到的却是红色阴影。

如何从CSV文件在Javascript色度图中获得不同的颜色？

0 个答案: