将文本添加到svg画布上

Question

我在将文本添加到svg画布上时遇到问题，因为经过多次尝试后似乎文本没有出现在画布上。

我正在努力在画布的上段左右两边添加数字0，但它似乎没有出现。

function createCounter() {
    let scoreLeft: number = 0;
    let scoreRight: number = 0;

    const svg = document.getElementById("canvas")!,
        counter = new Elem(svg, 'text')
            .attr('text',scoreLeft)
            .attr('x',250).attr('y', 400)
            .attr('font', 'Arial')
            .attr('font-size',32)
            .attr('fill','#FFFFFF')
}

函数Elem基本上是在创建一个新的svg元素，例如形状等，但是我对text元素有疑问，因为它似乎没有出现。我是否错过了任何导致其不显示的svg文本属性？

Answer 1

这是一个如何将文本转换为svg

的示例

<svg height="30" width="200">
<text x="0" y="15" fill="red">I love SVG!</text>
Sorry, your browser does not support inline SVG.
</svg>