2009-07-07 54 views
1

有沒有辦法將.SVG從其當前尺寸(數千像素)重新縮放到更小的尺寸?我試過ImageMagick,但它對SVG漸變的支持太弱了,無法使用。是否有可用於調整SVG大小的腳本?

其目的是解決渲染庫中的一個錯誤,該錯誤有時會導致大像素大小的svgs分配大的柵格(在最終被平滑地重新調整爲實際顯示之前)。

例如,我怎樣才能改變這種1024x1024像素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的哪種規則,儘管它接近),它會很好。

+2

你所說的「調整一個SVG」呢?由於它是矢量描述(S代表「可擴展」),因此沒有像素的真實大小... 如果要在瀏覽器中更改SVG顯示的大小(以像素爲單位),例如,您可以更改元素的「寬度」和「長度」屬性 – ThibThib 2009-07-07 21:05:07

回答

1

我會使用Apache Batik Toolkit來編寫一個小的Java應用程序,它貫穿您的SVG文檔樹並轉換所有元素。

5

您可以用

<g transform="scale(0.5)" 

應該由50%比例的一切替換

<g 

0

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用於新寬度和新的畫布高度。

0

只是調整使用文本編輯器svg標籤的widthheight屬性:

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