BVH Vue Component Library

Project to preview BVH (BioVision Motion Capture) files using Vue 3 and Three.js.

Features

• Bvh Class: A utility class to parse BVH files and extract skeleton/motion data.
• BvhView Component: A Vue component to render the BVH animation in 3D.

Usage

Installation

Ensure you have installed the dependencies:

pnpm install

Running the Test Page

The project includes a test page (App.vue) that loads public/test.bvh.

pnpm dev

Open your browser at http://localhost:5173 (or the port shown in terminal).

Using the Component Library

Bvh Class

import { Bvh } from '@/lib/Bvh'

const bvh = new Bvh()
bvh.parse(bvhString) // Parse content string

const baseData = bvh.getBaseData()
// { frameTime, numFrames, duration }

const skeleton = bvh.getSkeleton()
// Returns root joint with hierarchy

BvhView Component

<script setup>
import BvhView from '@/components/BvhView.vue'
// ... obtain bvh instance ...
</script>

<template>
  <BvhView :bvh="bvhInstance" />
</template>

Project Structure

• src/lib/Bvh.ts: Core parsing logic.
• src/components/BvhView.vue: 3D rendering component.
• public/test.bvh: Sample file for testing.