1. 程式人生 > >svg中顯示多行文字

svg中顯示多行文字

function makeShape(e) {
    if ( window.svgDocument == null )
        svgDocument = e.target.ownerDocument;

    var data1 = svgDocument.createTextNode("Line 1");
    var data2 = svgDocument.createTextNode("Line 2");

    var span1 = svgDocument.createElementNS(svgns, "tspan");
    var span2 = svgDocument.createElementNS(svgns, "tspan");

    span2.setAttributeNS(null, "x", "0");
    span2.setAttributeNS(null, "dy", "1em");

    var text = svgDocument.createElementNS(svgns, "text");
    text.setAttributeNS(null, "x", "0");
    text.setAttributeNS(null, "y", "13");
    text.setAttributeNS(null, "fill", "green");

    span1.appendChild(data1);
    span2.appendChild(data2);

    text.appendChild(span1);
    text.appendChild(span2);

    svgDocument.documentElement.appendChild(text);
}