Question

过去两天我一直坚持这个问题，现在是时候问我......

基本上我已经在基于.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"; });

过去两天我没有找到解决方案，有人能帮帮我吗？非常感谢你！

Answer 1

这是一个将颜色添加到voronoi图的示例。基本上，您将创建三个css类，其中包含3种不同颜色的填充值。

然后执行类似于他们在redraw（）函数中执行的操作，除非他们使用简单的模数来选择颜色，否则您将进行测试以查看数据值的范围。

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

如何根据d3.js中的某个值为voronoi图添加颜色

1 个答案: