How to set a SVG rect element's background image with jQuery SVG plugin?
You can't insert an external image directly as the background to SVG objects.
Instead, you first have to create a patttern like this
var ptn = svg.pattern(defs, "imgPattern", 0, 0, 100, 100, 0, 0, 10, 10,
{patternUnits: "userSpaceOnUse"});
svg.image( ptn, 100, 50, 200, 200, "./theImageIwantToUse.png");
and use this pattern then via the url()
function in the fill attribute
svg.graph._wrapper.rect(group, 0, 100, 40, 20,
{fill: 'url(#imgPattern)',
stroke: 'black',
strokeWidth : 2});
You can insert images in your svg by using the <image>
element http://www.w3.org/TR/SVG/struct.html#ImageElement
An appropriate function is available in the plugin you mentioned.
svg.image(parent, x, y, width, height, ref, settings)
( http://keith-wood.name/svg.html )
I doubt it's possible to use stroke in an image so you'll have to draw a rectangle with no fill after drawing the image to get the exact result you want.