是否有一种方法可以像这样使用js来样式d3.js图表轴:
svg.append("text")
.attr("x",xPos)
.attr("y",yPos -3)
.attr("font-family", "sans-serif")
.attr("font-size", "10px")
.attr("font-weight", "bold")
.attr("fill", "black")
.attr("text-anchor", "middle")
.attr("id", "tooltip")
.attr("transform", "translate(" + width/2 + ")")
.text(d.name +": "+ d.value);
而不是使用使用CSS的标准方法。这是一个CSS的例子,我想删除和样式我的轴与JS
.axis path,
.axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
.bar {
fill: steelblue;
}
.x.axis path {
display: none;
}
如果可以的话,我总是提倡使用CSS样式-这是它的设计目的,但是如果你愿意,你也可以手动设置样式。
例如,如果您想要样式化中轴线,您可以选择添加轴的"容器"或元素(在本例中我假设是svg:g
),并执行以下操作:
g.selectAll(".axis line")
.style("fill", "none")
.style("stroke", "#000")
.style("shape-rendering", "crispEdges");
}