svg - svg および d3 のテキスト境界線

Question

テキスト境界線を実装しようとしていますが、結果は期待したものではありません。ズームインおよびズームアウトしたときにテキストの境界線が一定のままになるようにする方法はありますか? たとえば、このjsfiddleでは、ズームインおよびズームアウトすると、青から影が残り、背景が白であっても白いストロークが目立ちます。

ここに jsfiddle があります: http://jsfiddle.net/F3PhZ/1/

および関連するコード:

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");

私が望む効果は、 http://www.nytimes.com/interactive/2013/02/20/movies/among-the-oscar-contenders-a-host-of-connections.htmlに基づいて います。異なる色の線は、白い境界線のために線に重なるテキストがより目立ち、重ならないテキストは正常に見えます。

ありがとう！