MediaPipe+three实现摄像头识别手势控制圣诞树粒子动画缩放旋转代码

代码语言:html

所属分类:粒子

代码描述:MediaPipe+three实现摄像头识别手势控制圣诞树粒子动画缩放旋转代码

代码标签: MediaPipe three 摄像头 识别 手势 控制 圣诞树 粒子 动画 缩放 旋转 代码

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>AI Magic Christmas Tree</title>
    <script src="https://cdn.jsdelivr.net/npm/@mediapipe/camera_utils/camera_utils.js" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/@mediapipe/hands/hands.js" crossorigin="anonymous"></script>
    <style>
        body { margin: 0; overflow: hidden; background-color: #000; font-family: 'Times New Roman', serif; }
        .input_video { position: absolute; top: 10px; right: 10px; width: 180px; height: 135px; border-radius: 12px; border: 2px solid #ffcc00; z-index: 10; transform: scaleX(-1); }
        #loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #ffcc00; font-size: 20px; text-align: center; z-index: 20; }
        #status-panel { position: absolute; bottom: 20px; left: 20px; color: #ffcc00; background: rgba(0,0,0,0.6); padding: 15px; border-radius: 8p.........完整代码请登录后点击上方下载按钮下载查看

网友评论0