如何基于在d3.js

我已经被这个问题卡住了最后两天，它的时候了，我要问的某些价值增添色彩Voronoi图...如何基于在d3.js

基本上，我已经成功地绘制基于.csv文件在地图上Voronoi图是这样的：

salaryLevel, lat, lon 
-0.263031898 -1.957862 30.058205 
-0.263031898 -1.960236 30.018172 
0.510327701 -1.979509 30.044363 
0.510327701 -1.919366 30.046766 
0.510327701 -1.900015 30.034252 
0.510327701 -1.926512 30.08714 
-0.263031898 -1.923729 30.072793 
0.510327701 -1.938892 30.07126 
0.510327701 -1.950085 30.079418

现在，我尝试添加颜色基于工资水平的值如上图所示的地图的每个部分。所以基本上在-1-0之间的薪水水平，使用蓝色，0-0.5之间，使用绿色，类似的东西。这里是我现在的代码：

var vertices = salary.map(function(d) { return [+d.lon, +d.lat]; }); 
    var median = salary.forEach(function(d) { d.median = +d.salaryLevel; }); 
    var voronoi = d3.geom.voronoi() 
     .clipExtent([0, 0], [width, height]); 

    var max = d3.max(median, function(d) { return d; }); 
    var min = d3.min(median, function(d) { return d; }); 
    var color = d3.scale.quantize().domain([min, max]).range([0, 0.1, 0.3]); 

    layer4.selectAll("path") 
    .data(voronoi(vertices)) 
    .enter().append("svg:path") 
    .classed("voronoi", true) 
    .attr("d", function(d) { return "M" + d.map(function(d) { return projection([d[0], d[1]]); }).join("L") + "Z"; });

我没有找到解决方案的最后两天，有人可以帮我吗？非常感谢！

来源

2014-12-04 user3639203

*“...我正在尝试添加颜色...” - - 在代码中看不到任何证据。你试过什么了？ *“...如图所示。”* - 什么图片？ – 2014-12-04 21:19:43

@squeamishossifrage我无法发布图片，所以我粘贴了.csv。我编辑了上面的代码。我试图按照0,0.1,0.3和相应的添加颜色来划分工资水平。我现在的问题是将薪水水平与坐标进行匹配。我是d3.js的新手，想知道这是否有效？或者有更好的解决方案？谢谢！ – user3639203 2014-12-04 21:50:11

这是一个.tsv文件，伙计。 – Noobster 2017-05-27 09:44:03

下面是将颜色添加到voronoi图中的示例。基本上你会创建三个css类与3种不同颜色的填充值。

然后做类似他们在重绘（）函数，除非他们做了简单的模数来选择颜色做什么，你就做一个测试，看看你的范围内的数据值下降英寸

http://bl.ocks.org/mbostock/4060366

来源

2014-12-05 03:18:15

如何基于在d3.js

回答

相关问题