@ridp/threejs v1.0.14

@ridp/threejs

Hooks

• useThreeJs 声明:

  /**
  * 
  * @param {String} selector  ID  '#xxxx'
  * @param {Object} option - 初始化参数
  * @property {Boolean} option.css3d - 模型
  * @returns any
  */
  function useThreeJs(selector, option)

  使用:

  import { useThreeJs } from '@ridp/threejs'
  
  const { scene, camera, renderer, control, domWidth, domHeight, isReady, addAnimate, frameArea } = useThreeJs("#InsId", )

  ---

  返回变量：

  • scene

     THREE.Scene     

  • camera:

     THREE.PerspectiveCamera 

  • renderer

     const renderer = new WebGLRenderer({
        antialias: true,
        alpha: true,
        precision: "mediump",
        logarithmicDepthBuffer: true,
    })

  • control

    THREE.OrbitControls

  • domWidth

        ref(Number)

  • domHeight

        ref(Number)

  • isReady

      ```javascript
          ref(Boolean)
      ```

    ---

    返回方法:

  • addAnimate

    /**
        * 循环帧中添加执行函数
        * @param {*} animate 
    */
    function addAnimate(animate): void

  • frameArea

    /**物体视窗自动适应
        *
        * @param {Object3D} model
        * @param {Number} scale
        * @param {Camera} camera
        * @param {OrbitControls} controls
        * @param {Vector3} offset
    */
    function frameArea(model, scale, camera, controls, offset): void

• useRaycaster

• useObb
• useGLTFLoader

Instance 实例

Utils 工具