如何使用Python围绕中心缩放SVG文件中的path元素
问题:SVG元素围绕自身中心缩放的实现
我用Inkscape制作的SVG文件里有一个带唯一ID的path元素,想要围绕它自身的中心进行缩放。
初始效果:
包含笑脸图案的SVG,目标path元素为笑脸的嘴巴
我已知该元素的ID,使用svgutils编写了缩放代码:
import svgutils.transform as sg fig = sg.fromfile('smile.svg') mouth = fig.find_id('path1069') factor = 1.25 mouth.scale(factor) fig.save('smile-fail.svg')
但实际缩放结果是围绕整个SVG画布的左上角进行的,效果不符合预期:
嘴巴被缩放后偏离了笑脸的中心位置,整体偏移明显
我期望达到的是Inkscape中按住SHIFT+CTRL键缩放时的效果:
嘴巴围绕自身中心放大,位置保持在笑脸的正确区域内
对应的SVG代码如下:
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <!-- Created with Inkscape (http://www.inkscape.org/) --> <svg width="200" height="200" viewBox="0 0 200 200" version="1.1" id="svg5" inkscape:version="1.2.2 (732a01da63, 2022-12-09)" sodipodi:docname="smile.svg" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"> <sodipodi:namedview id="namedview7" pagecolor="#ffffff" bordercolor="#eeeeee" borderopacity="1" inkscape:showpageshadow="0" inkscape:pageopacity="0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#ffffff" inkscape:document-units="px" showgrid="false" inkscape:zoom="2" inkscape:cx="125.5" inkscape:cy="87" inkscape:current-layer="layer1" /> <defs id="defs2"> <pattern inkscape:collect="always" patternUnits="userSpaceOnUse" width="2" height="2" patternTransform="translate(0,0) scale(10,10)" id="Checkerboard" inkscape:stockid="Checkerboard" inkscape:isstock="true"> <rect style="fill:black;stroke:none" x="0" y="0" width="1" height="1" id="rect1912" /> <rect style="fill:black;stroke:none" x="1" y="1" width="1" height="1" id="rect1914" /> </pattern> </defs> <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1"> <rect style="fill:#aca694;fill-opacity:1;" id="rect403" width="200" height="100" x="-6.357829e-07" y="99.999367" /> <circle style="fill:#d1c7b4;fill-opacity:1;" id="path241" cx="97.803673" cy="94.830917" r="65.697899" /> <circle style="fill:url(#Checkerboard);fill-opacity:1;opacity:0.1" id="circle2820" cx="97.803673" cy="94.830917" r="65.697899" /> <circle style="fill:#fff7e7;fill-opacity:1" id="path1011" cx="77.145447" cy="70.418861" r="14.504185" /> <circle style="fill:#fff7e7;fill-opacity:1" id="circle1013" cx="119.08147" cy="68.001495" r="16.921549" /> <path style="fill:#fff7e7;fill-opacity:1" d="m 80,100 40,5 c 0,0 3.69099,14.51519 -20,15 -23.690996,0.4848 -20,-20 -20,-20 z" id="path1069" sodipodi:nodetypes="cczc" /> <circle style="fill:#292827;fill-opacity:1" id="circle1512" cx="79.523659" cy="70.418861" r="7.3695707" /> <circle style="fill:#292827;fill-opacity:1" id="circle1514" cx="118.02084" cy="67.892021" r="9.8964138" /> </g> </svg>
内容的提问来源于stack exchange,提问作者qubodup
相关产品推荐
相关产品推荐

