将行转换为“；矩形蛇”；。帆布JavaScript

可能有人知道好的JavaScript库或画布绘制框架

我有以下问题：

1） 用徒手画一些线（如画笔/Photoshop铅笔）

2） 需要将线条转换为“矩形蛇”（使用固定宽度的矩形创建线条）

看截图

什么样的图书馆更适合这个问题？ 可能是某种库alredy具有此功能

我的意思是需要以下功能：

• 直线近似

• 样条分离

• 将直线转换为多边形/形状/对象

---

如果有人能帮助我，那就太好了。谢谢

正如您在问题中所说，您的点可以由一组三次贝塞尔曲线组成。提示：在计算剩余（较少）点的样条曲线之前，可能需要执行以下操作

以下是如何沿三次贝塞尔曲线计算一组矩形ish多边形。

旁注：多边形必须是矩形，因为不可能沿曲线路径创建一组边连接的矩形

沿曲线计算一组点

使用#1中的点，计算每个点的切线角

使用点和角度，计算从每个点向两个方向向外延伸的垂直线

使用垂直线的端点构建一组多边形。每个新多边形都是从先前的和当前的垂直端点构建的

这里是注释代码和演示：

//画布相关变量
var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
//定义三次贝塞尔曲线的变量
var-PI=Math.PI；
var PI2=PI*2；
var s={x:20，y:30}；
var c1={x:300，y:40}；
var c2={x:40，y:150}；
变量e={x:370，y:170}；
//沿贝塞尔曲线绘制的点阵列
var点=[]；
//沿贝塞尔曲线的多边形阵列
var polys=[]；
//沿曲线绘制一些点和切线角
对于（var t=0；tWith fixed width），您是指封闭曲线段的固定长度吗？