【问题标题】:Is there a script available to resize SVG?是否有可用于调整 SVG 大小的脚本?
【发布时间】:2010-11-08 20:25:24
【问题描述】:

有没有办法将 .SVG 从其当前大小(数千像素)重新缩放到更小的大小?我试过 ImageMagick,但它对 SVG 渐变的支持太弱了,没用。

目的是解决渲染库中的一个错误,该错误有时会导致具有大像素大小的 svg 分配大光栅(在最终平滑地重新缩放以进行实际显示之前)。

例如,如何更改这个 1024x1024px svg:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   width="1024.09"
   height="1024.36"
   id="svg2"
   sodipodi:version="0.32"
   inkscape:version="0.46"
   version="1.0"
   sodipodi:docname="tst.svg"
   inkscape:output_extension="org.inkscape.output.svg.inkscape">
  <defs
     id="defs4">
    <linearGradient
       inkscape:collect="always"
       id="linearGradient2454">
      <stop
         style="stop-color:#800000;stop-opacity:1;"
         offset="0"
         id="stop2456" />
      <stop
         style="stop-color:#800000;stop-opacity:0;"
         offset="1"
         id="stop2458" />
    </linearGradient>
    <inkscape:perspective
       sodipodi:type="inkscape:persp3d"
       inkscape:vp_x="99.717407 : 889.90313 : 1"
       inkscape:vp_y="7.5659029e-15 : 92.21017 : 0"
       inkscape:vp_z="191.66118 : 889.90313 : 1"
       inkscape:persp3d-origin="145.68929 : 873.73005 : 1"
       id="perspective10" />
    <radialGradient
       inkscape:collect="always"
       xlink:href="#linearGradient2454"
       id="radialGradient2460"
       cx="4022.8572"
       cy="5451.2656"
       fx="4022.8572"
       fy="5451.2656"
       r="3559.865"
       gradientTransform="matrix(-0.1071067,-0.1166362,0.1377765,-7.0459663e-2,276.61943,1452.439)"
       gradientUnits="userSpaceOnUse" />
  </defs>
  <sodipodi:namedview
     id="base"
     pagecolor="#ffffff"
     bordercolor="#666666"
     borderopacity="1.0"
     gridtolerance="10000"
     guidetolerance="10"
     objecttolerance="10"
     inkscape:pageopacity="0.0"
     inkscape:pageshadow="2"
     inkscape:zoom="0.49497475"
     inkscape:cx="403.89421"
     inkscape:cy="477.41913"
     inkscape:document-units="px"
     inkscape:current-layer="layer1"
     showgrid="false"
     inkscape:window-width="1680"
     inkscape:window-height="978"
     inkscape:window-x="1307"
     inkscape:window-y="24" />
  <metadata
     id="metadata7">
    <rdf:RDF>
      <cc:Work
         rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type
           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g
     inkscape:label="Layer 1"
     inkscape:groupmode="layer"
     id="layer1">
    <rect
       style="fill:#0000ff;fill-rule:evenodd;stroke:#000000;stroke-width:0.10674229px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
       id="rect2403"
       width="836.00311"
       height="815.66479"
       x="144.90677"
       y="154.41733" />
    <path
       style="fill:url(#radialGradient2460);fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0.10674229px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
       d="M 492.29996,1003.8047 C 992.20722,1001.6971 989.38289,999.5894 992.20722,997.48173 C 995.03156,995.37408 992.20722,124.91007 992.20722,124.91007 L 113.83908,124.91007 L 122.31209,1012.2353 L 492.29996,1003.8047 z"
       id="path2382" />
    <g
       sodipodi:type="inkscape:box3d"
       style="fill:#800000;fill-opacity:1"
       id="g2392"
       inkscape:perspectiveID="#perspective10"
       inkscape:corner0="-0.94081067 : 0.17266027 : 0 : 1"
       inkscape:corner7="-0.94348241 : 0.15857352 : 0.25 : 1">
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2402"
         style="fill:#afafde;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="13"
         d="M 876.40947,160.66071 L 913.12582,161.89944 L 324.68925,139.51689 L 322.74524,139.47316 L 876.40947,160.66071 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2400"
         style="fill:#d7d7ff;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="14"
         d="M 913.12582,138.91648 L 913.12582,161.89944 L 324.68925,139.51689 L 324.68925,135.27915 L 913.12582,138.91648 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2404"
         style="fill:#e9e9ff;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="11"
         d="M 322.74524,135.27204 L 324.68925,135.27915 L 324.68925,139.51689 L 322.74524,139.47316 L 322.74524,135.27204 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2396"
         style="fill:#4d4d9f;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="5"
         d="M 876.40947,138.71518 L 913.12582,138.91648 L 324.68925,135.27915 L 322.74524,135.27204 L 876.40947,138.71518 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2394"
         style="fill:#353564;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="6"
         d="M 876.40947,138.71518 L 876.40947,160.66071 L 322.74524,139.47316 L 322.74524,135.27204 L 876.40947,138.71518 z" />
      <path
         sodipodi:type="inkscape:box3dside"
         id="path2398"
         style="fill:#8686bf;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:round;stroke-opacity:1"
         inkscape:box3dsidetype="3"
         d="M 876.40947,138.71518 L 913.12582,138.91648 L 913.12582,161.89944 L 876.40947,160.66071 L 876.40947,138.71518 z" />
    </g>
    <rect
       style="fill:#800000;fill-opacity:1"
       id="rect2448"
       width="36.716354"
       height="14.753627"
       x="432.98892"
       y="103.83346" />
    <rect
       style="fill:#800000;fill-opacity:1"
       id="rect2450"
       width="22.594679"
       height="16.861288"
       x="133.60942"
       y="101.7258" />
    <rect
       style="fill:#800000;fill-opacity:1"
       id="rect2452"
       width="22.594679"
       height="6.3229828"
       x="949.84222"
       y="97.510475" />
  </g>
