我想用一个像素宽度和一个精确定义的颜色绘制垂直和水平线。无论我在尝试什么,我都无法让一种解决方案同时在 Firefox、Chrome 和 Internet Explorer 中正确运行。
假设我想在第二条像素线中绘制一条黑色的全水平线,在 d3.js 中你会认为这是解决方案:
.append("line")
.attr("x1", 0)
.attr("y1", 1.5)
.attr("x2", 100)
.attr("y2", 1.5)
.attr("stroke-width", 0.5)
.attr("stroke", "black");
从数学上讲,它应该完全符合我的要求,不是吗?不,它没有。Firefox 不显示它,IE 和 Chrome 使它变灰/透明。不使用 y 值的 +0.5 偏移量没有帮助,任何笔画宽度为 1 的东西也无济于事。每个浏览器都有一个确切的解决方案,但没有一个对所有三个都是正确的。如果这还不够,您甚至可以将形状渲染属性添加到方程中,这也无济于事。是否有任何一种尺寸适合这三个浏览器的所有解决方案,或者我是否真的必须根据浏览器修改行创建?