SVG 分别用Polygon和Path画出的小鸭

绘制曲线使用Polygon可以获得更高的性能（使用更少的参照点和绘制动作）和平滑度。画曲线的指令为C，含3个参数，依次为控制点1和控制点2，以及终点坐标。

《three.js如何实现贴图模糊效果 - 使用canvas》申请公开！

第三方库
作品简介 1817
作品推荐
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

编译

CSS

HTML

<?xml version="1.0" standalone="no" ?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"https://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<div style="position: absolute; left: 50%">
    <svg width="100%" height=600px version="1.1" xmlns="https://www.w3.org/2000/svg">
        <path d="M 0 312  
C 40 360 120 280 160 306 C 160 306 165 310 170 303  
C 180 200 220 220 260 261 C 260 261 280 273 290 268  
C 288 280 272 285 250 285 C 195 283 210 310 230 320  
C 260 340 265 385 200 391 C 150 395 30 395 0 312 Z" />
    </svg>
</div>

绘制曲线使用Polygon可以获得更高的性能（使用更少的参照点和绘制动作）和平滑度。画曲线的指令为C，含3个参数，依次为控制点1和控制点2，以及终点坐标。

编辑器支持Emmet

快捷键

绘制曲线使用Polygon可以获得更高的性能（使用更少的参照点和绘制动作）和平滑度。 画曲线的指令为C，含3个参数，依次为控制点1和控制点2，以及终点坐标。

分别使用SVG path和CSS3 motion-path实现的粒子漂浮动画

使用three.js和PlaneBufferGeometry构建的3d交互波浪背景动画

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：

绘制曲线使用Polygon可以获得更高的性能（使用更少的参照点和绘制动作）和平滑度。画曲线的指令为C，含3个参数，依次为控制点1和控制点2，以及终点坐标。