You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-users@xmlgraphics.apache.org by Anjello <An...@gmail.com> on 2010/06/16 17:29:05 UTC
embedding a png image in the svg document
Hello everyone,
I am new here. I am working on a java project for which I am using Batik. I
need to include a png file in my svg document. This is the coding I used
Element my_image = document.createElementNS(svgNS, "image");
my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href", "test_png.PNG");
but all I see on the JSVGCanvas is an image which is similar to a broken
link icon. Can someone please help me with this?
Thanks in advance.
--
View this message in context: http://old.nabble.com/embedding-a-png-image-in-the-svg-document-tp28904142p28904142.html
Sent from the Batik - Users mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
RE: SVG Colors inversion
Posted by Julien Beghin <mi...@hotmail.com>.
Thanks Thomas,
I am going to have a look at the new advices you gave me.
The CSSS one seems great.
I'm gonna try to add this first, as I didn't managed to find a correct matrix doing all the job ;)
>> I'am going to give this a try.
>> And going to try to fidn the matrix I've got to create ^^
> Filters are worth a try, but you might find that
> feComponentTransfer is faster and easier to work with.
>> It's hard to say if this would be more performant, but this might be
>> a good use case for feColorMatrixElement
> This could work but it involves a lot more work than the
>feComponentTransfer case (which is just a simple table lookup).
Yeah in fact it is hard to find the correct matrix to use !
>> One part of this project consists in a kind of color inversion of
>> some elements in the displayed SVG.
>>
>> In fact, only black(resp white) have to be converted in white(resp black).
> This actually sounds like an excellent place to use CSS style sheets.
>The simplest way (although perhaps not the fastest) would be to use a selector
>with both descendent, attribute and class bits. Something like
>
> svg[invert=false] .fill { fill: black }
> svg[invert=true] .fill { fill: white }
>
> svg[invert=false] .fillStroke { fill: black; stroke: white }
> svg[invert=true] .fillStroke { fill: white; stroke: black }
>
> The other possible option would be to use alternate Style sheets
>that do something similar (might be a little faster).
>
> Then simply setting the 'invert' attribute on the root SVG element
>should cause the colors to swap for all of the elements with an appropriate
>'class' attribute.
> http://www.w3.org/TR/CSS2/selector.html#descendant-selectors
_________________________________________________________________
Installez gratuitement les nouvelles Emoch'ticones !
http://www.ilovemessenger.fr/emoticones/telecharger-emoticones-emochticones.aspx
RE: SVG Colors inversion
Posted by th...@kodak.com.
Hi Julien,
Julien Beghin <mi...@hotmail.com> wrote on 06/25/2010 09:09:37 AM:
> I'am going to give this a try.
> And going to try to fidn the matrix I've got to create ^^
Filters are worth a try, but you might find that
feComponentTransfer is faster and easier to work with.
> It's hard to say if this would be more performant, but this might be
> a good use case for feColorMatrixElement
This could work but it involves a lot more work than the
feComponentTransfer case (which is just a simple table lookup).
> One part of this project consists in a kind of color inversion of
> some elements in the displayed SVG.
>
> In fact, only black(resp white) have to be converted in white(resp
black).
This actually sounds like an excellent place to use CSS style
sheets.
The simplest way (although perhaps not the fastest) would be to use a
selector
with both descendent, attribute and class bits. Something like
svg[invert=false] .fill { fill: black }
svg[invert=true] .fill { fill: white }
svg[invert=false] .fillStroke { fill: black; stroke: white }
svg[invert=true] .fillStroke { fill: white; stroke: black }
The other possible option would be to use alternate Style sheets
that do something similar (might be a little faster).
Then simply setting the 'invert' attribute on the root SVG element
should cause the colors to swap for all of the elements with an
appropriate
'class' attribute.
http://www.w3.org/TR/CSS2/selector.html#descendant-selectors
RE: SVG Colors inversion
Posted by Julien Beghin <mi...@hotmail.com>.
Why not...
I'am going to give this a try.
And going to try to fidn the matrix I've got to create ^^
Thanks for the hint
From: jonathanshawwood@gmail.com
Date: Fri, 25 Jun 2010 07:51:45 -0400
Subject: Re: SVG Colors inversion
To: batik-users@xmlgraphics.apache.org
It's hard to say if this would be more performant, but this might be a good use case for feColorMatrixElement
On Fri, Jun 25, 2010 at 6:18 AM, Julien Beghin <mi...@hotmail.com> wrote:
Hello to all... (and happy summer ^^)
Im working on a project using Batik and dealing with SVG !
One part of this project consists in a kind of color inversion of some elements in the displayed SVG.
In fact, only black(resp white) have to be converted in white(resp black).
The first solution is to look for each SVG elements in the displayed SVG. For each element we can set the color to white/black.
This solution is really slow ( more than a minute...) and this can't be acceptable.
-> Document state is ALWAYS_DYNAMIC if can help
Another idea was to add an overlay, and inverting color of each pixel if required, but the result is not convincing, probably because of antialising and rendering of the graphic, which introduces gray level pixel. These pixel are not inverted by our overlay... and each refresh takes aout 2seconds ( well.. depends on the screen resolution in fact ^^)
Do one of you have an idea on how to do this in optimisng performance(speed) and without grahics losts ?
ANy help would be appreciated
Votre vie privée l'est-elle vraiment ? Internet Explorer 8 vous protège gratuitement !
_________________________________________________________________
Installez gratuitement les nouvelles Emoch'ticones !
http://www.ilovemessenger.fr/emoticones/telecharger-emoticones-emochticones.aspx
Re: SVG Colors inversion
Posted by jonathan wood <jo...@gmail.com>.
It's hard to say if this would be more performant, but this might be a good
use case for feColorMatrixElement<http://www.w3.org/TR/SVG/filters.html#feColorMatrixElement>
On Fri, Jun 25, 2010 at 6:18 AM, Julien Beghin <mi...@hotmail.com>wrote:
> Hello to all... (and happy summer ^^)
>
>
>
> Im working on a project using Batik and dealing with SVG !
>
>
>
> One part of this project consists in a kind of color inversion of some
> elements in the displayed SVG.
>
> In fact, only black(resp white) have to be converted in white(resp black).
>
>
>
> The first solution is to look for each SVG elements in the displayed SVG.
> For each element we can set the color to white/black.
>
> This solution is really slow ( more than a minute...) and this can't be
> acceptable.
>
> -> Document state is ALWAYS_DYNAMIC if can help
>
>
>
> Another idea was to add an overlay, and inverting color of each pixel if
> required, but the result is not convincing, probably because of antialising
> and rendering of the graphic, which introduces gray level pixel. These pixel
> are not inverted by our overlay... and each refresh takes aout 2seconds (
> well.. depends on the screen resolution in fact ^^)
>
>
>
> Do one of you have an idea on how to do this in optimisng
> performance(speed) and without grahics losts ?
>
>
>
> ANy help would be appreciated
>
> ------------------------------
> Votre vie privée l'est-elle vraiment ? Internet Explorer 8 vous protège
> gratuitement ! <http://clk.atdmt.com/FRM/go/232102478/direct/01/>
>
SVG Colors inversion
Posted by Julien Beghin <mi...@hotmail.com>.
Hello to all... (and happy summer ^^)
Im working on a project using Batik and dealing with SVG !
One part of this project consists in a kind of color inversion of some elements in the displayed SVG.
In fact, only black(resp white) have to be converted in white(resp black).
The first solution is to look for each SVG elements in the displayed SVG. For each element we can set the color to white/black.
This solution is really slow ( more than a minute...) and this can't be acceptable.
-> Document state is ALWAYS_DYNAMIC if can help
Another idea was to add an overlay, and inverting color of each pixel if required, but the result is not convincing, probably because of antialising and rendering of the graphic, which introduces gray level pixel. These pixel are not inverted by our overlay... and each refresh takes aout 2seconds ( well.. depends on the screen resolution in fact ^^)
Do one of you have an idea on how to do this in optimisng performance(speed) and without grahics losts ?
ANy help would be appreciated
_________________________________________________________________
La boîte mail NOW Génération vous permet de réunir toutes vos boîtes mail dans Hotmail !
http://www.windowslive.fr/hotmail/nowgeneration/
Re: embedding a png image in the svg document
Posted by Anjello <An...@gmail.com>.
Hello Fabian,
Thank you so much for your response..! Honestly the problem has been with
the parameter that I passed. Batik accepts only URI paths!
so now the things seem to work well. I will require your help further in my
project. Thank you again.
Anjello.
Fabian Unfried-3 wrote:
>
> It seems that the path to your png file isn't correct, you could try to
> use the full path, e. g.:
>
> my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href",
> "/home/USERNAME/image/my.png");
>
> or
>
> my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href",
> "D:/images/my.png");
>
> Or you try to use the relative path from the directory your application is
> running, I guess (didn't test it).
>
> E.g. your application is running in D:\program files\myApp\ and your image
> is in D:\images\ you should try this:
>
> my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href",
> "../../images/my.png");
>
>
> Regards,
> Fabian
>
>
> Am 16.06.2010 um 17:29 schrieb Anjello:
>
>>
>> Hello everyone,
>>
>> I am new here. I am working on a java project for which I am using Batik.
>> I
>> need to include a png file in my svg document. This is the coding I used
>>
>> Element my_image = document.createElementNS(svgNS, "image");
>> my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href",
>> "test_png.PNG");
>>
>> but all I see on the JSVGCanvas is an image which is similar to a broken
>> link icon. Can someone please help me with this?
>>
>> Thanks in advance.
>> --
>> View this message in context:
>> http://old.nabble.com/embedding-a-png-image-in-the-svg-document-tp28904142p28904142.html
>> Sent from the Batik - Users mailing list archive at Nabble.com.
>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
>> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>>
>>
>
>
> - CONFIDENTIAL-
>
> This email and any files transmitted with it are confidential, and may
> also be legally privileged. If you are not the intended recipient, you
> may not review, use, copy, or distribute this message. If you receive this
> email in error, please notify the sender immediately by reply email and
> then delete this email.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
>
--
View this message in context: http://old.nabble.com/embedding-a-png-image-in-the-svg-document-tp28904142p28907814.html
Sent from the Batik - Users mailing list archive at Nabble.com.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: embedding a png image in the svg document
Posted by Fabian Unfried <fu...@zebra.com>.
It seems that the path to your png file isn't correct, you could try to use the full path, e. g.:
my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href", "/home/USERNAME/image/my.png");
or
my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href", "D:/images/my.png");
Or you try to use the relative path from the directory your application is running, I guess (didn't test it).
E.g. your application is running in D:\program files\myApp\ and your image is in D:\images\ you should try this:
my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href", "../../images/my.png");
Regards,
Fabian
Am 16.06.2010 um 17:29 schrieb Anjello:
>
> Hello everyone,
>
> I am new here. I am working on a java project for which I am using Batik. I
> need to include a png file in my svg document. This is the coding I used
>
> Element my_image = document.createElementNS(svgNS, "image");
> my_image.setAttributeNS(XLINK_NAMESPACE_URI, "xlink:href", "test_png.PNG");
>
> but all I see on the JSVGCanvas is an image which is similar to a broken
> link icon. Can someone please help me with this?
>
> Thanks in advance.
> --
> View this message in context: http://old.nabble.com/embedding-a-png-image-in-the-svg-document-tp28904142p28904142.html
> Sent from the Batik - Users mailing list archive at Nabble.com.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
- CONFIDENTIAL-
This email and any files transmitted with it are confidential, and may also be legally privileged. If you are not the intended recipient, you may not review, use, copy, or distribute this message. If you receive this email in error, please notify the sender immediately by reply email and then delete this email.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org