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 Justin Thomas <ju...@brynnandjustin.com> on 2010/04/14 08:10:58 UTC

Namespace Question

Currently I'm accessing an SVG image with an <object> tag.  This works pretty well, but I've been considering embedding the dynamically created image more directly within a standard <div> (and using XMLHttpRequest to get the content).

As I understand it, I need to specify a namespace for the SVG tags (that's how I've embedded some other more static images within the xhtml directly).  I can't figure out how to get Batik to generate tags with the namespace specified (<svg:svg>, <svg:path>, etc.).  Is that possible?  I tried using the "createElementNS" methods (instead of just "createElement"), but that didn't seem to help.  Furthermore, some methods don't seem to have any NS options (like to SVGShape.toSvg()).

So today, I have this:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" contentScriptType="text/ecmascript" contentStyleType="text/css" preserveAspectRatio="xMidYMid meet" style="stroke-dasharray:none; shape-rendering:auto; font-family:'Dialog'; text-rendering:auto; fill-opacity:1; color-interpolation:auto; color-rendering:auto; font-size:12; fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10; stroke-linecap:square; stroke-linejoin:miter; font-style:normal; stroke-width:1; stroke-dashoffset:0; font-weight:normal; stroke-opacity:1;" version="1.1" zoomAndPan="magnify">
  <!--Generated by the Batik Graphics2D SVG Generator-->
  <defs id="genericDefs" />
  <g />
  <svg contentScriptType="text/ecmascript" contentStyleType="text/css" height="100%" onload="init(evt)" preserveAspectRatio="xMidYMid meet" version="1.1" width="100%" zoomAndPan="magnify">
    <script type="text/ecmascript" xlink:actuate="onLoad" xlink:href="/js/map.js" xlink:show="other" xlink:type="simple"><![CDATA[ignore this]]></script>
    <svg contentScriptType="text/ecmascript" contentStyleType="text/css" height="25000.0" id="nestedSvg" preserveAspectRatio="xMidYMid meet" version="1.1" width="25000.0" x="0.0" y="0.0" zoomAndPan="magnify">
      <g id="content">
. . .
...and I'd like to have this:

<html xmlns:svg="http://www.w3.org/2000/svg">  (Included to identify that the HTML tag will specify the SVG namespace)
<svg:svg xmlns:xlink="http://www.w3.org/1999/xlink" contentScriptType="text/ecmascript" contentStyleType="text/css" preserveAspectRatio="xMidYMid meet" style="stroke-dasharray:none; shape-rendering:auto; font-family:'Dialog'; text-rendering:auto; fill-opacity:1; color-interpolation:auto; color-rendering:auto; font-size:12; fill:black; stroke:black; image-rendering:auto; stroke-miterlimit:10; stroke-linecap:square; stroke-linejoin:miter; font-style:normal; stroke-width:1; stroke-dashoffset:0; font-weight:normal; stroke-opacity:1;" version="1.1" zoomAndPan="magnify">
  <!--Generated by the Batik Graphics2D SVG Generator-->
  <svg:defs id="genericDefs" />
  <svg:g />
  <svg:svg contentScriptType="text/ecmascript" contentStyleType="text/css" height="100%" onload="init(evt)" preserveAspectRatio="xMidYMid meet" version="1.1" width="100%" zoomAndPan="magnify">
    <svg:script type="text/ecmascript" xlink:actuate="onLoad" xlink:href="/js/map.js" xlink:show="other" xlink:type="simple"><![CDATA[ignore this]]></script>
    <svg:svg contentScriptType="text/ecmascript" contentStyleType="text/css" height="25000.0" id="nestedSvg" preserveAspectRatio="xMidYMid meet" version="1.1" width="25000.0" x="0.0" y="0.0" zoomAndPan="magnify">
      <svg:g id="content">
. . . 

Any advice is appreciated.  Thanks!


Re: Namespace Question

Posted by th...@kodak.com.
Hi Justin,

Justin Thomas <ju...@brynnandjustin.com> wrote on 04/14/2010 02:10:58 AM:

> As I understand it, I need to specify a namespace for the SVG tags 
> (that's how I've embedded some other more static images within the 
> xhtml directly).  I can't figure out how to get Batik to generate 
> tags with the namespace specified (<svg:svg>, <svg:path>, etc.).  Is
> that possible?  I tried using the "createElementNS" methods (instead
> of just "createElement"), but that didn't seem to help. 
> Furthermore, some methods don't seem to have any NS options (like to
> SVGShape.toSvg()).

   AFAIK, you shouldn't have to do this.  As long as the outer
SVG Element has an 'xmlns' attribute set to the svg namespace
then the default namespace should switch to SVG for that part
of the subtree.

   If you want to prefix the elements with 'svg:' then you need
to do that when you create the element:
        Element e = document.createElementNS("http://....", "svg:svg");

   You should also make sure that the 'svg' prefix's namespace
has been set with an appropriate xmlns specification.

   The current DOMUtilities.writeNode/Document is capable of
adding a prefix to the elements if that is what the xmlns tags
say should happen.  So if you can get your content as a DOM
you can remove the default xmlns attribute and replace it with
an xmlns:svg namespace attribute.  Then if you serialize the
document with the DOMUitilities it should prepend the svg: prefix.