Javascript 如何在SVG上使用滚动条显示多行文本

我正在寻找一种可以在SVG上显示一些多行文本数据以及滚动条的方法

我尝试过添加一个textarea和foreignObject的选项，它可以与Chrome、FF、Opera一起使用，但在IE中失败了

d3.select("g")
    .append('foreignObject')
    .attr("class", "csFObject")
    .attr("x", mouse[0] + 160)
    .attr("y", mouse[1] + 10)
    .attr('width', 280)
    .attr('height', 290)
    .append("textarea")
    .attr("cols", 37)
    .attr("rows", 14)
    .attr("readonly", "true")
    .attr("style", "overflow:auto;font-size: 14px;background-color:#ededed;border: 0px; width:280px;")
    .attr("x", mouse[0] + 160)
    .attr("y", mouse[1] + 20)
    .attr("id", "txtAreaGeoDescription")
    .attr("class", "txtAreaGeoDescription");

var textarea;
{
    textarea = document.getElementById("txtAreaGeoDescription");
    textarea.value = geoDescription;
    //textarea.scrollTop = textarea.scrollHeight;
}

因此，寻找其他选择， 我尝试的另一种方法是：

d3.select("g").append("g")
    .attr("width", 280)
    .attr("height", 290)
    .attr("class", "overlay")
    .append("text")
        .attr("x", mouse[0] + 160)
        .attr("y", mouse[1] + 20)
    .call(wrap, 280,geoDescription);

在这里，我可以得到所有浏览器上可见的数据，但我需要一个滚动条后显示5行数据显示

---

关于如何使用滚动条在SVG上显示多行数据的任何建议。

Hi Robert，我们可以使用文本代替图像。你有这样的例子吗？这个链接适用于任何东西。如果你被卡住了，可以尝试一下，然后发布一个带有细节的问题。@RobertLongson:谢谢你，这很有效。