我想创建SVG工具提示，但是当我想正确对齐文本时遇到问题。
<g class="svgTootlip">
<rect class="ttip" x="-100" y="-50" width="100" height="50" rx="2" ry="2"></rect>
<text x="-90" y="-40">
4 Dec 2014
</text>
</g>
该组（
d3TtipG）是较大的SVG文件的一部分，并且根据鼠标位置进行转换。JS：
d3Container.on('mousemove', function () {
cords = d3.mouse(this);
tr_x = cords[0];
tr_y = cords[1];
if (tr_x > 23 && tr_y > 23) {
...
d3TtipG.attr({
style: 'transform: translate(' + ((tr_x < 560) ? tr_x + 110 : tr_x - 15) + 'px, ' + ((tr_y < 215) ? tr_y + 55 : tr_y - 10) + 'px)'
});
} else {
hideViewFinder();
}
});
有没有一种跨浏览器方式可以强制此文本粘贴在
rect或g的右侧？谢谢！
最佳答案
将文本的x位置设置为rect x + width并设置text-anchor="end"