如何显示SVG图形的子部分或“切片”？

Question

有没有办法切片SVG。我的意思是任何已经可用的lib。我需要在Java中实现这个切片组件。

我的意思是，我有单个SVG文件和基于标尺/比例我选择图形，我想将单个SVG切成不同的SVG文件。

希望我很清楚

Answer 1

是的，虽然，你会认为这是机密信息 - 或者根本不可能 - 基于找到这个基本事实的难度......

显然，all you need to do is reference the viewBox from a URI "fragment".。我已经证实，确实有效。以下为例...如果您错过了，故事的教训是... image.svg #svgView（viewBox（100,100,100,100））

image.svg定义为<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))

Answer 2

如果您正在使用Java中的SVG，Batik SVG Toolkit将提供许多功能（我承认我不知道切片的意思，但是）

Answer 3

您只需编辑<svg>标记即可。修改width和height，将主svg元素的viewBox属性设置为您想要的矩形，渲染，重复。

每个svg将包含原始数据中的所有数据，但只会在viewBox内显示图形的一部分。见http://dingoskidneys.com/~dholth/svg/

viewbox = "x y width height"

Answer 4

如果切片svg的目的是创建“热链接”或图像映射，这就是方法！

只需在Illustrator中对svg进行切片，然后在保存（“另存为”）svg时，请确保先获取包含切片引用的代码（底部为“ SVG代码”），

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

通过用链接标记包围可链接：

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

希望这会有所帮助。