缩放使用 inkscape 生成的 SVG
Scaling SVG produced with inkscape
我正在尝试调整使用 inkscape 生成的 this SVG 文件的大小
我曾尝试在 <svg/>
中使用 viewBox="0 0 h w"
属性,但它会裁剪图像而不是调整大小。感谢期待
svg/@viewBox 属性控制在视口内显示的坐标范围(svg 占据的屏幕区域)。
视口的大小主要由 svg/@width 和 svg/@height 属性决定 - 请参阅 https://www.w3.org/TR/SVG/coords.html
The ‘width’ attribute on the outermost svg element establishes the viewport's width [...], if there are positioning properties specified on the referencing element or on the outermost svg element that are sufficient to establish the height of the viewport, then these positioning properties establish the viewport's height; otherwise, the ‘height’ attribute on the outermost svg element establishes the viewport's height.
Inkscape 不会向其生成的文件添加 viewBox
属性。缩放工作需要该属性。
解决方案是将 width
和 height
值转换为 viewBox,然后更改宽度和高度。
所以将以下内容添加到您的根 <svg>
标签中:
viewBox="0 0 205 69"
然后改变你的width/height。如果你想要双倍尺寸,你可以这样做:
width="410" height="138"
或者,如果您希望它填充页面或其父容器,您可以这样做:
width="100%" height="100%"
<!-- 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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="0 0 205 69"
width="100%"
height="100%"
id="svg2985"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="official.svg">
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.88"
inkscape:cx="268.4359"
inkscape:cy="163.44054"
inkscape:current-layer="layer1"
inkscape:document-units="px"
showgrid="false"
inkscape:window-width="1301"
inkscape:window-height="744"
inkscape:window-x="65"
inkscape:window-y="24"
inkscape:window-maximized="1">
<sodipodi:guide
id="guide3594"
position="0,370.82039325"
orientation="0,800.0" />
<sodipodi:guide
id="guide3596"
position="0,229.17960675"
orientation="0,800.0" />
<sodipodi:guide
id="guide3598"
position="494.427191,0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3600"
position="305.572809,0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3602"
position="0,600.0"
orientation="0,800.0" />
<sodipodi:guide
id="guide3604"
position="600.0,0"
orientation="0,800.0" />
<sodipodi:guide
id="guide3606"
position="0,800.0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3608"
position="800.0,0"
orientation="600.0,0" />
</sodipodi:namedview>
<defs
id="defs2987" />
<metadata
id="metadata2990">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
id="layer1"
inkscape:label="Layer 1"
inkscape:groupmode="layer"
transform="translate(0,-531)">
<path
sodipodi:type="star"
style="fill:#008080;fill-opacity:1;fill-rule:evenodd;stroke:#008080;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816078"
inkscape:transform-center-y="-0.012778438"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,212.00937,543.99054)" />
<path
sodipodi:type="star"
style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003-6"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816118"
inkscape:transform-center-y="-0.012779205"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,213.12005,546.20636)" />
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#576a6c;fill-opacity:1;stroke:none;font-family:Century Schoolbook L;-inkscape-font-specification:Century Schoolbook L Medium"
x="2.427422"
y="563.2641"
id="text3791"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3793"
x="2.427422"
y="563.2641"
style="font-size:36.57227707px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;word-spacing:0px;fill:#576a6c;fill-opacity:1;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">Akogun</tspan></text>
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="186.45212"
y="409.6254"
id="text5280"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan5282"
x="186.45212"
y="409.6254" /></text>
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#008080;fill-opacity:0.50196078;stroke:none;font-family:Sans"
x="49.39143"
y="567.16937"
id="text5284"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan5286"
x="49.39143"
y="567.16937" /><tspan
sodipodi:role="line"
id="tspan5288"
x="49.39143"
y="584.67633"
style="font-size:13.20665646px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;fill:#008080;fill-opacity:0.50196078;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">P o l y m a t h</tspan></text>
<path
sodipodi:type="star"
style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003-6-5"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816136"
inkscape:transform-center-y="-0.012761026"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,214.3031,538.55495)" />
<flowRoot
xml:space="preserve"
id="flowRoot3053"
style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
id="flowRegion3055"><rect
id="rect3057"
width="598"
height="182"
x="102"
y="144" /></flowRegion><flowPara
id="flowPara3059" /></flowRoot> <flowRoot
style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
id="flowRoot3296"
xml:space="preserve"
transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
id="flowRegion3298"><rect
y="164"
x="30"
height="218"
width="502"
id="rect3300" /></flowRegion><flowPara
id="flowPara3302" /></flowRoot> </g>
</svg>
我正在尝试调整使用 inkscape 生成的 this SVG 文件的大小
我曾尝试在 <svg/>
中使用 viewBox="0 0 h w"
属性,但它会裁剪图像而不是调整大小。感谢期待
svg/@viewBox 属性控制在视口内显示的坐标范围(svg 占据的屏幕区域)。
视口的大小主要由 svg/@width 和 svg/@height 属性决定 - 请参阅 https://www.w3.org/TR/SVG/coords.html
The ‘width’ attribute on the outermost svg element establishes the viewport's width [...], if there are positioning properties specified on the referencing element or on the outermost svg element that are sufficient to establish the height of the viewport, then these positioning properties establish the viewport's height; otherwise, the ‘height’ attribute on the outermost svg element establishes the viewport's height.
Inkscape 不会向其生成的文件添加 viewBox
属性。缩放工作需要该属性。
解决方案是将 width
和 height
值转换为 viewBox,然后更改宽度和高度。
所以将以下内容添加到您的根 <svg>
标签中:
viewBox="0 0 205 69"
然后改变你的width/height。如果你想要双倍尺寸,你可以这样做:
width="410" height="138"
或者,如果您希望它填充页面或其父容器,您可以这样做:
width="100%" height="100%"
<!-- 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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="0 0 205 69"
width="100%"
height="100%"
id="svg2985"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="official.svg">
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.88"
inkscape:cx="268.4359"
inkscape:cy="163.44054"
inkscape:current-layer="layer1"
inkscape:document-units="px"
showgrid="false"
inkscape:window-width="1301"
inkscape:window-height="744"
inkscape:window-x="65"
inkscape:window-y="24"
inkscape:window-maximized="1">
<sodipodi:guide
id="guide3594"
position="0,370.82039325"
orientation="0,800.0" />
<sodipodi:guide
id="guide3596"
position="0,229.17960675"
orientation="0,800.0" />
<sodipodi:guide
id="guide3598"
position="494.427191,0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3600"
position="305.572809,0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3602"
position="0,600.0"
orientation="0,800.0" />
<sodipodi:guide
id="guide3604"
position="600.0,0"
orientation="0,800.0" />
<sodipodi:guide
id="guide3606"
position="0,800.0"
orientation="600.0,0" />
<sodipodi:guide
id="guide3608"
position="800.0,0"
orientation="600.0,0" />
</sodipodi:namedview>
<defs
id="defs2987" />
<metadata
id="metadata2990">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
id="layer1"
inkscape:label="Layer 1"
inkscape:groupmode="layer"
transform="translate(0,-531)">
<path
sodipodi:type="star"
style="fill:#008080;fill-opacity:1;fill-rule:evenodd;stroke:#008080;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816078"
inkscape:transform-center-y="-0.012778438"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,212.00937,543.99054)" />
<path
sodipodi:type="star"
style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003-6"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816118"
inkscape:transform-center-y="-0.012779205"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,213.12005,546.20636)" />
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-variant:normal;font-weight:500;font-stretch:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#576a6c;fill-opacity:1;stroke:none;font-family:Century Schoolbook L;-inkscape-font-specification:Century Schoolbook L Medium"
x="2.427422"
y="563.2641"
id="text3791"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan3793"
x="2.427422"
y="563.2641"
style="font-size:36.57227707px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;word-spacing:0px;fill:#576a6c;fill-opacity:1;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">Akogun</tspan></text>
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
x="186.45212"
y="409.6254"
id="text5280"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan5282"
x="186.45212"
y="409.6254" /></text>
<text
xml:space="preserve"
style="font-size:16.25434494px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#008080;fill-opacity:0.50196078;stroke:none;font-family:Sans"
x="49.39143"
y="567.16937"
id="text5284"
sodipodi:linespacing="125%"><tspan
sodipodi:role="line"
id="tspan5286"
x="49.39143"
y="567.16937" /><tspan
sodipodi:role="line"
id="tspan5288"
x="49.39143"
y="584.67633"
style="font-size:13.20665646px;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;fill:#008080;fill-opacity:0.50196078;font-family:Ubuntu;-inkscape-font-specification:Ubuntu">P o l y m a t h</tspan></text>
<path
sodipodi:type="star"
style="fill:#241f1c;fill-opacity:0.33333333;fill-rule:evenodd;stroke:#000000;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.03921569"
id="path3003-6-5"
sodipodi:sides="3"
sodipodi:cx="208.33333"
sodipodi:cy="448.33334"
sodipodi:r1="329.16138"
sodipodi:r2="164.5807"
sodipodi:arg1="0.57255439"
sodipodi:arg2="1.6197519"
inkscape:flatsided="true"
inkscape:rounded="0.15947024"
inkscape:randomized="0"
d="M 484.99998,626.66667 C 435.74244,703.08492 -42.889814,679.63445 -84.441188,598.76703 -125.99256,517.89962 133.63227,115.11717 224.44119,119.56633 c 90.80892,4.44916 309.81634,430.68209 260.55879,507.10034 z"
inkscape:transform-center-x="-8.8816136"
inkscape:transform-center-y="-0.012761026"
transform="matrix(0.00520436,0.0991022,-0.10795132,0.00477775,214.3031,538.55495)" />
<flowRoot
xml:space="preserve"
id="flowRoot3053"
style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
id="flowRegion3055"><rect
id="rect3057"
width="598"
height="182"
x="102"
y="144" /></flowRegion><flowPara
id="flowPara3059" /></flowRoot> <flowRoot
style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
id="flowRoot3296"
xml:space="preserve"
transform="matrix(0.40635864,0,0,0.40635864,0.801987,362.21684)"><flowRegion
id="flowRegion3298"><rect
y="164"
x="30"
height="218"
width="502"
id="rect3300" /></flowRegion><flowPara
id="flowPara3302" /></flowRoot> </g>
</svg>