ThingOrigin.js

案例展示 ​

创建基础模型

<template>
  <div id="TO"></div>
</template>

<script setup>
import { onMounted } from "vue";

onMounted(() => {
  let TO = new ThingOrigin("fileModel", document.getElementById("TO"));

  let cube = TO.model.initCube({
    position: {
      x: -60,
      y: 5,
      z: 0,
    },

    material: {
      color: "#f00",
    },
  });
  TO.scene.add(cube);

  let plane = TO.model.initPlane({
    position: {
      x: -30,
      y: 5,
      z: 0,
    },

    material: {
      color: "#00ff00",
    },
  });
  TO.scene.add(plane);

  let sphere = TO.model.initSphere({
    position: {
      x: 0,
      y: 10,
      z: 0,
    },
    material: {
      color: "#0000ff",
    },
  });
  TO.scene.add(sphere);

  let cone = TO.model.initCone({
    position: {
      x: 30,
      y: 10,
      z: 0,
    },
    material: {
      color: "#ffff00",
    },
  });
  TO.scene.add(cone);

  let cylinder = TO.model.initCylinder({
    position: {
      x: 60,
      y: 10,
      z: 0,
    },
    material: {
      color: "#ff00ff",
    },
  });
  TO.scene.add(cylinder);
});

let modelInfo = {
  modelName: "arrow-" + new Date().getTime(),
  position: {
    x: 0,
    y: 0,
    z: 0,
  },
  scale: {
    x: 1,
    y: 1,
    z: 1,
  },
  rotation: {
    x: 0,
    y: 0,
    z: 0,
  },
  base: {
    start: {
      x: 0,
      y: 0,
      z: 0,
    },
    end: {
      x: 10,
      y: 10,
      z: 10,
    },
    headLength: 3,
    headWidth: 2,
    length: 10,
  },
  material: {
    color: "#f00",
  },
};
</script>

<style scoped>
#TO {
  width: 100%;
  height: 400px;
  position: relative;
}
</style>

API 介绍 ​

model.initCube ​

方法签名返回值描述
initCube(modelInfo?: modelInfoParams, material?: any)Object3D创建立方体

参数说明：

参数名类型是否必选描述
modelInfomodelInfoParams否模型参数
materialany否材质

model.initPlane ​

方法签名返回值描述
initPlane(modelInfo?: modelInfoParams)any (Object3D)创建平面

参数说明：

参数名类型是否必选描述
modelInfomodelInfoParams否模型参数

model.initSphere ​

方法签名返回值描述
initSphere(modelInfo?: modelInfoParams, material?: any)Object3D创建球体

参数说明：

参数名类型是否必选描述
modelInfomodelInfoParams否模型参数
materialany否材质

model.initCone ​

方法签名返回值描述
initCone(modelInfo?: modelInfoParams)Object3D创建圆锥

参数说明：

参数名类型是否必选描述
modelInfomodelInfoParams否模型参数

model.initCylinder ​

方法签名返回值描述
initCylinder(modelInfo?: modelInfoParams)Object3D创建圆柱体

参数说明：

参数名类型是否必选描述
modelInfomodelInfoParams否模型参数