How to show a subsection or “slice” of an SVG grap

问题:

Is there any way to slice an SVG . I mean any already available lib . I need to implement this slicing component in Java.

I mean , I have single SVG file and based rulers/scales i choose graphically , I want to slice the single SVG into different SVG files.

Hope I am clear

回答1:

Yes, although, you'd think this was classified information - or just simply impossible - based on how hard it is to find this basic fact....

Apparently, all you need to do is reference the viewBox from a URI "fragment".. I have confirmed, it does indeed work. Take the following example... The lesson of the story, in case you miss it, is... image.svg#svgView(viewBox(100,100,100,100))

image.svg is defined as <svg .... viewBox="0,0,400,400" width="400" height="400">

http://example.com/image.svg

http://example.com/image.svg#svgView(viewBox(100,100,100,100))

回答2:

If you're working with SVG in Java, the Batik SVG Toolkit will provide a lot of functionality (I confess I don't know what you mean by slicing, however)

回答3:

All you have to do is edit the <svg> tag. Edit width and height, set the viewBox attribute on the main svg element to the rectangle you want, render, repeat.

Each svg will contain all the data from the original but will only display the part of the drawing inside the viewBox. See http://dingoskidneys.com/~dholth/svg/

viewbox = "x y width height"

回答4:

If your goal in slicing the svg was to create 'hot links' or an image map .. this is how to do it!

Simply slice the svg in Illustrator then when saving ('Save As') the svg, be sure to nab the code ('SVG Code' at bottom) which will include slice references such as:

<rect id="_x3C_Slice_x3E__1_" x="88" y="22.5" class="yj4" width="227" height="88"/>

which are LINKABLE by surrounding with a link tag:

<a href="#"><rect id="_x3C_Slice_x3E__1_" x="88" y="22.5" class="yj4" width="227" height="88"/></a>

Hope this helps.