diff --git a/examples/js/BlendCharacter.js b/examples/js/BlendCharacter.js
index 85da7715cbec3ac47b219a2c2d399727a200ef72..ee9dedfebfc8e7fae382a21870db142c5308ffae 100644
--- a/examples/js/BlendCharacter.js
+++ b/examples/js/BlendCharacter.js
@@ -33,10 +33,11 @@ THREE.BlendCharacter = function () {
// Create the debug visualization
- scope.skeletonHelper = new THREE.SkeletonHelper( scope.skeleton );
+ scope.skeletonHelper = new THREE.SkeletonHelper( scope );
+ scope.skeletonHelper.material.linewidth = 3;
scope.add( scope.skeletonHelper );
- scope.showSkeleton( true );
+ scope.showSkeleton( false );
// Loading is complete, fire the callback
if ( onLoad !== undefined ) onLoad();
@@ -240,6 +241,12 @@ THREE.BlendCharacter = function () {
}
+ this.showModel = function( boolean ) {
+
+ this.visible = boolean;
+
+ }
+
};
diff --git a/examples/js/BlendCharacterGui.js b/examples/js/BlendCharacterGui.js
index 097ff190c2710d130e3f6b346a223141943ab24e..e082c664698d42caaa289f5ce5b4ab7669e0104e 100644
--- a/examples/js/BlendCharacterGui.js
+++ b/examples/js/BlendCharacterGui.js
@@ -8,7 +8,8 @@ function BlendCharacterGui(animations) {
gui: null,
"Lock Camera": false,
- "Show Skeleton": true,
+ "Show Model": true,
+ "Show Skeleton": false,
"Time Scale": 1.0,
"Step Size": 0.016,
"Crossfade Time": 3.5,
@@ -20,6 +21,12 @@ function BlendCharacterGui(animations) {
var animations = animations;
+ this.showModel = function() {
+
+ return controls['Show Model'];
+
+ };
+
this.showSkeleton = function() {
return controls['Show Skeleton'];
@@ -49,6 +56,7 @@ function BlendCharacterGui(animations) {
var blending = controls.gui.addFolder( 'Blend Tuning' );
settings.add( controls, "Lock Camera" ).onChange( controls.lockCameraChanged );
+ settings.add( controls, "Show Model" ).onChange( controls.showModelChanged );
settings.add( controls, "Show Skeleton" ).onChange( controls.showSkeletonChanged );
settings.add( controls, "Time Scale", 0, 1, 0.01 );
settings.add( controls, "Step Size", 0.01, 0.1, 0.01 );
@@ -189,6 +197,18 @@ function BlendCharacterGui(animations) {
}
+ controls.showModelChanged = function() {
+
+ var data = {
+ detail: {
+ shouldShow: controls['Show Model']
+ }
+ }
+
+ window.dispatchEvent( new CustomEvent( 'toggle-show-model', data ) );
+ }
+
+
init.call(this);
}
\ No newline at end of file
diff --git a/examples/webgl_animation_skinning_blending.html b/examples/webgl_animation_skinning_blending.html
index d9f29b65c763d1fe32aac70f71e8e5f2a81fa506..e51e00e49fdedac46ce287c595fa663b343028f5 100644
--- a/examples/webgl_animation_skinning_blending.html
+++ b/examples/webgl_animation_skinning_blending.html
@@ -95,6 +95,7 @@
window.addEventListener( 'warp', onWarp );
window.addEventListener( 'toggle-lock-camera', onLockCameraToggle );
window.addEventListener( 'toggle-show-skeleton', onShowSkeleton );
+ window.addEventListener( 'toggle-show-model', onShowModel );
blendMesh = new THREE.BlendCharacter();
blendMesh.load( "models/skinned/marine/marine_anims.js", start );
@@ -197,6 +198,13 @@
}
+ function onShowModel( event ) {
+
+ var shouldShow = event.detail.shouldShow;
+ blendMesh.showModel( shouldShow );
+
+ }
+
function start() {
blendMesh.rotation.y = Math.PI * -135 / 180;
diff --git a/examples/webgl_animation_skinning_morph.html b/examples/webgl_animation_skinning_morph.html
index 3555dc926437a4689b349b12eaf38dd1011eca56..e9f5acfd706c165057ab726181e2e35908ccc2dc 100644
--- a/examples/webgl_animation_skinning_morph.html
+++ b/examples/webgl_animation_skinning_morph.html
@@ -47,6 +47,8 @@
+
+