如何使svg模式在中可编辑？
如何使svg模式在中可编辑？
提问于 2022-08-29 15:04:03
这里是一个充满<pattern>的svg。
<svg width="600" height="180">
<defs>
<pattern id="carrot" patternUnits="userSpaceOnUse" width="50" height="50">
<path fill="darkorange" d="M30 13c-1-3-5-4-7-2h-1l1-11h-3l-1
9-4-7-3 1 5 8-8-4-1 2 9 5h-1c-2
2-3 5-2 7l2 2 5-3 1 2-5 3 8 9 5-3
2 2-5 3 12 14 3-2-8-25-5 3-1-2 5-3-3-8"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="lightgreen"/>
<rect width="100%" height="100%" fill="url(#carrot)"/>
</svg>
我尝试在中编辑这个svg，但是我发现这个模式不能被编辑。当我缩放这个svg时，图标的大小不会改变。当我移动svg时，模式将不会移动。我可以改变背景矩形的颜色，但不能改变图案的颜色。
目前的svg：
我想把这个模式作为svg的一部分，并在中编辑。例如，当我缩放svg时，模式的图标将相等地缩放。我可以改变图标的颜色之一。
预期svg：
您知道使用代码是否可以创建这样的svg吗？
更新:我尝试了patternUnits="objectBoundingBox"
<svg width="600" height="180">
<defs>
<pattern id="carrot" patternUnits="objectBoundingBox" width="0.1" height="0.3">
<path fill="darkorange" d="M30 13c-1-3-5-4-7-2h-1l1-11h-3l-1
9-4-7-3 1 5 8-8-4-1 2 9 5h-1c-2
2-3 5-2 7l2 2 5-3 1 2-5 3 8 9 5-3
2 2-5 3 12 14 3-2-8-25-5 3-1-2 5-3-3-8"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="lightgreen"/>
<rect width="100%" height="100%" fill="url(#carrot)"/>
</svg>
当我在Adobe中打开objectBoundingBox svg时，只有背景而没有模式。
当我设置patternContentUnits="objectBoundingBox"时，模式仍然无法编辑。
<svg width="600" height="180">
<defs>
<pattern id="carrot" patternContentUnits="objectBoundingBox" width="0.2" height="0.3">
<path fill="darkorange" d="M30 13c-1-3-5-4-7-2h-1l1-11h-3l-1
9-4-7-3 1 5 8-8-4-1 2 9 5h-1c-2
2-3 5-2 7l2 2 5-3 1 2-5 3 8 9 5-3
2 2-5 3 12 14 3-2-8-25-5 3-1-2 5-3-3-8" transform="scale(0.005)"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="lightgreen"/>
<rect width="100%" height="100%" fill="url(#carrot)"/>
</svg>
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-08-30 06:56:38
如果要在Illustrator中转换模式，则必须打开调色板“transform”中的选项：Transform both (或Transform Pattertn Only)：
如果您使用脚本来运行Illustrator来完成这项任务，我相信这个首选项可以通过脚本进行切换。如果你需要帮助请告诉我。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73530818
复制相关文章
相似问题
腾讯云开发者
