javascript
/
three.js
-ын хуулбар https://github.com/tazdij/three.js.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
							<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<base href="../../../" />
		<script src="page.js"></script>
		<link type="text/css" rel="stylesheet" href="page.css" />
	</head>
	<body>
		<h1>[name]</h1>

		<p class="desc"> A animation helper for <a href="https://sites.google.com/view/evpvp/"><em>MMD</em></a> resources. <br /><br />
		[name] handles animation of MMD assets loaded by [page:MMDLoader] with MMD special features as IK, Grant, and Physics.
		It uses [page:CCDIKSolver] and [page:MMDPhysics] inside.
		</p>

		<h2>Code Example</h2>

		<code>
		// Instantiate a helper
		const helper = new MMDAnimationHelper();

		// Load MMD resources and add to helper
		new MMDLoader().loadWithAnimation(
			'models/mmd/miku.pmd',
			'models/mmd/dance.vmd',
			function ( mmd ) {

				helper.add( mmd.mesh, {
					animation: mmd.animation,
					physics: true
				} );

				scene.add( mmd.mesh );

				new THREE.AudioLoader().load(
					'audios/mmd/song.mp3',
					function ( buffer ) {

						const listener = new THREE.AudioListener();
						const audio = new THREE.Audio( listener ).setBuffer( buffer );

						listener.position.z = 1;

						scene.add( audio );
						scene.add( listener );

					}

				);

			}
		);

		function render() {

			helper.update( clock.getDelta() );
			renderer.render( scene, camera );

		}
		</code>

		<h2>Examples</h2>

		<p>
			[example:webgl_loader_mmd]<br />
			[example:webgl_loader_mmd_pose]<br />
			[example:webgl_loader_mmd_audio]
		</p>

		<h2>Constructor</h2>

		<h3>[name]( [param:Object params] )</h3>
		<p>
		[page:Object params] — (optional)<br />
		<ul>
			<li> [page:Boolean sync] - Whether animation durations of added objects are synched. Default is true.</li>
			<li> [page:Number afterglow] - Default is 0.0.</li>
			<li> [page:Boolean resetPhysicsOnLoop] - Default is true.</li>
		</ul>
		</p>
		<p>
		Creates a new [name].
		</p>

		<h2>Properties</h2>

		<h3>[property:Audio audio]</h3>
		<p>An [page:Audio] added to helper.</p>

		<h3>[property:Camera camera]</h3>
		<p>An [page:Camera] added to helper.</p>

		<h3>[property:Array meshes]</h3>
		<p>An array of [page:SkinnedMesh] added to helper.</p>

		<h3>[property:WeakMap objects]</h3>
		<p>A [page:WeakMap] which holds animation stuffs used in helper for objects added to helper. For example, you can access [page:AnimationMixer] for an added [page:SkinnedMesh] with "helper.objects.get( mesh ).mixer"</p>

		<h3>[property:Function onBeforePhysics]</h3>
		<p>An optional callback that is executed immediately before the physicis calculation for an [page:SkinnedMesh]. This function is called with the [page:SkinnedMesh].</p>

		<h2>Methods</h2>

		<h3>[method:MMDAnimationHelper add]( [param:Object3D object], [param:Object params] )</h3>
		<p>
		[page:Object3D object] — [page:SkinnedMesh], [page:Camera], or [page:Audio]<br />
		[page:Object params] — (optional)<br />
		<ul>
			<li>[page:AnimationClip animation] - an [page:AnimationClip] or an array of [page:AnimationClip] set to object. Only for [page:SkinnedMesh] and [page:Camera]. Default is undefined.</li>
			<li>[page:Boolean physics] - Only for [page:SkinnedMesh]. A flag whether turn on physics. Default is true.</li>
			<li>[page:Integer warmup] - Only for [page:SkinnedMesh] and physics is true. Physics parameter. Default is 60.</li>
			<li>[page:Number unitStep] - Only for [page:SkinnedMesh] and physics is true. Physics parameter. Default is 1 / 65.</li>
			<li>[page:Integer maxStepNum] - Only for [page:SkinnedMesh] and physics is true. Physics parameter. Default is 3.</li>
			<li>[page:Vector3 gravity] - Only for [page:SkinnedMesh] and physics is true. Physics parameter. Default is ( 0, - 9.8 * 10, 0 ).</li>
			<li>[page:Number delayTime] - Only for [page:Audio]. Default is 0.0.</li>
		</ul>
		</p>
		<p>
		Add an [page:SkinnedMesh], [page:Camera], or [page:Audio] to helper and setup animation. The anmation durations of added objects are synched.
		If camera/audio has already been added, it'll be replaced with a new one.
		</p>

		<h3>[method:MMDAnimationHelper enable]( [param:String key], [param:Boolean enabled] )</h3>
		<p>
		[page:String key] — Allowed strings are 'animation', 'ik', 'grant', 'physics', and 'cameraAnimation'.<br />
		[page:Boolean enabled] — true is enable, false is disable<br />
		</p>
		<p>
		Enable/Disable an animation feature
		</p>

		<h3>[method:MMDAnimationHelper pose]( [param:SkinnedMesh mesh], [param:Object vpd], [param:Object params] )</h3>
		<p>
		[page:SkinnedMesh mesh] — [page:SkinnedMesh] which changes the posing. It doesn't need to be added to helper.<br />
		[page:Object vpd] — VPD content obtained by [page:MMDLoader].loadVPD<br />
		[page:Object params] — (optional)<br />
		<ul>
			<li>[page:Boolean resetPose] - Default is true.</li>
			<li>[page:Boolean ik] - Default is true.</li>
			<li>[page:Boolean grant] - Default is true.</li>
		</ul>
		</p>
		<p>
		Changes the posing of [page:SkinnedMesh] as VPD content specifies.
		</p>

		<h3>[method:MMDAnimationHelper remove]( [param:Object3D object] )</h3>
		<p>
		[page:Object3D object] — [page:SkinnedMesh], [page:Camera], or [page:Audio]<br />
		</p>
		<p>
		Remove an [page:SkinnedMesh], [page:Camera], or [page:Audio] from helper.
		</p>

		<h3>[method:MMDAnimationHelper update]( [param:Nummber delta] )</h3>
		<p>
		[page:Number delta] — number in second<br />
		</p>
		<p>
		Advance mixer time and update the animations of objects added to helper
		</p>

		<h2>Source</h2>

		<p>
			[link:https://github.com/mrdoob/three.js/blob/master/examples/jsm/animation/MMDAnimationHelper.js examples/jsm/animation/MMDAnimationHelper.js]
		</p>
	</body>
</html>