20、探索Voronoi图与热力图的可视化魅力

探索Voronoi图与热力图的可视化魅力

1. 嵌套Voronoi图的生成艺术

Voronoi图不仅可以基于真实数据创建，还能使用随机数据快速生成美观的图表。在嵌套Voronoi图的创建中，我们会在现有Voronoi图的单元格内进一步创建新的Voronoi图，多次操作后就能得到漂亮的嵌套效果，每个Voronoi单元格会不断细分。

1.1 设置Voronoi图

以下是创建Voronoi图的基本设置代码：

var pointSeed = 8;
// 通用设置
var margin = {top: 50, bottom: 20, right: 20, left: 20},
    width = 1200 - margin.left - margin.right,
    height = 600 - margin.top - margin.bottom;
// 创建标准图表
var svg = d3.select(".chart")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height+ margin.top + margin.bottom)
    .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
var defs = d3.select(".chart").append("defs");
var color = function() {return d