修改SVG路径
修改SVG路径
提问于 2015-11-13 10:00:14
几个小时以来，我一直试图通过编辑path元素来编辑SVG，但是我无法得到我想要的结果：
代码如下所示：
<svg viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" class="circle style-scope iron-icon" style="pointer-events: none; display: block; width: 24px; height: 24px;">
<g class=" style-scope iron-icon">
<path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" class="style-scope iron-icon">
</path>
</g>
</svg>呈现的图形如下所示：
我想要做的是编辑内部的黑圈；我需要删除圆圈的右半部分。
我搜索的网站，解释如何做，但我没有发现任何帮助。
是否可以将代码粘贴到SVG编辑器中，然后编辑图像并取回代码？
我们将非常感谢您的帮助。
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-11-13 10:36:06
用四个三次Bezier曲线命令绘制内圆。只需删除绘制内部圆圈右侧的两个命令即可。
<svg viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" class="circle style-scope iron-icon" style="pointer-events: none; display: block; width: 24px; height: 24px;">
<g class=" style-scope iron-icon">
<path d="M12 7 c-2.76 0-5 2.24-5 5 s2.24 5 5 5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" class="style-scope iron-icon">
</path>
</g>
</svg>关于三次Bezier曲线命令的描述可以在：http://www.w3.org/TR/SVG/paths.html#PathDataCubicBezierCommands中找到
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33690067
复制相关文章
相似问题
腾讯云开发者