</svg>

到 102.4x102.4 SVG?如果它不丢掉 SVG 的片段,那就太好了(这排除了 libsvgbin2,尽管它很接近)。

【问题讨论】:

  • “调整 SVG 大小”是什么意思?由于它是矢量描述(S 表示“可缩放”),因此没有以像素为单位的实际大小......例如,如果您想在浏览器中更改 SVG 显示的大小(以像素为单位),您可以只需更改 元素的“宽度”和“长度”属性
  • @ThibThib - 通过调整大小,我的意思是更改根元素的大小高度、宽度和视图框属性,以及 svg 中所有组/路径的坐标参数。单纯的客户端翻译是行不通的,因为所讨论的库与 OSX 上的 Java 1.5.0_19 存在病态交互,如果这些属性最初太大,则会导致径向渐变分配大量内存。
  • 改变根元素的高宽属性还不够?
  • @ThibThib - 显然这不会改变 svg 中路径的大小,只会导致 svg 渲染器混淆。 svg 中的所有坐标值也必须更改(这可以在 inkscape gui 中轻松完成,但我需要一些可以编写脚本的东西)。
  • 请发布相关 SVG 的精简示例,以帮助人们理解问题。或者您提到的 OSX 上 Java 中的(假设已知,报告?)错误的链接。

标签: scripting matrix svg


【解决方案1】:

你可以替换

<g 

<g transform="scale(0.5)"

这应该将所有内容缩放 50%。

【讨论】:

    【解决方案2】:

    我会使用Apache Batik Toolkit 编写一个小 Java 应用程序,它会贯穿您的 SVG 文档树并转换所有元素。

    【讨论】:

      【解决方案3】:

      viewBox svg 元素标签中的属性,用于缩放,或者您可以说缩放整个 svg 画布。例如

      <svg
         xmlns="http://www.w3.org/2000/svg"
         width="1024.09"
         height="1024.36"
         id="svg2"
         viewBox = "0 0 300 300">
      

      这里在 viewBox 中,0、0 分别代表新的 x 和 y,300、300 代表画布的新宽度和新高度。

      【讨论】:

        【解决方案4】:

        只需使用文本编辑器调整svg 标签的widthheight 属性:

        <svg
           ...
           width="102.409"
           height="102.436"
        ...
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2011-04-06
          相关资源
          最近更新 更多