绘制平滑的曲线

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我是根据前后点距离,乘以前后线段法向量的角平分线的垂线,如果点的距离非常均匀,这种曲线绘制出来的就发出优美。

相关推荐
华玥作者1 小时前
[特殊字符] VitePress 对接 Algolia AI 问答(DocSearch + AI Search)完整实战(下)
前端·人工智能·ai
Mr Xu_1 小时前
告别冗长 switch-case:Vue 项目中基于映射表的优雅路由数据匹配方案
前端·javascript·vue.js
前端摸鱼匠1 小时前
Vue 3 的toRefs保持响应性:讲解toRefs在解构响应式对象时的作用
前端·javascript·vue.js·前端框架·ecmascript
lang201509282 小时前
JSR-340 :高性能Web开发新标准
java·前端·servlet
好家伙VCC2 小时前
### WebRTC技术:实时通信的革新与实现####webRTC(Web Real-TimeComm
java·前端·python·webrtc
未来之窗软件服务3 小时前
未来之窗昭和仙君(六十五)Vue与跨地区多部门开发—东方仙盟练气
前端·javascript·vue.js·仙盟创梦ide·东方仙盟·昭和仙君
嘿起屁儿整3 小时前
面试点(网络层面)
前端·网络
VT.馒头3 小时前
【力扣】2721. 并行执行异步函数
前端·javascript·算法·leetcode·typescript
phltxy4 小时前
Vue 核心特性实战指南:指令、样式绑定、计算属性与侦听器
前端·javascript·vue.js
Byron07075 小时前
Vue 中使用 Tiptap 富文本编辑器的完整指南
前端·javascript·vue.js