如何显示小节或“切片” SVG 图形?
有没有办法对 SVG 进行切片。 我的意思是任何已经可用的 lib 。 我需要用Java实现这个切片组件。
我的意思是,我有单个 SVG 文件和基于图形选择的标尺/比例,我想将单个 SVG 分割成不同的 SVG 文件。
希望我清楚
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
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
是的,尽管如此,你可能会认为这是机密信息 - 或者根本不可能 - 基于找到这个基本事实的难度......
显然,您所需要做的就是从 URI“片段”引用 viewBox。。 我已经证实,它确实有效。 举个例子...这个故事的教训是... image.svg#svgView(viewBox(100,100,100,100))
image.svg 被定义为
http://example.com/image.svg
http://example.com/image.svg#svgView(viewBox(100,100,100,100))
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))
如果您在 Java 中使用 SVG,Batik SVG 工具包 将提供很多功能(我承认我不知道你所说的切片是什么意思,但是)
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)
您所要做的就是编辑
标记。 编辑
width
和height
,将主 svg 元素上的viewBox
属性设置为您想要的矩形,渲染,重复。每个 svg 将包含原始数据的所有数据,但仅显示
viewBox
内绘图的部分。 请参阅http://dingoskidneys.com/~dholth/svg/All you have to do is edit the
<svg>
tag. Editwidth
andheight
, set theviewBox
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/如果您切片 svg 的目标是创建“热链接”或图像映射..这就是如何做到这一点!
只需在 Illustrator 中对 svg 进行切片,然后在保存(“另存为”)svg 时,请务必获取代码(底部的“SVG 代码”),其中将包含切片引用,例如:
可以通过链接标签进行链接:
希望这会有所帮助。
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.