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 kok eng meo <ds...@gmail.com> on 2006/06/22 09:52:58 UTC
Displaying JPEG file in SVG in batik
I have tried to create an image Element in batik to display a jpeg file. But
it does not work.
This is my code.
String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
.......
Element abc = document.createElementNS(svgNS, "image");
abc.setAttributeNS(null, "x", "10");
abc.setAttributeNS(null, "y", "10");
abc.setAttributeNS(null, "width", "300");
abc.setAttributeNS(null, "height", "300");
abc.setAttributeNS(XMLConstants.XLINK_NAMESPACE_URI, "xlink:href", "
picture.jpg");
..........
The error given is an I/O error occured while processing the URI
Can someone please advice me on this?? Or is there any other methods to
display a jpeg file inside batik SVGDocument. Thanks alot!!!!
Re: Displaying JPEG file in SVG in batik
Posted by Andreas Neumann <ne...@karto.baug.ethz.ch>.
Hi,
I only know this from the javascript perspective, but DOM manipulations
seem to be the same.
If you specify xlink:href and use .setAttributeNS() and the xlink
namespace you only have to specify "href" instead of "xlink:href". I
don't know if that is the cause of your problem. Otherwise I would check
the pathes and filenames if they are correct.
Andreas
kok eng meo wrote:
> I have tried to create an image Element in batik to display a jpeg
> file. But it does not work.
> This is my code.
>
>
> String svgNS = SVGDOMImplementation.SVG_NAMESPACE_URI;
> .......
> Element abc = document.createElementNS(svgNS, "image");
> abc.setAttributeNS(null, "x", "10");
> abc.setAttributeNS(null, "y", "10");
> abc.setAttributeNS(null, "width", "300");
> abc.setAttributeNS(null, "height", "300");
> abc.setAttributeNS(XMLConstants.XLINK_NAMESPACE_URI, "xlink:href",
> "picture.jpg");
> ..........
>
> The error given is an I/O error occured while processing the URI
>
> Can someone please advice me on this?? Or is there any other methods
> to display a jpeg file inside batik SVGDocument. Thanks alot!!!!
--
----------------------------------------------
Andreas Neumann
Institute of Cartography
ETH Zurich
Wolfgang-Paulistrasse 15
CH-8093 Zurich, Switzerland
Phone: ++41-44-633 3031, Fax: ++41-44-633 1153
e-mail: neumann@karto.baug.ethz.ch
www: http://www.carto.net/neumann/
SVG.Open: http://www.svgopen.org/
Carto.net: http://www.carto.net/
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Displaying JPEG file in SVG in batik
Posted by kok eng meo <ds...@gmail.com>.
Hi Thomas,
I have manage to display the jpeg using both the absolute filename and the
relative filename by setting the base URL using the setURLObject method.
Thanks alot for your help! :)
On 6/23/06, kok eng meo <ds...@gmail.com> wrote:
>
> Hi Thomas,
>
> Thanks for the reply :) I was still worrying that my problem could not be
> solve.
>
> >I would suggest that you provide a base URL either by setting the
> xml:base attribute
> >(in the xml namespace), or by calling '
> batik.dom.svg.SVGOMDocument.setURLObject(URL)'
>
> Yup, I am constructing the SVG document directly from memory. Regarding
> the 2 solutions you have provided, do you mind giving simple examples as to
> how do I set the xml namespace or where to call '
> batik.dom.svg.SVGOMDocument.setURLObject (URL). Actually I am quite new to
> batik and java :p, is there any sites where I can refer to sample batik
> codes to help me learn coding using batik better? Really appreciate your
> help!
>
>
> On 6/22/06, thomas.deweese@kodak.com <thomas.deweese@kodak.com > wrote:
> >
> > Hi Kok Eng Meo,
> >
> > Please only send messages to one list, in this case the 'users' list
> > since you are not developing Batik, you are developing code that uses
> > Batik.
> >
> > "kok eng meo" <ds...@gmail.com> wrote on 06/22/2006 03:52:58 AM:
> >
> > > I have tried to create an image Element in batik to display a jpeg
> > file.
> > But
> > > it does not work.
> > > This is my code.
> >
> > I don't see any obvious problems (points for getting
> > the namespace stuff "first try").
> >
> > > abc.setAttributeNS(XMLConstants.XLINK_NAMESPACE_URI , "xlink:href",
> > "picture.jpg");
> >
> > > The error given is an I/O error occurred while processing the URI
> >
> > Ohh, you just lost the points for not including the I/O
> > error stack trace ;)
> >
> > I/O error covers a lot, my first guess is that it can't find the
> > JPEG. If you are constructing the SVG document entirely in memory
> > (nothing read from disk) the document likely has no 'base URL' to
> > resolve relative URL's (like " picture.jpg"). I would suggest that
> > you provide a base URL either by setting the xml:base attribute
> > (in the xml namespace), or by calling
> > 'batik.dom.svg.SVGOMDocument.setURLObject(URL)'
> >
> > > Can someone please advice me on this?? Or is there any other methods
> > to
> > > display a jpeg file inside batik SVGDocument.
> >
> > No this is it...
> >
> >
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> > For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
> >
> >
>
Re: Displaying JPEG file in SVG in batik
Posted by kok eng meo <ds...@gmail.com>.
Hi Thomas,
Thanks for the reply :) I was still worrying that my problem could not be
solve.
>I would suggest that you provide a base URL either by setting the xml:base
attribute
>(in the xml namespace), or by calling '
batik.dom.svg.SVGOMDocument.setURLObject(URL)'
Yup, I am constructing the SVG document directly from memory. Regarding the
2 solutions you have provided, do you mind giving simple examples as to how
do I set the xml namespace or where to call '
batik.dom.svg.SVGOMDocument.setURLObject(URL). Actually I am quite new to
batik and java :p, is there any sites where I can refer to sample batik
codes to help me learn coding using batik better? Really appreciate your
help!
On 6/22/06, thomas.deweese@kodak.com <th...@kodak.com> wrote:
>
> Hi Kok Eng Meo,
>
> Please only send messages to one list, in this case the 'users' list
> since you are not developing Batik, you are developing code that uses
> Batik.
>
> "kok eng meo" <ds...@gmail.com> wrote on 06/22/2006 03:52:58 AM:
>
> > I have tried to create an image Element in batik to display a jpeg file.
> But
> > it does not work.
> > This is my code.
>
> I don't see any obvious problems (points for getting
> the namespace stuff "first try").
>
> > abc.setAttributeNS(XMLConstants.XLINK_NAMESPACE_URI, "xlink:href",
> "picture.jpg");
>
> > The error given is an I/O error occurred while processing the URI
>
> Ohh, you just lost the points for not including the I/O
> error stack trace ;)
>
> I/O error covers a lot, my first guess is that it can't find the
> JPEG. If you are constructing the SVG document entirely in memory
> (nothing read from disk) the document likely has no 'base URL' to
> resolve relative URL's (like "picture.jpg"). I would suggest that
> you provide a base URL either by setting the xml:base attribute
> (in the xml namespace), or by calling
> 'batik.dom.svg.SVGOMDocument.setURLObject(URL)'
>
> > Can someone please advice me on this?? Or is there any other methods to
> > display a jpeg file inside batik SVGDocument.
>
> No this is it...
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
> For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
>
>
RE: Displaying large number of SVG elements (Memory Handling)
Posted by Dylan Browne <db...@mango-solutions.com>.
Andreas and Thomas,
Thanks for the comprehensive replies. More than enough suggestions to be
getting on with! :)
I think the suggested refinements to make to my code will allow to me render
most of what I require anyway. And also, I think we will definitely be
following the route whereby if the user does request a graph that requires a
number of points that exceeds a set maximum, they will be given a raster
image, rather than an SVG Document. Tough luck on them if they don't know
how to filter their data!
Thanks as always for the advice,
Cheers,
Dylan.
-----Original Message-----
From: Andreas Neumann [mailto:neumann@karto.baug.ethz.ch]
Sent: 21 July 2006 10:56
To: batik-users@xmlgraphics.apache.org
Subject: Re: Displaying large number of SVG elements (Memory Handling)
Hi Dylan,
SVG viewers have their limitation and as far as I know, SVG was never
designed to handle huge amounts of data. Of course it would be nice if
it could ...
Parts of the reason of why it can't handle huge amounts of data are the
interactivity and animation features SVG provides. It has to maintain
the DOM for all the elements, which is expensive.
The threshold value of the number of elements that a viewer can handle
varies according to the hardware and the software implementation. It
maybe at 10000 elements up to 50000 elements. I never saw a SVG
implementation that could handle >50000 elements without performance
problems and many viewers already fail with 10000 elements.
There might be workarounds, though:
* use a clever serverside generation in combination with network requests
- if you want to show an overview of your data, just show the most
prominent features or aggregate features that are close to each other
- if the user zooms in, provide additional graphics or details
as an example see our yosemite maps
(http://www.carto.net/williams/yosemite/), which works in all SVG full
viewers, even if they don't support a large number of elements. Content
is generated serverside according to the map extent the user had chosen.
If a user zooms in, he gets additional elements and the geometry is more
detailed, as he zooms out, geometry is simplified on the server,
selected, partially aggregated or we use different datasets.
* try to reduce the number of elements. As an example: if several
circles share the same attributes/interactivity it might be more
efficient to use a path element with lots of "M" moveto commands and use
markers to show the circles. If you have lots of path elements, try to
aggregate them to viewer path elements.
* use elements are usually in particular slow. If you can use rects or
circles instead of the use elements, thats in almost all cases more
efficient than use elements
If you don't need the interactivity, other technologies (e.g. raster
graphics) might be more suitable, but as I see, you use the mouse
events, so this might not be an option.
* finally: if you really need to support such a large number of
elements, try to support SVG viewer development either by contributing
suggestions to improve the code, contributing code or helping
financially by supporting developers. I don't know if that is an option.
I produced a document that describes server-client communication for
maps and contains suggestions/ideas to improve performance. I don't know
if that helps:
http://www.carto.net/papers/svg/postgis_geturl_xmlhttprequest/
Andreas
Dylan Browne wrote:
>
>
>
>
>
>
> Hi,
>
>
>
> I guess this is a general question that I'm sure all SVG developers
> come across, how to handle an SVG Document that contains a very large
> number of SVG Elements.
>
>
>
> I've scanned the archives but didn't see anything that relates to my
> current issue, that is displaying a large number of elements AND those
> elements containing a great deal of information.
>
>
>
> For example, as below, this is my code to render a single circle on a
> graph, together with it's associated JS etc. None of the information
> is redundant, as far as I can see. I was wondering if there is any way
> to 'compress' this, if that makes sense. I could conceivably need to
> generate 50,000 of these circular points, by which time the Document
> is getting bloated and giving outOfMemory errors. (I'm using Batik DOM
> to generate my SVG Document in memory and then streaming it to a
> browser).
>
>
>
> <use fill-opacity="0.2" xmlns:xlink="http://www.w3.org/1999/xlink"
>
>
>
onmousedown="select_group(evt,true,145.94715733333334,445.35867495591333,&ap
os;1.0');"
>
>
> stroke="blue" name="1.0"
>
> onmouseover="selectLabelledLine(evt,'DOSE =
> 10.00|IRESP = 42.91|ID = 1.0');select_point(evt);"
>
>
> transform="translate(145.94715733333334,445.35867495591333)scale(5.0)"
>
> width="5.0%" xlink:show="embed" xlink:type="simple"
> fill="blue"
>
> onmouseup="deselect_group(evt,true,'1.0');"
>
> height="5.0%"
>
>
>
onmouseout="deselectLabelledLine(evt);deselect_point(evt);deselect_group(evt
,true,'1.0');"
>
>
> xlink:href="#circle" xlink:actuate="onLoad"/>
>
>
>
>
>
> Thanks in advance for any advice,
>
>
>
> Kind regards,
>
> Dylan
>
--
----------------------------------------------
Andreas Neumann
Institute of Cartography
ETH Zurich
Wolfgang-Paulistrasse 15
CH-8093 Zurich, Switzerland
Phone: ++41-44-633 3031, Fax: ++41-44-633 1153
e-mail: neumann@karto.baug.ethz.ch
www: http://www.carto.net/neumann/
SVG.Open: http://www.svgopen.org/
Carto.net: http://www.carto.net/
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Displaying large number of SVG elements (Memory Handling)
Posted by Andreas Neumann <ne...@karto.baug.ethz.ch>.
Hi Dylan,
SVG viewers have their limitation and as far as I know, SVG was never
designed to handle huge amounts of data. Of course it would be nice if
it could ...
Parts of the reason of why it can't handle huge amounts of data are the
interactivity and animation features SVG provides. It has to maintain
the DOM for all the elements, which is expensive.
The threshold value of the number of elements that a viewer can handle
varies according to the hardware and the software implementation. It
maybe at 10000 elements up to 50000 elements. I never saw a SVG
implementation that could handle >50000 elements without performance
problems and many viewers already fail with 10000 elements.
There might be workarounds, though:
* use a clever serverside generation in combination with network requests
- if you want to show an overview of your data, just show the most
prominent features or aggregate features that are close to each other
- if the user zooms in, provide additional graphics or details
as an example see our yosemite maps
(http://www.carto.net/williams/yosemite/), which works in all SVG full
viewers, even if they don't support a large number of elements. Content
is generated serverside according to the map extent the user had chosen.
If a user zooms in, he gets additional elements and the geometry is more
detailed, as he zooms out, geometry is simplified on the server,
selected, partially aggregated or we use different datasets.
* try to reduce the number of elements. As an example: if several
circles share the same attributes/interactivity it might be more
efficient to use a path element with lots of "M" moveto commands and use
markers to show the circles. If you have lots of path elements, try to
aggregate them to viewer path elements.
* use elements are usually in particular slow. If you can use rects or
circles instead of the use elements, thats in almost all cases more
efficient than use elements
If you don't need the interactivity, other technologies (e.g. raster
graphics) might be more suitable, but as I see, you use the mouse
events, so this might not be an option.
* finally: if you really need to support such a large number of
elements, try to support SVG viewer development either by contributing
suggestions to improve the code, contributing code or helping
financially by supporting developers. I don't know if that is an option.
I produced a document that describes server-client communication for
maps and contains suggestions/ideas to improve performance. I don't know
if that helps:
http://www.carto.net/papers/svg/postgis_geturl_xmlhttprequest/
Andreas
Dylan Browne wrote:
>
>
>
>
>
>
> Hi,
>
>
>
> I guess this is a general question that I'm sure all SVG developers
> come across, how to handle an SVG Document that contains a very large
> number of SVG Elements.
>
>
>
> I've scanned the archives but didn't see anything that relates to my
> current issue, that is displaying a large number of elements AND those
> elements containing a great deal of information.
>
>
>
> For example, as below, this is my code to render a single circle on a
> graph, together with it's associated JS etc. None of the information
> is redundant, as far as I can see. I was wondering if there is any way
> to 'compress' this, if that makes sense. I could conceivably need to
> generate 50,000 of these circular points, by which time the Document
> is getting bloated and giving outOfMemory errors. (I'm using Batik DOM
> to generate my SVG Document in memory and then streaming it to a
> browser).
>
>
>
> <use fill-opacity="0.2" xmlns:xlink="http://www.w3.org/1999/xlink"
>
>
> onmousedown="select_group(evt,true,145.94715733333334,445.35867495591333,'1.0');"
>
>
> stroke="blue" name="1.0"
>
> onmouseover="selectLabelledLine(evt,'DOSE =
> 10.00|IRESP = 42.91|ID = 1.0');select_point(evt);"
>
>
> transform="translate(145.94715733333334,445.35867495591333)scale(5.0)"
>
> width="5.0%" xlink:show="embed" xlink:type="simple"
> fill="blue"
>
> onmouseup="deselect_group(evt,true,'1.0');"
>
> height="5.0%"
>
>
> onmouseout="deselectLabelledLine(evt);deselect_point(evt);deselect_group(evt,true,'1.0');"
>
>
> xlink:href="#circle" xlink:actuate="onLoad"/>
>
>
>
>
>
> Thanks in advance for any advice,
>
>
>
> Kind regards,
>
> Dylan
>
--
----------------------------------------------
Andreas Neumann
Institute of Cartography
ETH Zurich
Wolfgang-Paulistrasse 15
CH-8093 Zurich, Switzerland
Phone: ++41-44-633 3031, Fax: ++41-44-633 1153
e-mail: neumann@karto.baug.ethz.ch
www: http://www.carto.net/neumann/
SVG.Open: http://www.svgopen.org/
Carto.net: http://www.carto.net/
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: Displaying large number of SVG elements (Memory Handling)
Posted by th...@kodak.com.
Hi Dylan,
"Dylan Browne" <db...@mango-solutions.com> wrote on 07/21/2006 05:22:46
AM:
> I've scanned the archives but didn't see anything that relates to my
current
> issue, that is displaying a large number of elements AND those elements
> containing a great deal of information.
>
> For example, as below, this is my code to render a single circle on a
graph,
> together with it's associated JS etc. None of the information is
redundant, as
> far as I can see.
It's a little hard to give good suggestion of what information might be
redundant given a sample of one! But I'll try anyways... ;)
> I was wondering if there is any way to 'compress' this, if
> that makes sense. I could conceivably need to generate 50,000 of these
> circular points
The first thing I would do is as much as possible move things up
to the containing group. So The main examples I can think of for this
would be fill, stroke, fill-opacity, and your event attributes.
The small amount of really node specific data ("name" for example) can
I think be pulled from what's left on the element (transform for location,
although I would lean towards using getBBox for that), read up on DOM
event capture/bubbling.
Also It strikes me as odd to have a scale(5.0) and width="5%", either
you should just make it width/height="25%" or more likely you aren't
referencing a symbol element and you can drop the width and height attrs.
The xlink attrs aren't really needed on the element (I'm sure some of
them are provided by Batik) but I think you must be setting xmlns:xlink
on the use.
Trim your coordinates to something reasonable (14 decimal places?)...
<g onmousedown="select_group(evt)" onmouseup="deselect_group(evt)"
onmouseout="deselectAll(evt)"/>
<g fill-opactiy="0.2" fill="blue" stroke="blue">
<!-- note you can have multiple groups if you have
a few colors you use -->
<use name="1.0" otherParameterForScript="true"
transform="translate(145.947, 445.359)"
width="25%" height="25%"
xlink:href="#circle"/>
</g>
</g>
I should also mention that you are probably blowing up the DOM
and Graphics tree significantly by using the 'use' element instead of
a simple circle. Use is potentially good to use if you are referencing
really complex geometry (although I suspect that like Batik many
implementations end up cloning the referenced content so that CSS
cascading can take place - effectively muting the memory savings,
although their is a file size savings, for complex objects).
In this case you are probably needlessly introducing 1-2 group
elements for each circle.
I would probably change the transform to good old 'cx' 'cy',
but their is nothing really wrong with using transform.
<circle name="1.0" otherParameterForScript="true"
transform="translate(145.947, 445.359)"
width="25%" height="25%"/>
> xlink:show="embed" xlink:type="simple" xlink:actuate="onLoad"/>
> (I'm using Batik DOM to generate my SVG Document in memory
> and then streaming it to a browser).
For most use cases you can strip the 'unspecified' attributes
when you serialize the document (these are attributes that are
defined by the language's DTD/Schema). You can detect them by
calling the 'public boolean Attr.getSpecified()' method.
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Displaying large number of SVG elements (Memory Handling)
Posted by Dylan Browne <db...@mango-solutions.com>.
Hi,
I guess this is a general question that I'm sure all SVG developers come
across, how to handle an SVG Document that contains a very large number of
SVG Elements.
I've scanned the archives but didn't see anything that relates to my current
issue, that is displaying a large number of elements AND those elements
containing a great deal of information.
For example, as below, this is my code to render a single circle on a graph,
together with it's associated JS etc. None of the information is redundant,
as far as I can see. I was wondering if there is any way to 'compress' this,
if that makes sense. I could conceivably need to generate 50,000 of these
circular points, by which time the Document is getting bloated and giving
outOfMemory errors. (I'm using Batik DOM to generate my SVG Document in
memory and then streaming it to a browser).
<use fill-opacity="0.2" xmlns:xlink="http://www.w3.org/1999/xlink"
onmousedown="select_group(evt,true,145.94715733333334,445.35867495591333,&ap
os;1.0');"
stroke="blue" name="1.0"
onmouseover="selectLabelledLine(evt,'DOSE =
10.00|IRESP = 42.91|ID = 1.0');select_point(evt);"
transform="translate(145.94715733333334,445.35867495591333)scale(5.0)"
width="5.0%" xlink:show="embed" xlink:type="simple"
fill="blue"
onmouseup="deselect_group(evt,true,'1.0');"
height="5.0%"
onmouseout="deselectLabelledLine(evt);deselect_point(evt);deselect_group(evt
,true,'1.0');"
xlink:href="#circle" xlink:actuate="onLoad"/>
Thanks in advance for any advice,
Kind regards,
Dylan
Re: Displaying JPEG file in SVG in batik
Posted by th...@kodak.com.
Hi Kok Eng Meo,
Please only send messages to one list, in this case the 'users' list
since you are not developing Batik, you are developing code that uses
Batik.
"kok eng meo" <ds...@gmail.com> wrote on 06/22/2006 03:52:58 AM:
> I have tried to create an image Element in batik to display a jpeg file.
But
> it does not work.
> This is my code.
I don't see any obvious problems (points for getting
the namespace stuff "first try").
> abc.setAttributeNS(XMLConstants.XLINK_NAMESPACE_URI, "xlink:href",
"picture.jpg");
> The error given is an I/O error occurred while processing the URI
Ohh, you just lost the points for not including the I/O
error stack trace ;)
I/O error covers a lot, my first guess is that it can't find the
JPEG. If you are constructing the SVG document entirely in memory
(nothing read from disk) the document likely has no 'base URL' to
resolve relative URL's (like "picture.jpg"). I would suggest that
you provide a base URL either by setting the xml:base attribute
(in the xml namespace), or by calling
'batik.dom.svg.SVGOMDocument.setURLObject(URL)'
> Can someone please advice me on this?? Or is there any other methods to
> display a jpeg file inside batik SVGDocument.
No this is it...
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org