2

I'm able to create an SVG Image which contains a filled SVG path, as already mentioned in this question: Fill SVG path element with a background-image

The SVG looks like this:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1">
    <g transform="translate(0, 0) rotate(0)" opacity="1">
        <defs>
            <pattern id="img_patrickComp_patrick_cv1_Graphic3" height="313" width="468"  patternTransform="translate(0, 0) scale(1, 1) rotate(0)" patternUnits="userSpaceOnUse">
                <image x="0" y="0" opacity="1" height="313" width="468" xlink:href="http://www.bittbox.com/wp-content/uploads/2008/04/free_hires_wood_texture_5.jpg" />
            </pattern>
        </defs>
        <path fill="url(#img_patrickComp_patrick_cv1_Graphic3)" stroke="Blue" d="M 86,100L 298,394L 289,710L 100,610L 100,400L 46,400 z" />
    </g>
</svg>

(Link to the SVG: http://jsfiddle.net/2UFtV/)

Is it possible to create the same textured SVG without knowing the width and height of the image?

Community
  • 1
  • 1
Robar
  • 1,929
  • 2
  • 30
  • 61

1 Answers1

2

If you want to preserve the raster image at it's native dimensions you need to know the dimensions yes.

Erik Dahlström
  • 59,452
  • 12
  • 120
  • 139
  • Thx for the info. I've already found a workaround for my problem. – Robar May 22 '12 at 09:53
  • Hi @Robar. Please, talk about the workaround. It'll help people with the same issue... Like me. Hehehehe – Halian Vilela Jun 08 '13 at 13:54
  • @Lianzinho: Well my problem was that I didn't knew the height/width of the image. The code that generated the SVG, retrieved the dimensions of the image by downloading them. This was my "workaround". I don't know if this answer is very useful for you, but I didn't find any other way to do this in SVG. – Robar Jun 10 '13 at 09:27