babylonjs基于自定义网格生成围栏动画

效果:

javascript 复制代码
import { Vector3, Mesh, MeshBuilder, StandardMaterial, Texture, Animation, Color3 } from "@babylonjs/core";
import imgUrl from "./image/headerwangge2.png"
// 创建模型护栏特效
export default class CreateRail {
    constructor(scene,) {
        this.scene = scene;
    };
    create() {
        let _position = [{x:1,y:1,z:1},{x:2,y:2,z:2}]
        if (_position.length <= 0) {
            return;
        }
        var mat = new StandardMaterial("mat", this.scene);
        mat.diffuseTexture = new Texture(imgUrl, this.scene);
        mat.diffuseTexture.vScale = 5;
        mat.diffuseTexture.hasAlpha = true;
        mat.backFaceCulling = false;
        mat.emissiveColor = Color3.White()
        const path = []
        for (let index = 0; index < _position.length - 1; index += 1) {
            path.push(new Vector3(_position[index].x, _position[index].y, _position[index].z));
            path.push(new Vector3(_position[index + 1].x, _position[index + 1].y, _position[index + 1].z));
        }
        let polygon = MeshBuilder.CreatePolygon("polygon", { shape: path, holes: [path], depth: 10, sideOrientation: Mesh.DOUBLESIDE }, this.scene);
        polygon.position.y = 10
        polygon.material = mat;
        Animation.CreateAndStartAnimation("ani", mat, "diffuseTexture.vOffset", 30, 20,
            1, 0, 1, undefined, undefined, this.scene);

    };

}

贴图 headerwangge2

相关推荐
小妖66637 分钟前
html 给文本两端加虚线自适应
前端·javascript·html
阿諪諪39 分钟前
Vue Router(1)
前端·javascript·vue.js
斗锋在干嘛1 小时前
WebView 与 JavaScript 的交互
开发语言·javascript·交互
天天进步20151 小时前
C++使用WebView2控件,通过IPC通信与Javascript交互
javascript·c++·交互
@PHARAOH1 小时前
HOW - 实现 useClickOutside 或者 useClickAway
前端·javascript·react.js
糟糕好吃2 小时前
如何用一个插件让你的 Taro 项目启动快 3 倍?
前端·javascript·微信小程序
前端_学习之路2 小时前
Vue--状态管理pinia
前端·javascript·vue.js
萌萌哒草头将军2 小时前
🔥🔥🔥MCP TypeScript SDK 初体验:挑战快速搭建一个 AI 应用!
前端·javascript·mcp
qq_316837752 小时前
uniapp 打包 H5 向 打包的APP 使用 @dcloudio/uni-webview-js 传值
开发语言·javascript·uni-app
冴羽yayujs2 小时前
SvelteKit 最新中文文档教程(19)—— 最佳实践之身份认证
前端·javascript·vue.js·react.js·前端框架·svelte·sveltekit