D3.js 从鼠标悬停/鼠标悬停处理程序触发时d3转换不工作

---

过渡似乎没有被考虑在内，变化立即发生。这里我明显遗漏了什么？

您使用了两种不同类型的字符串来指定颜色（带和不带

）。D3不知道如何在这些不同类型之间进行插值。如果您使用相同的：

d3.select('svg')
    .append('rect')
    .attr('width', 50)
    .attr('height', 50)
    .style('fill', '#BFDEFF')
    .on('mouseover', function () {
        d3.select(this).transition().style('fill', '2B24FF');
    })
    .on('mouseout', function () {
        d3.select(this).transition().style('fill', 'BFDEFF');
    });

---

完整示例。

谢谢，你为我节省了很多时间。

.style('fill', '#BFDEFF')
.on('mouseover', function () {
    d3.select(this).transition().style('fill', '#2B24FF');
})
.on('mouseout', function () {
    d3.select(this).transition().style('fill', '#BFDEFF');
});