Raphael JS中带下划线的文字

paper.install(Raphael);
var r = Raphael('svg');
var svg = r.set();
var rect = svg.rect(100, 100, 50, 50).attr({fill: 'orange'});
var text = svg.text(100, 100, 'Hello, World!');
var path = r.path('M10 10L100 100L100 10Z');
path.attr({fill: 'none', stroke: 'black', 'stroke-width': '2'});

// 为文本添加下划线
var underline = text.getBBox().width;
text.attr({text-anchor: 'end'});
text.text(underline - 15, 100, 'Hello, World!');

// 添加带下划线的文字
var textPath = r.textPath(100, 100, 'Hello, World!');
textPath.attr({fill: 'none', stroke: 'black', 'stroke-width': '2'});
textPath.node.getStroke().width = 10;
textPath.node.getStroke().color = 'red';
textPath.node.getFill().color = 'black';
textPath.node.getFill().alpha = 0.5;

// 添加更多的文字
var text2 = svg.text(100, 200, '这是另一个带下划线的文本');
var text3 = svg.text(100, 300, '这是第三个带下划线的文本');

text {
  text-decoration: underline;
}