@zhengyuzi/gltf-viewer-for-vue v0.0.13

@zhengyuzi/gltf-viewer-for-vue

Vue3 gltf 3D model viewer, based on @zhengyuzi/gltf-viewer.

Installing

# install peer dependency
npm install three
# install package
npm install @zhengyuzi/gltf-viewer-for-vue

Usage

import "@zhengyuzi/gltf-viewer-for-vue/dist/style.css"

Basic

<script setup lang="ts">
import { ref } from 'vue'
import { Viewer } from '@zhengyuzi/gltf-viewer-for-vue'

const _Viewer = ref<InstanceType<typeof Viewer> | null>(null)
</script>

<template>
  <div style="width: 100vw; height: 100vh;">
    <Viewer ref="_Viewer" url="/test.glb" />
  </div>
</template>

Using ControlPanel

<script setup lang="ts">
import { ref } from 'vue'
import { Viewer, ViewerControlPanel } from '@zhengyuzi/gltf-viewer-for-vue'

const _Viewer = ref<InstanceType<typeof Viewer> | null>(null)
</script>

<template>
  <div style="width: 100vw; height: 100vh;">
    <Viewer ref="_Viewer" url="/test.glb">
      <ViewerControlPanel />
    </Viewer>
  </div>
</template>