Question

我正在使用this example来创建可缩放的树形图。我已将颜色设置为d3.scale.category10（）。

function rect(rect) {
    rect.attr("x", function(d) { return x(d.x); })
        .attr("y", function(d) { return y(d.y); })
        .attr("width", function(d) { return x(d.x + d.dx) - x(d.x); })
        .attr("height", function(d) { return y(d.y + d.dy) - y(d.y); })
        .style("background", function(d) { return d.parent ? color(d.name) : null; })
        .attr("class", "treemapRect");
}

每次选择矩形时都会调用上述函数。设置背景的线应该在d3类别10方案中将每个矩形渲染为不同的颜色。它在Chrome和Opera中运行得非常好。但是，在Firefox中，尽管在检查器中指定了值，但rects似乎没有任何颜色。 rect将在检查器中显示以下属性：

background-color: rgb(31, 119, 180);
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-clip: border-box;
background-origin: padding-box;
background-position-x: 0%;
background-position-y: 0%;
background-size: auto auto;

为了进行比较，Chrome显示rect将具有以下属性：

background-image: initial;
background-position-x: initial;
background-position-y: initial;
background-size: initial;
background-repeat-x: initial;
background-repeat-y: initial;
background-attachment: initial;
background-origin: initial;
background-clip: initial;
background-color: rgb(227, 229, 229);

为什么Firefox不显示检查器中显示的内容？

d3 svg rect的背景颜色没有出现在firefox中

0 个答案: