Re: [whatwg] SVG extensions to canvas
On Fri, 1 May 2009, Simon Pieters wrote: On Thu, 30 Apr 2009 21:15:04 +0200, Ian Hickson i...@hixie.ch wrote: On Thu, 25 Oct 2007, Anne van Kesteren wrote: For Opera 9.5 beta we implemented some experimental extensions to canvas involving SVGSvgElement. SVGSvgElement is supported as image argument to both drawImage and createPattern. (An HTMLImageElement pointing to an SVG element is also supported, but that seems natural if you support SVG from img.) For drawImage the pixel size of the SVG is determined as follows: 1. The image size parameters passed to drawImage 2. The intrinsic size of the SVG image 3. 300 x 150 For createPattern it is as follows: 1. The intrinsic size of the SVG image 2. 300 x 150 (It would be nice if createPattern was extended to allow height/width arguments as well.) The intrinsic size of the SVG image is the specified size with percentages resolved against 300 x 150, and sizes depending on the font-size resolved against the computed font-size of the SVGSvgElement (will be the browser default most of the time). The SVG image is always rendered at time 0 for animated images. Drawing an SVG image currently marks the canvas context as unsafe so toDataURL() and getImageData() throw. We expect to make this story a bit nicer at some point. As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? It would at least have to change to make it not throw... The image argument must be an instance of HTMLImageElement, HTMLCanvasElement, or HTMLVideoElement. If the image is of the wrong type or null, the implementation must raise a TYPE_MISMATCH_ERR exception. Oh, I misunderstood. I thought you meant svg in an img. I don't want to add painting of svg into canvas right now, because on the long term I expect we'll have a generic paint this element into the canvas feature and I would want the two to be the same mechanism. On Mon, 4 May 2009, Oliver Hunt wrote: I'm not sure this is a great idea, as like all other elements the size of an SVGSVGElement may be influenced by where it is in the DOM, which makes it unclear how drawImage(SVGSVGElement) should work, eg. should it use the natural size of the element, the size of the element according to its current location in the dom (and what happens if it's not in the dom?), or what? I believe drawImage should be left as it currently is (basically taking objects that are intrinsically bitmap-ish), and if we were to add an ability to draw an svg element into the canvas it should really be an simple drawElement(Element) method instead, after all, why restrict it it just to SVG elements? Indeed. -- Ian Hickson U+1047E)\._.,--,'``.fL http://ln.hixie.ch/ U+263A/, _.. \ _\ ;`._ ,. Things that are impossible just take longer. `._.-(,_..'--(,_..'`-.;.'
Re: [whatwg] SVG extensions to canvas
On Wed, 06 May 2009 22:16:50 +0200, Oliver Hunt oli...@apple.com wrote: That svg hasn't got intrinsic sizes, so it cannot be rendered on a canvas. This doesn't preclude the use of svg with intrinsic sizes, that are given only by width/height attributes on svg. That's really really bad, as that means sometimes drawing you svg will work, and sometimes it won't. That's why it's a bad API. That's not quite what we implemented (and proposed) though. In case there is no intrinsic size you'd just fall back to a default size. I.e. similar to how img, iframe, etc. work. -- Anne van Kesteren http://annevankesteren.nl/
Re: [whatwg] SVG extensions to canvas
2009/5/5 Robert O'Callahan rob...@ocallahan.org: On Tue, May 5, 2009 at 4:35 AM, Giovanni Campagna scampa.giova...@gmail.com wrote: What is embed used for? Flash and videos. Both have intrinsic sizes What is object used for? Videos, Java applets and Silverlight. They all have intrinsic sizes. In principal, maybe they do, but typically those sizes are not exposed to the browser and are not used in layout. This is an implementation problem (and likely a bug: if a don't specify width/height for video I should get the intrinsic size, not a default) Basically, for what concerns rendering (the element being replaced in the CSS meaning of term), img,embed,object,svg have intrinsic sizes (they may be rescaled, but this is ortogonal) SVG images often don't have an intrinsic size. What's the intrinsic size of this image? svg xmlns=http://www.w3.org/2000/svg; linearGradient id=g x1=0 y1=0 x2=1 y2=0 stop stop-color=red offset=0/stop stop-color=lime offset=1/ /linearGradient rect x=0% y=0% width=100% height=100% fill=url(#g)/ /svg That svg hasn't got intrinsic sizes, so it cannot be rendered on a canvas. This doesn't preclude the use of svg with intrinsic sizes, that are given only by width/height attributes on svg. Rob -- He was pierced for our transgressions, he was crushed for our iniquities; the punishment that brought us peace was upon him, and by his wounds we are healed. We all, like sheep, have gone astray, each of us has turned to his own way; and the LORD has laid on him the iniquity of us all. [Isaiah 53:5-6] Giovanni
Re: [whatwg] SVG extensions to canvas
SVG images often don't have an intrinsic size. What's the intrinsic size of this image? svg xmlns=http://www.w3.org/2000/svg; linearGradient id=g x1=0 y1=0 x2=1 y2=0 stop stop-color=red offset=0/stop stop-color=lime offset=1/ /linearGradient rect x=0% y=0% width=100% height=100% fill=url(#g)/ /svg That svg hasn't got intrinsic sizes, so it cannot be rendered on a canvas. This doesn't preclude the use of svg with intrinsic sizes, that are given only by width/height attributes on svg. That's really really bad, as that means sometimes drawing you svg will work, and sometimes it won't. That's why it's a bad API. --Oliver
Re: [whatwg] SVG extensions to canvas
2009/5/5 Robert O'Callahan rob...@ocallahan.org: On Mon, May 4, 2009 at 7:26 AM, Giovanni Campagna scampa.giova...@gmail.com wrote: svg has an intrinsic size (like video,img, and embed/object), the other have not. video and img usually have intrinsic sizes, but embed/object/iframe usually don't. svg often does and often does not. What is embed used for? Flash and videos. Both have intrinsic sizes What is object used for? Videos, Java applets and Silverlight. They all have intrinsic sizes. Basically, for what concerns rendering (the element being replaced in the CSS meaning of term), img,embed,object,svg have intrinsic sizes (they may be rescaled, but this is ortogonal) Note that I didn't include iframe in this list, because it could be rendered as if the child document contents were inside the parent document, within the iframe (auto height given by elements content); or it could be rendered as a window, with intrinsic sizes given by width/height. Rob -- He was pierced for our transgressions, he was crushed for our iniquities; the punishment that brought us peace was upon him, and by his wounds we are healed. We all, like sheep, have gone astray, each of us has turned to his own way; and the LORD has laid on him the iniquity of us all. [Isaiah 53:5-6] Giovanni
Re: [whatwg] SVG extensions to canvas
On Tue, May 5, 2009 at 4:35 AM, Giovanni Campagna scampa.giova...@gmail.com wrote: What is embed used for? Flash and videos. Both have intrinsic sizes What is object used for? Videos, Java applets and Silverlight. They all have intrinsic sizes. In principal, maybe they do, but typically those sizes are not exposed to the browser and are not used in layout. Basically, for what concerns rendering (the element being replaced in the CSS meaning of term), img,embed,object,svg have intrinsic sizes (they may be rescaled, but this is ortogonal) SVG images often don't have an intrinsic size. What's the intrinsic size of this image? svg xmlns=http://www.w3.org/2000/svg; linearGradient id=g x1=0 y1=0 x2=1 y2=0 stop stop-color=red offset=0/stop stop-color=lime offset=1/ /linearGradient rect x=0% y=0% width=100% height=100% fill=url(#g)/ /svg Rob -- He was pierced for our transgressions, he was crushed for our iniquities; the punishment that brought us peace was upon him, and by his wounds we are healed. We all, like sheep, have gone astray, each of us has turned to his own way; and the LORD has laid on him the iniquity of us all. [Isaiah 53:5-6]
Re: [whatwg] SVG extensions to canvas
SVG images often don't have an intrinsic size. What's the intrinsic size of this image? svg xmlns=http://www.w3.org/2000/svg; linearGradient id=g x1=0 y1=0 x2=1 y2=0 stop stop-color=red offset=0/stop stop-color=lime offset=1/ /linearGradient rect x=0% y=0% width=100% height=100% fill=url(#g)/ /svg Rob This is the same as tabletrtdtextarea/textarea/td/tr/table where the Ua shrink wraps the table but the textarea inherit the parents width. This would cause a 0 width table, but currentl user agents rely on other attributes to get the intrinsic dimensions, like rows and cols for the table. In the SVG case, the UA could use default dimensions, like 300 per 300 -- João Eiras Core Developer, Opera Software ASA, http://www.opera.com/
Re: [whatwg] SVG extensions to canvas
On Thu, 30 Apr 2009 21:15:04 +0200, Ian Hickson i...@hixie.ch wrote: As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? Maybe you misunderstood, but the request was not about img referencing SVG, but passing an SVGSVGElement object directly to drawImage() and friends. -- Anne van Kesteren http://annevankesteren.nl/
Re: [whatwg] SVG extensions to canvas
2009/5/4 Oliver Hunt oli...@apple.com: On May 4, 2009, at 6:38 AM, Anne van Kesteren wrote: On Thu, 30 Apr 2009 21:15:04 +0200, Ian Hickson i...@hixie.ch wrote: As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? Maybe you misunderstood, but the request was not about img referencing SVG, but passing an SVGSVGElement object directly to drawImage() and friends. I had certainly misunderstood :D I'm not sure this is a great idea, as like all other elements the size of an SVGSVGElement may be influenced by where it is in the DOM, which makes it unclear how drawImage(SVGSVGElement) should work, eg. should it use the natural size of the element, the size of the element according to its current location in the dom (and what happens if it's not in the dom?), or what? If HTMLImgElement uses the natural size, then SVGSVGElement should as well. The CSS properties set on img at its natural position in the DOM don't matter, so it is not really an issue. I believe drawImage should be left as it currently is (basically taking objects that are intrinsically bitmap-ish), and if we were to add an ability to draw an svg element into the canvas it should really be an simple drawElement(Element) method instead, after all, why restrict it it just to SVG elements? svg has an intrinsic size (like video,img, and embed/object), the other have not. --Oliver Giovanni
Re: [whatwg] SVG extensions to canvas
On Thu, 30 Apr 2009 21:15:04 +0200, Ian Hickson i...@hixie.ch wrote: As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? Anne van Kesteren replied: Maybe you misunderstood, but the request was not about img referencing SVG, but passing an SVGSVGElement object directly to drawImage() and friends. Maybe I misunderstood (or, more precisely, I am about to state my probable misunderstanding): Does this mean for example, that the author could take a chunk of svg code or its equivalent and pass it to canvas.drawImage() (and friends) and then have a raster version in JavaScript of the svg ? If so, then would that not allow, client-side, things like interrogating pixel values at point (x,y) within an SVG? That's something I'd like to see. I understand that if done improperly this can yield security problems across domains, but it seems in this case we're only talking one domain. David
Re: [whatwg] SVG extensions to canvas
On Tue, 05 May 2009 00:16:50 +0200, ddailey ddai...@zoominternet.net wrote: Maybe I misunderstood (or, more precisely, I am about to state my probable misunderstanding): Does this mean for example, that the author could take a chunk of svg code or its equivalent and pass it to canvas.drawImage() (and friends) and then have a raster version in JavaScript of the svg ? If so, then would that not allow, client-side, things like interrogating pixel values at point (x,y) within an SVG? That's something I'd like to see. I understand that if done improperly this can yield security problems across domains, but it seems in this case we're only talking one domain. The SVG fragment could still contain a cross-origin reference of some sorts so it does not help with that. It does allow you to create some SVG and draw it on a canvas without having to first create a data URL or some such out of it. -- Anne van Kesteren http://annevankesteren.nl/
Re: [whatwg] SVG extensions to canvas
On Mon, May 4, 2009 at 7:26 AM, Giovanni Campagna scampa.giova...@gmail.com wrote: svg has an intrinsic size (like video,img, and embed/object), the other have not. video and img usually have intrinsic sizes, but embed/object/iframe usually don't. svg often does and often does not. Rob -- He was pierced for our transgressions, he was crushed for our iniquities; the punishment that brought us peace was upon him, and by his wounds we are healed. We all, like sheep, have gone astray, each of us has turned to his own way; and the LORD has laid on him the iniquity of us all. [Isaiah 53:5-6]
Re: [whatwg] SVG extensions to canvas
On Thu, 30 Apr 2009 21:15:04 +0200, Ian Hickson i...@hixie.ch wrote: On Thu, 25 Oct 2007, Anne van Kesteren wrote: For Opera 9.5 beta we implemented some experimental extensions to canvas involving SVGSvgElement. SVGSvgElement is supported as image argument to both drawImage and createPattern. (An HTMLImageElement pointing to an SVG element is also supported, but that seems natural if you support SVG from img.) For drawImage the pixel size of the SVG is determined as follows: 1. The image size parameters passed to drawImage 2. The intrinsic size of the SVG image 3. 300 x 150 For createPattern it is as follows: 1. The intrinsic size of the SVG image 2. 300 x 150 (It would be nice if createPattern was extended to allow height/width arguments as well.) The intrinsic size of the SVG image is the specified size with percentages resolved against 300 x 150, and sizes depending on the font-size resolved against the computed font-size of the SVGSvgElement (will be the browser default most of the time). The SVG image is always rendered at time 0 for animated images. Drawing an SVG image currently marks the canvas context as unsafe so toDataURL() and getImageData() throw. We expect to make this story a bit nicer at some point. As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? It would at least have to change to make it not throw... The image argument must be an instance of HTMLImageElement, HTMLCanvasElement, or HTMLVideoElement. If the image is of the wrong type or null, the implementation must raise a TYPE_MISMATCH_ERR exception. -- Simon Pieters Opera Software
Re: [whatwg] SVG extensions to canvas
On Thu, 25 Oct 2007, Anne van Kesteren wrote: For Opera 9.5 beta we implemented some experimental extensions to canvas involving SVGSvgElement. SVGSvgElement is supported as image argument to both drawImage and createPattern. (An HTMLImageElement pointing to an SVG element is also supported, but that seems natural if you support SVG from img.) For drawImage the pixel size of the SVG is determined as follows: 1. The image size parameters passed to drawImage 2. The intrinsic size of the SVG image 3. 300 x 150 For createPattern it is as follows: 1. The intrinsic size of the SVG image 2. 300 x 150 (It would be nice if createPattern was extended to allow height/width arguments as well.) The intrinsic size of the SVG image is the specified size with percentages resolved against 300 x 150, and sizes depending on the font-size resolved against the computed font-size of the SVGSvgElement (will be the browser default most of the time). The SVG image is always rendered at time 0 for animated images. Drawing an SVG image currently marks the canvas context as unsafe so toDataURL() and getImageData() throw. We expect to make this story a bit nicer at some point. As far as I can tell this doesn't require any changes to HTML5, since the same applies here as applies to a regular img, right? -- Ian Hickson U+1047E)\._.,--,'``.fL http://ln.hixie.ch/ U+263A/, _.. \ _\ ;`._ ,. Things that are impossible just take longer. `._.-(,_..'--(,_..'`-.;.'
Re: [whatwg] SVG extensions to canvas
Presumably if the SVG document contained an object such as rect x=0% y=0% width=100% height=100% fill=red / then, that object would scale to fit the HTML tag that contains it. At least, I think that's how it works for embed , object and iframe. David Dailey - Original Message - From: Devi Web Development [EMAIL PROTECTED] To: [EMAIL PROTECTED] Sent: Saturday, October 27, 2007 12:41 AM Subject: Re: [whatwg] SVG extensions to canvas While you could say a raster image has an intrinsic size (I have no idea what the formal definition of this phrase is), SVGs *explicitly* state their size. To change the size, you would actually be violating the content of the image file itself. I think the best way to understand this would be to look over what an SVG is. The vectors are given a scale within the file, not externally. --- Daniel Brumbaugh Keeney Devi Web Development [EMAIL PROTECTED] ---
Re: [whatwg] SVG extensions to canvas
Daniel wrote: SVGs *explicitly* state their size So do raster images. Daniel wrote: To change the size, you would actually be violating the content of the image file itself. But that is exactly what SVG editors do - they let users scale the SVG images. Any application that does a thumbnail preview of an SVG image must scale the image. If it's okay to scale images for thumbnail previews, why is it not okay for scaling inside the IMG or OBJECT element? Regards, -Vlad http://xhtml.com Original Message From: Devi Web Development Date: 2007-10-27 12:41 AM While you could say a raster image has an intrinsic size (I have no idea what the formal definition of this phrase is), SVGs *explicitly* state their size. To change the size, you would actually be violating the content of the image file itself. I think the best way to understand this would be to look over what an SVG is. The vectors are given a scale within the file, not externally. --- Daniel Brumbaugh Keeney Devi Web Development [EMAIL PROTECTED] ---
Re: [whatwg] SVG extensions to canvas
On Sat, 27 Oct 2007 15:44:39 +0200, Vlad Alexander (xhtml.com) [EMAIL PROTECTED] wrote: Any application that does a thumbnail preview of an SVG image must scale the image. If it's okay to scale images for thumbnail previews, why is it not okay for scaling inside the IMG or OBJECT element? I think I understand what behavior you desire. However, it's not entirely clear to me that what Opera is wrong given that your example has an intrinsic width of a 100% (which is overridden with 300px if I understand all the algorithms correctly; I probably don't). I think that's one of the reasons it's simply gets clipped instead of scaled. (And clipping is a feature too, keep that in mind.) -- Anne van Kesteren http://annevankesteren.nl/ http://www.opera.com/
Re: [whatwg] SVG extensions to canvas
That would presumably because of the intrinsic size Anne referred to. SVG's contain scaling information; the size is designated in the image file. --- Daniel Brumbaugh Keeney Devi Web Development [EMAIL PROTECTED] ---
Re: [whatwg] SVG extensions to canvas
Hi Daniel, Sorry, I still don't get it. A raster (bitmap) image, which _isn't_ really designed to scale, has intrinsic size yet it is scaled by the IMG's width and height attributes. Why isn't an image that _is_ designed to scale not scaled by the IMG's width and height attributes? Regards, -Vlad http://xhtml.com Original Message From: Devi Web Development Date: 2007-10-26 7:44 PM That would presumably because of the intrinsic size Anne referred to. SVG's contain scaling information; the size is designated in the image file. --- Daniel Brumbaugh Keeney Devi Web Development [EMAIL PROTECTED] ---
[whatwg] SVG extensions to canvas
Hi, (Please reply to either HTML or WHATWG list.) For Opera 9.5 beta we implemented some experimental extensions to canvas involving SVGSvgElement. SVGSvgElement is supported as image argument to both drawImage and createPattern. (An HTMLImageElement pointing to an SVG element is also supported, but that seems natural if you support SVG from img.) For drawImage the pixel size of the SVG is determined as follows: 1. The image size parameters passed to drawImage 2. The intrinsic size of the SVG image 3. 300 x 150 For createPattern it is as follows: 1. The intrinsic size of the SVG image 2. 300 x 150 (It would be nice if createPattern was extended to allow height/width arguments as well.) The intrinsic size of the SVG image is the specified size with percentages resolved against 300 x 150, and sizes depending on the font-size resolved against the computed font-size of the SVGSvgElement (will be the browser default most of the time). The SVG image is always rendered at time 0 for animated images. Drawing an SVG image currently marks the canvas context as unsafe so toDataURL() and getImageData() throw. We expect to make this story a bit nicer at some point. Cheers, -- Anne van Kesteren http://annevankesteren.nl/ http://www.opera.com/
Re: [whatwg] SVG extensions to canvas
Anne, on a semi-related topic, can you please help me understand why Opera does not scale the SVG image when loaded via IMG element? Here is a test page: http://xhtml.com/misc/svg-img.htm Regards, -Vlad http://xhtml.com Original Message From: Anne van Kesteren Date: 2007-10-25 2:58 PM Hi, (Please reply to either HTML or WHATWG list.) For Opera 9.5 beta we implemented some experimental extensions to canvas involving SVGSvgElement. SVGSvgElement is supported as image argument to both drawImage and createPattern. (An HTMLImageElement pointing to an SVG element is also supported, but that seems natural if you support SVG from img.) For drawImage the pixel size of the SVG is determined as follows: 1. The image size parameters passed to drawImage 2. The intrinsic size of the SVG image 3. 300 x 150 For createPattern it is as follows: 1. The intrinsic size of the SVG image 2. 300 x 150 (It would be nice if createPattern was extended to allow height/width arguments as well.) The intrinsic size of the SVG image is the specified size with percentages resolved against 300 x 150, and sizes depending on the font-size resolved against the computed font-size of the SVGSvgElement (will be the browser default most of the time). The SVG image is always rendered at time 0 for animated images. Drawing an SVG image currently marks the canvas context as unsafe so toDataURL() and getImageData() throw. We expect to make this story a bit nicer at some point. Cheers,
