我在创造一个连续的传奇（已使用线性梯度创建）使用D3进行线性采样。现在我必须使用相同的图例进行对数采样。但我的数据在0和1之间，如下所示。我看到对数采样的域值不能为零（给出无穷大），而对于零范围内的值，假设（0.1、0.2等）给出负值。如何使用对数采样，使用我的数据创建连续图例？

My Data:

[
[0.0, 255, 0, 0],
[0.2, 255, 255, 0],
[0.4, 0, 255, 0],
[0.6, 0, 255, 255],
[0.8, 0, 0, 255],
[1.0, 255, 0, 255]
]

其中0.0、0.2、0.4等是域值，其余是该点的RGB值。

const colorScale = scaleLog().domain([min,max]); // in my case min and max are [0, 1]
const id = "linear-gradient-" + id + "0";
linearGradient = defs
.append("linearGradient")
.attr("id", id)
.attr("x1", "0%")
.attr("x2", horizontal ? "100%" : "0%")
.attr("y1", "0%")
.attr("y2", horizontal ? "0%" : "100%");

// append the color
linearGradient
.selectAll("stop")
.data(itemColor)
.enter()
.append("stop")
.attr("offset", function (data) {
return data.offset + "%";
})
.attr("stop-color", function (data) {
return data.color;
});

// draw the rectangle and fill with gradient
svgLegend
.append("rect")
.attr("x", 35)
.attr("y", horizontal ? 70 : 18)
.attr("width", horizontal ? "189" : 20)
.attr("height", horizontal ? 20 : "149")
.style("fill", "url(#" + currentIndex + ")");

// create tick
const horizontalAxisLeg = axisBottom(scaleLog().domain([min, max]).tickValues(colorScale.domain());

我的传说看起来像这样：https://jsfiddle.net/z7gn8p5t/