Vue-three-sdt NPM

vue-three-sdt

一个支持Vue3的展示三维模型的Vue组件，支持fbx，glb，json文件。 ##2.1.0 优化代码

2.0.7

修复动画类报错问题

2.0.6

增加点击风门等模型显示弹窗,组件参数dataMes(风门等),windDataMes(传感器) 去除自动添加风门等模型,添加风门等模型返回参数中添加setModelType参数，调用class类editModel中的addSmallModel方法传参{x: event.point.x,y: event.point.y,z: event.point.z},event.object,event.setModelType,{自定义数据} 添加后模型增加modelMes参数

2.0.5

修复材质警告

2.0.1

1.添加巷道时根据原巷道材质设置新增巷道 2.修改节点材质 3.增加基础模型大小，standSize,默认为1 4.合并两个工具类editModel.js和subVectors.js，拆分editModel.js为animModel.js和editModel.js 5.新增将FBX转为json

Install

using npm

npm i vue-three-sdt

使用

<template>
  <model-minix src="example/models/obj/LeePerrySmith.obj"></model-minix>
</template>
<script>
import { modelMinix } from 'vue-three-sdt';
export default {
  components: { modelMinix }
}
</script>

Documents

props

prop	type	default	example
src	string	-	'./exapmle.obj'
width	number	-	300
height	number	-	300
position	object	{ x: 0, y: 0, z: 0 }	{ x: 100, y: 20, z: -10 }
rotation	object	{ x: 0, y: 0, z: 0 }	{ x: Math.PI / 2, y: 0, z: - Math.PI / 4 }
cameraPosition	object	{ x: 0, y: 0, z: 0 }	{ x: 1, y: 2, z: -3 }
cameraRotation	object	{ x: 0, y: 0, z: 0 }	{ x: 3, y: 2, z: -1 }
scale	object	{ x: 1, y: 1, z: 1 }	{ x: 2, y: 2, z: 3 }
lights	array	-
backgroundColor	number/string	0xffffff	0xffffff/'#f00'/'rgb(255,255,255)'
backgroundAlpha	number	1	0.5
controlsOptions	object	-	see OrbitControls Properties
crossOrigin	string	anonymous	anonymous/use-credentials
outputEncoding	number	THREE.LinearEncoding	see WebGLRenderer OutputEncoding
glOptions	object	{ antialias: true, alpha: true }	see WebGLRenderer Parameters
labelList	Array	[]	风量数据 {text: '32m³/min',name: '120-119', num: 32}
isEdit	Boolean	false	是否开启编辑页面
rwColorNums	Array	261.3, 52.8, 27.5, 9.6, 0.6, 0	根据风量改变巷道颜色

events

event
on-click	单击
on-load	加载完成
on-progress	正在加载
on-error	错误
on-dblclick	双击
end-draw	结束绘制,返回新增模型和拆分模型[[],[]]
on-cartoon	返回控制动画类
on-model	返回模型操作类
delete-model	删除模型，返回删除模型名称
save-model	保存模型