diff --git a/examples/js/materials/ShadowMaterial.js b/examples/js/materials/ShadowMaterial.js
new file mode 100644
index 0000000000000000000000000000000000000000..7e8f7c6b74b02a365e33c6861323c411e2a57f38
--- /dev/null
+++ b/examples/js/materials/ShadowMaterial.js
@@ -0,0 +1,55 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ */
+
+THREE.ShadowMaterial = function () {
+
+ THREE.ShaderMaterial.call( this, {
+ uniforms: THREE.UniformsUtils.merge( [
+ THREE.UniformsLib[ "ambient" ],
+ THREE.UniformsLib[ "lights" ],
+ {
+ opacity: { type: 'f', value: 1.0 }
+ }
+ ] ),
+ vertexShader: [
+ THREE.ShaderChunk[ "shadowmap_pars_vertex" ],
+ "void main() {",
+ THREE.ShaderChunk[ "begin_vertex" ],
+ THREE.ShaderChunk[ "project_vertex" ],
+ THREE.ShaderChunk[ "worldpos_vertex" ],
+ THREE.ShaderChunk[ "shadowmap_vertex" ],
+ "}"
+ ].join( '\n' ),
+ fragmentShader: [
+ THREE.ShaderChunk[ "common" ],
+ THREE.ShaderChunk[ "bsdfs" ],
+ THREE.ShaderChunk[ "lights_pars" ],
+ THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
+ THREE.ShaderChunk[ "shadowmask_pars_fragment" ],
+ "uniform float opacity;",
+ "void main() {",
+ " gl_FragColor = vec4( 0.0, 0.0, 0.0, opacity - getShadowMask() );",
+ "}"
+ ].join( '\n' )
+ } );
+
+ this.lights = true;
+ this.transparent = true;
+
+ Object.defineProperties( this, {
+ opacity: {
+ enumerable: true,
+ get: function () {
+ return this.uniforms.opacity.value;
+ },
+ set: function ( value ) {
+ this.uniforms.opacity.value = value;
+ }
+ }
+ } );
+
+};
+
+THREE.ShadowMaterial.prototype = Object.create( THREE.ShaderMaterial.prototype );
+THREE.ShadowMaterial.prototype.constructor = THREE.ShadowMaterial;
diff --git a/examples/webgl_geometry_spline_editor.html b/examples/webgl_geometry_spline_editor.html
index c3995a624f41f12d274e2fb5cb79079e24a8913a..57d27c4d443e2777c6552b6a98b4e50deef686b5 100644
--- a/examples/webgl_geometry_spline_editor.html
+++ b/examples/webgl_geometry_spline_editor.html
@@ -19,6 +19,7 @@
+
@@ -70,7 +71,7 @@
light.position.set( 0, 1500, 200 );
light.castShadow = true;
light.shadowCameraNear = 200;
- light.shadowCameraFar = camera.far;
+ light.shadowCameraFar = 2000;
light.shadowCameraFov = 70;
light.shadowBias = -0.000222;
light.shadowMapWidth = 1024;
@@ -78,9 +79,12 @@
scene.add( light );
spotlight = light;
+ scene.add( new THREE.CameraHelper( light.shadow.camera ) );
+
var planeGeometry = new THREE.PlaneGeometry( 2000, 2000 );
planeGeometry.rotateX( - Math.PI / 2 );
- var planeMaterial = new THREE.MeshBasicMaterial( { color: 0xeeeeee } );
+ var planeMaterial = new THREE.ShadowMaterial();
+ planeMaterial.opacity = 0.2;
var plane = new THREE.Mesh( planeGeometry, planeMaterial );
plane.position.y = -200;