绘制平滑的曲线

CatmulRoom

js 复制代码
function clacCatmulRoom(t: number, p0: number, p1: number, p2: number, p3: number) {
  return 0.5 *
    (
      (2 * p1) +
      (p2 - p0) * t +
      (2 * p0 - 5 * p1 + 4 * p2 - p3) * t * t +
      (3 * p1 - p0 - 3 * p2 + p3) * t * t * t
    );
}

遇到的问题,在一条长直线之后,拐弯的地方很不自然

黑色的是用户输入点,红绿点是细分后的点,感觉应该是这个曲线函数的一个缺陷。

hermite 埃尔米特曲线

在线查看

这个曲线也有缺点,点1点2前后的点,如果距离非常远,就会导致点1和点2之间的驼峰

这个主要是控制点v0、v1没有控制好,但是这个v0、v1我是根据前后点距离,乘以前后线段法向量的角平分线的垂线,如果点的距离非常均匀,这种曲线绘制出来的就发出优美。

相关推荐
AI视觉网奇21 小时前
rknn yolo11 推理
前端·人工智能·python
gplitems12321 小时前
Gunslinger – Gun Store & Hunting WordPress Theme: A Responsible
开发语言·前端·javascript
wyzqhhhh1 天前
less和sass
前端·less·sass
Nan_Shu_6141 天前
学习:uniapp全栈微信小程序vue3后台-额外/精彩报错篇
前端·学习·微信小程序·小程序·uni-app·notepad++
excel1 天前
Vue3 中的双向链表依赖管理详解与示例
前端
前端小白从0开始1 天前
Chrome DevTools高级用法:性能面板内存泄漏排查
前端·chrome·chrome devtools
EveryPossible1 天前
带有渐变光晕
前端·javascript·css
jojo是只猫1 天前
Vue 3 开发的 HLS 视频流播放组件+异常处理
前端·javascript·vue.js
卓码软件测评1 天前
第三方软件登记测试机构:【软件登记测试机构HTML5测试技术】
前端·功能测试·测试工具·html·测试用例·html5
CS Beginner1 天前
【html】canvas实现一个时钟
前端·html