web3d-three.js场景设计器-mesh网格添加多模型-模型描述随动

给场景中的模型加上广告牌描述,可以在模型的MESH里添加Sprite,配上相应的文字,

描述Sprite的位置则是在mesh中的相对位置,比如模型高10,那么我们可以给一个y等于10 来进行适配,这样在移动模型mesh网格时可以整体移动。

function createBox(data) {

const geometry = new THREE.BoxGeometry(data.width, data.height, data.length)

var material

var materials = \[\]

if (data.groundTexture && data.groundTexture != '') {

const textures = data.groundTextures ? data.groundTextures : \[\]

if (textures.length > 1) {

textures.forEach(element => {

if(element==''){

const tmpMaterial = new THREE.MeshStandardMaterial({

color: data.color,

opacity: data.opacity,

transparent: data.opacity < 1,

roughness: 1.0,

metalness: 0.0

})

materials.push(tmpMaterial)

}else{

var map = new THREE.TextureLoader().load(element)

map.wrapS = data.wrapType

map.wrapT = data.wrapType

map.repeat.set(data.repeatX, data.repeatY)

const tmpMaterial = new THREE.MeshStandardMaterial({

map: map

})

materials.push(tmpMaterial)

}

})

} else {

var map = new THREE.TextureLoader().load(data.groundTexture)

map.wrapS = data.wrapType

map.wrapT = data.wrapType

map.repeat.set(data.repeatX, data.repeatY)

material = new THREE.MeshStandardMaterial({

map: map

})

}

} else {

material = new THREE.MeshStandardMaterial({

color: data.color,

opacity: data.opacity,

transparent: data.opacity < 1,

roughness: 1.0,

metalness: 0.0

})

}

const box = new THREE.Mesh(geometry, materials.length > 0 ? materials : material)

// 创建立方体描述

if(data.text&&data.text!='')

createSprite({text:data.text, fontSize:100, textColor: '#ffffff', color: '#1781b5', imageUrl:''

,position:{x:0, y:0, z:0},rotate:{x:0, y:0, z:0},scale:{x:1, y:1, z:1}}).then(sprite=>{

sprite.position.y=data.height;

sprite.visible=true;

sprite.userData.text=data.text;

box.add(sprite)

})

box.name = data.name

box.castShadow = true

box.userData.height = data.height

return box

}

相关推荐
对空六课37 分钟前
两个统计平台数据不同:用同一时间窗和事件样本做差异定位
大数据·前端·网络·数据库
白帽攻防录8 小时前
SRC 挖洞:PostScript 打印机驱动双 RCE,打印服务器怎么变成内网跳板
开发语言·网络安全·php·内网安全
十年Java程序媛8 小时前
Java枚举Enum完整教程|替代静态常量,开发与面试要点
java·开发语言·spring boot·后端·面试
2603_965148119 小时前
电商选品调研:通过关键词搜索API获取市场热销商品,结合商品详情API分析竞品卖点与定价
开发语言·数据库·人工智能·python·信息可视化
lpfasd1239 小时前
node-sass 停止维护!老项目迁移 Dart Sass 完整教程
前端·rust·sass
xixiaoyunya9 小时前
Python 异步编程入门:用 asyncio 轻松实现并发任务
开发语言·python·php
学逆向的9 小时前
C 循环结构的执行效率分析
c语言·开发语言·数据结构·网络安全
小坏讲微服务10 小时前
刚发布一个月的JDK 27,为什么我建议你立刻升级?
java·开发语言·spring boot·spring·架构·求职招聘·springboot4
Data analyse45611 小时前
rnweb 回放数据量太大怎么办?分片存储与断点续传的实现思路
前端·网络·算法·数据分析
xiaogai_gai11 小时前
金蝶收料通知单查询策略实战教程:从源系统拉取到中间层落地的完整路径
java·前端·数据库