zazkjson-pdf

zj-three-model

这是一个显示stl格式模型的组件

安装

没有规定什么版本 当前用的是0.139.2版本

npm i three

基本用法

全部代码

<template>
   <div>
       <zj-three-model :stlData="stlData" :cameraSet="cameraSet" ></zj-three-model>
   </div>
</template>

<script>
    import ZjThreeModel from 'zj-three-model'
    export default {
        components: {
            ZjThreeModel,
        },
        data() {
            return{
                stlData: {
                    url: '/MTTU.stl',
                    type: 'stl',
                    scale: {x: 1, y: 1, z: 1},
                    position: {x: 0, y: 0, z: 0},
                    rotation: {x: 0, y: 0, z: 0},
                    materialColor: 0xffffff,
                    dotSize: 0.1,
                    materialType: 'mesh',//point/line
                    side: 'back', //front//back/double
                },
                cameraSet: {
                    camera_position_set: {x: 0, y: 5, z: 5},
                    camera_lookAt: {x: 0, y: 0, z: 0},
                },
            }
        },
    }
</script>

<style>
    #container {
      position: absolute;
      width: 100%;
      height: 100%;
    }
</style>

zj-three-model Attributes

参数	说明	类型	可选值	默认值
stlData	模型的数据	Object	-	-
cameraSet	相机的数据	Object	-	-

stlData Attributes

参数	说明	类型	可选值	默认值
url	模型的静态地址	String	-	-
type	模型类型 但这个组件仅仅显示stl模型	String	-	-
scale	模型的缩放比例	Object	-	{x: 1, y: 1, z: 1}
position	模型的位置	Object	-	{x: 0, y: 0, z: 0}
rotation	旋转轴	Object	-	{x: 0, y: 0, z: 0}
materialColor	材质颜色	十六进制	-	0xff0000
dotSize	点模型点的大小	Number	-	-
materialType	显示材料的类型点、线、面	String	mesh | point | line	-
side	材料单面显示还是双面显示	String	front|back|double	true

cameraSet Attributes

参数	说明	类型	可选值	默认值
camera_position_set	照相机的位置	Object	-	-
camera_lookAt	相机的朝向	Object	-	-