d3(v5) 使用比例尺做渐变色

比例尺

把0到100的数字归一化到0-1区间:

let linear = d3.scaleLinear().domain([0, 100]).range([0, 1])

制作颜色计算器:

let red = '#
let compute = d3.interpolate('red', 'blue')

画100个小矩形,渐变色。

d3.selectAll('rect').data(d3.range(100)).enter()
	.append('rect')
	.attr('x', (d,i) => i * 10)
	.attr('y', 0)
	.attr('width', 10)
	.attr('height', 10)
	.style('fill', (d,i) => compute(linear(d)))

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/romeo12334/article/details/83308383