如何用JS仿照3D手办模型展台实现示例制作长尾词？

本文共计437个文字，预计阅读时间需要2分钟。

目录 + 前言 + 效果预览 + 代码片段 + 样式 + 脚本 + 核心技术 + 获取旋转角度 + 监听事件 + 触摸事件 + 事件，通过开始、结束坐标计算移动方向 + 数据坐标计算移动方向 + PC端支持触摸事件 + 前言 + 近几年实现的创新

目录

• 前言
• 效果预览
• 代码片段
• style
• Script
• 核心科技
• 获取旋转角度
• 监听 touch 事件，通过开始、结束坐标计算移动方向
• 根据坐标计算移动方向
• PC端支持 touch 事件

前言

前几年实现的一个 demo 效果，今天翻出来整理下，给大家提供类似场景参考思路。

当时的需求场景是需要 3D 展示手办模型，但是因为甲方预算有限，问有没有其他青春版（性价比）方案。

刚好那段时间在处理 lottie 动画跳帧的问题，就提出了给模型拍个全身照，旋转的时候逐帧播放达到模拟手办模型旋转的动画效果。

众所周知，帧率越高，单位时间内图像帧的个数就会越多，对应动画效果就会越流畅，当然了，对应需要准备的模型素材也就越多。

效果预览

代码片段

为了省流，这里没有预渲染图片资源，