svg和d3中的文本边框

我试图实现一个文本边框，但结果并不是我所期望的。有没有办法使文本边框在放大和缩小时保持不变？例如，在这个JSFIDLE中，当我放大和缩小时，它会留下一个来自蓝色的阴影，即使背景是白色，白色笔划也很明显

以下是JSFIDLE：

及有关守则：

canvas.append("text")
      .text("Jennifer Lawrence")
      .attr("font-family", "Arial")
      .attr("font-weight", "bold")
      .attr("font-size", "16px")
      .attr("x", 100)
      .attr("y", 100)
      .attr("fill", "blue")
      .attr("stroke", "white")
      .attr("stroke-width", ".2px");

我想要的效果基于： 因此，当有不同颜色的行时，与行重叠的文本将更加明显，因为白色边框，而不重叠的文本看起来正常

谢谢

你可以使用.attr（“矢量效果”，“非缩放笔划”），它可以在Opera和Webkit上使用，并且最近已经在Firefox上修复，可以在文本上正常工作-我想你需要Firefox24

---

矢量效果=“非缩放笔划”但是IE不支持，所以如果你想支持IE9或IE10，就必须用javascript编写一些代码，在缩放时反向调整笔划宽度。

我面临一个类似的问题，即向量效果：非缩放笔划在除IE之外的所有其他浏览器上都可以正常工作。我的情况是，我无法使用JS修复这个问题。请给我一些使用CSS的解决方案。我建议你问自己的问题。谢谢你的回复。但我不能再问同样的问题了。我的问题也一样。我对路径元素应用了

矢量效果：非缩放笔划

，但在IE中不起作用。路径元素的笔划宽度要厚得多。