我能夠將兩個單獨的路徑合併到一起using this technique。不過,我的動畫仍然將它視爲兩條獨立的路徑。如何將兩個SVG路徑組合在一起(不含空格)
有沒有方法來結合這兩條路徑而不使用空格?
M3322.09,361.23V473.45c0,14,2,23.41,23.41,23.41H3809.63
M3809.63,496.31c21.41,0,166.41-1,166.41-1s13.07.87,82.08.87c31.75,0,63.51-36.21,95.26-75.31"/>
svg {
fill: none;
}
path {
stroke: tomato;
stroke-width: 100;
}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 25 14905 623">
<path d="M3322.09,361.23V473.45c0,14,2,23.41,23.41,23.41H3809.63 M3809.63,496.31c21.41,0,166.41-1,166.41-1s13.07.87,82.08.87c31.75,0,63.51-36.21,95.26-75.31"/>
</svg>
原本獨立的路徑可以查看這裏:
svg {
fill: none;
}
path {
stroke: tomato;
stroke-width: 100;
}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 25 14905 623">
<path d="M3322.09,361.23V473.45c0,14,2,23.41,23.41,23.41H3511.9" />
<path d="M3809.63,496.31c21.41,0,166.41-1,166.41-1s13.07.87,82.08.87c31.75,0,63.51-36.21,95.26-75.31" />
</svg>
我們的目標是要合併這些路徑匹配上面的svg片段 - 不使用路徑中的空格。