UNPKG

zazkjson-pdf

Version:

基于MarkDown开发的VUE组件——Жидзин(Zidjin)系列组件库。

95 lines (72 loc) 3.28 kB
### zj-three-model 这是一个显示stl格式模型的组件 ### 安装 没有规定什么版本 当前用的是0.139.2版本 ```shell npm i three ``` ### 基本用法 全部代码 ```vue <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 | - | - |