凡拓FT-E数字孪生平台

Appearance

复制
还原
运行
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>透视模式</title>
<style>
* {
margin: 0;
padding: 0;
}

html,
body {
width: 100%;
height: 100%;
}

#three-container {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}

</style>
</head>

<body>
<div id="three-container"></div>
<script src="../../public/lib/ftthree.js"></script>
<script src="../../public/lib/dat.gui.min.js"></script>
<script>
let container = document.getElementById('three-container');
let viewer = new ftthree.Viewer(container, {
center: [0, 0],
height: 400
});
window.viewer = viewer;
viewer.cameraControl.camera.position.set(-554,379,616);
viewer.cameraControl.update();
viewer.cameraControl.maxDistance = 1000;
viewer.cameraControl.controls.target.set(0, 100, 0);
const skySphereBox = ftthree.SkyUtils.createSphereSkyBox(
10000,
'https://www.frontop.cloud/public/ftthree_resource/images/skybox/7.jpg',
).then(skySphereBox => {
skySphereBox.name = 'skybox';
viewer.scene.add(skySphereBox);
});
let explode = null;
const list = []; //需要切换的模型数组
const glbLayer = new ftthree.GlbLayer(viewer.renderer);
glbLayer.addGltfModel(
'https://www.frontop.cloud/public/ftthree_resource/model/jianyu.gltf',
'jianzhu',
null,
(model, animation) => {
viewer.scene.add(model);
model.traverse(child => {
if (child.isMesh) {
list.push(child);
}
});
const options = {
meshs: list, // 数组
diameter: 1000, // 光环的最大直径
thickness: 10, // 光环粗细
speed: 60, // 光环动画速度
dColor: 0x0041ac, // 默认颜色
lColor: 0x3caaff, // 光环的颜色
opacity: 0.1 // 透明度
隐藏代码