可拖拽配置3d地下停车场大屏

jstopo.top

js 复制代码
const createCarPark = (scene,obj)=>{//创建汽车模型car
    const arcFun = (point)=>{
        const R = 0.8; //圆弧半径
        const N = 80; //分段数量
        const sp = 2 * Math.PI / N;//两个相邻点间隔弧度
        // 批量生成圆弧上的顶点数据
        const arr = [];
        for (let i = 0; i < N; i++) {
            const angle =  sp * i;//当前点弧度
            // 以坐标原点为中心,在XOY平面上生成圆弧上的顶点数据
            const x = point.x + R * Math.cos(angle);
            const y = point.y + R * Math.sin(angle);
            arr.push([x, y]);
        }
        return arr;
    };
    const points = [
        [-11, 1.1],
        [-11, 2.8],
        [-9.6, 3.6],
        [-5, 3.6],
        [-3, 2.8],
        [-3, 1.1],
        ...arcFun({x: -4,y: 1.1}),
        [-6, 1.1],
        ...arcFun({x: -10,y: 1.1}),
    ];
    const vector2 = [];
    points.forEach(point=>{
        vector2.push(new THREE.Vector2(...point))
    })
    // Shape表示一个平面多边形轮廓
    const shape = new THREE.Shape([
        // 按照特定顺序,依次书写多边形顶点坐标
        ...vector2
    ]);
    const geometry = new THREE.ExtrudeBufferGeometry(
        shape,{
            depth: 4.2,
            bevelEnabled: true, //禁止倒角,默认true
            bevelThickness: 1, //倒角尺寸:拉伸方向
            bevelSize: 1, //倒角尺寸:垂直拉伸方向
            bevelSegments: 10, //倒圆角:倒角细分精度,默认3
        }
    );
    // 线材质
    const material = new THREE.MeshLambertMaterial({
        color: obj.color||0x55dae2, //模型颜色
        transparent: true,
        opacity: obj.opacity
    });
    const car = new THREE.Mesh(geometry,material);
    car.rotateY(Math.PI/2);
    car.position.set(...obj.position);
    scene.add(car);
}
相关推荐
excel30 分钟前
Vue3 中的双向链表依赖管理详解与示例
前端
谢尔登30 分钟前
【Nest】基本概念
javascript·node.js·express
前端小白从0开始1 小时前
Chrome DevTools高级用法:性能面板内存泄漏排查
前端·chrome·chrome devtools
EveryPossible1 小时前
带有渐变光晕
前端·javascript·css
jojo是只猫1 小时前
Vue 3 开发的 HLS 视频流播放组件+异常处理
前端·javascript·vue.js
卓码软件测评2 小时前
第三方软件登记测试机构:【软件登记测试机构HTML5测试技术】
前端·功能测试·测试工具·html·测试用例·html5
CS Beginner2 小时前
【html】canvas实现一个时钟
前端·html
林烈涛2 小时前
js判断变量是数组还是对象
开发语言·前端·javascript
Komorebi_99993 小时前
Unocss
开发语言·前端
goto_w3 小时前
前端实现复杂的Excel导出
前端·excel