three+openai兼容api实现对话修改编辑三维物体场景代码

代码语言:html

所属分类:三维

代码描述:three+openai兼容api实现对话修改编辑三维物体场景代码

代码标签: three openai 兼容 api 对话 修改 编辑 三维 物体 场景 代码

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

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Three.js + OpenAI 3D Editor</title>
    <style>
        body { margin: 0; overflow: hidden; font-family: sans-serif; }
        #canvas-container { width: 100vw; height: 100vh; display: block; }
        
        /* 聊天界面样式 */
        #ui-container {
            position: absolute;
            bottom: 20px;
            left: 20px;
            width: 350px;
            background: rgba(255, 255, 255, 0.9);
            padding: 15px;
            border-radius: 8px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        #chat-history {
            height: 200px;
            overflow-y: auto;
            border: 1px solid #ccc;
            padding: 10px;
            border-radius: 4px;
            font-size: 14px;
            background: #f9f9f9;
        }
        .msg { margin-bottom: 8px; }
        .msg.user { color: #007bff; font-weight: bold; }
        .msg.ai { color: #333; }
        .msg.system { color: #888; font-style: italic; font-size: 12px; }
        
        #input-area { display: flex; gap: 5px; }
        input { flex: 1; padding: 8px; border: 1px solid #c.........完整代码请登录后点击上方下载按钮下载查看

网友评论0