<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue-3D-Model</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-3d-model/dist/vue-3d-model.umd.js"></script>
</head>
<body>
<div id="app">
<model-obj src="example/models/obj/LeePerrySmith.obj"></model-obj>
</div>
</body>
</html>
<script>
new Vue({ el: '#app' });
</script>
在線預(yù)覽地址vue-3d-model js在線預(yù)覽obj,dae,ply,json,fbx,stl,gltf格式的3D文件
效果：
例子使用了.obj 3D文件格式，自帶了截圖和旋轉(zhuǎn)功能，其他的3D格式只需要切換一個vue的模板標簽即可。具體標簽格式如下：文章來源：http://www.zghlxwxcb.cn/news/detail-524542.html
<!-- obj -->
<section v-if="false">
<template>
<model-obj src="3d-model/obj/LeePerrySmith.obj"/>
</template>
</section>
<!-- obj + mtl -->
<section v-if="false">
<template>
<model-obj
src="3d-model/obj+mtl/male/male.obj"
mtl="3d-model/obj+mtl/male/male.mtl"
/>
</template>
</section>
<!-- json -->
<section v-if="false">
<template>
<model-three src="3d-model/json/scene.json"/>
</template>
</section>
<!-- fbx -->
<section v-if="false">
<template>
<model-fbx src="3d-model/fbx/dancing.fbx" />
</template>
</section>
<!-- stl -->
<section v-if="false">
<template>
<model-stl src="3d-model/stl/colored.stl" />
</template>
</section>
<!-- dae -->
<section v-if="false">
<template>
<model-collada src="3d-model/dae/elf/elf.dae" />
</template>
</section>
<!-- dae -->
<section v-if="false">
<template>
<model-ply src="3d-model/ply/海豚.ply" />
</template>
</section>
<!-- gltf -->
<section>
<template>
<model-gltf src="3d-model/gltf/小黃鴨/Duck.gltf" />
</template>
</section>
可支持obj,dae,ply,json,fbx,stl,gltf等格式的3D文件格式顯示。只需要單頁面html即可集成，非常方便。文章來源地址http://www.zghlxwxcb.cn/news/detail-524542.html
到了這里，關(guān)于vue-3d-model js在線預(yù)覽obj,dae,ply,json,fbx,stl,gltf格式的3D文件的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
