Question

I am creating a HTML 5 site that performs some form of diagramming in SVG using the JQuery SVG library by Keith Wood.

I would like to be able to draw simple text on the SVG canvas – nothing fancy just standard text (i.e. like a word or title text) which is given as examples on this site as actual SVG.

http://www.kevlindev.com/tutorials/basics/text/svg/index.htm

I have looked at the API reference on the Jquery library site and all I get is a complicated example of drawing wavy text which I am not interested in.

Can anyone give me a simple example of how I write text using the library API?

Answer 1

Here are a couple simple jQuery SVG Text examples:

    // Simple jQuery SVG Text examples
    var g = svg.group(
        {fontWeight: 'bold', fontSize: '32.5', fill: 'salmon'}
    ); 
    svg.text(g, 10, 40, "Here's an example of SVG Text");         
    svg.text(g, 10, 80, "in an SVG 'group' wrapper"); 

    svg.text( 10, 130, "and without a wrapper (as an svg root)", 
        {fontWeight: 'bold', fontSize: '32.5', fill: 'gold'}
    );