Skip to content

T
three.js

Ablesons / three.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
T
three.js

体验新版 GitCode，发现更多精彩内容 >>

提交 e39cbf23 编写于 作者: A alteredq
浏览文件
操作

Added LineDashedMaterial and corresponding example. 

Not yet 100% sure about all the details but this is something that should be useful for making helpers prettier.
上级 1c58ec38
隐藏空白更改
内联 并排
Showing with 830 addition and 187 deletion
build/three.js
浏览文件 @ e39cbf23
......@@ -4904,6 +4904,8 @@ THREE.Geometry = function () {
this.skinWeights = [];
this.skinIndices = [];
this.lineDistances = [];
this.boundingBox = null;
this.boundingSphere = null;
......@@ -4919,6 +4921,7 @@ THREE.Geometry = function () {
this.normalsNeedUpdate = false;
this.tangentsNeedUpdate = false;
this.colorsNeedUpdate = false;
this.lineDistancesNeedUpdate = false;
this.buffersNeedUpdate = false;
......@@ -10307,6 +10310,71 @@ THREE.LineBasicMaterial.prototype.clone = function () {
return material;
};
/**
* @author alteredq / http://alteredqualia.com/
*
* parameters = {
* color: <hex>,
* opacity: <float>,
*
* blending: THREE.NormalBlending,
* depthTest: <bool>,
*
* linewidth: <float>,
*
* scale: <float>,
* dashSize: <float>,
* gapSize: <float>,
*
* vertexColors: <bool>
*
* fog: <bool>
* }
*/
THREE.LineDashedMaterial = function ( parameters ) {
THREE.Material.call( this );
this.color = new THREE.Color( 0xffffff );
this.linewidth = 1;
this.scale = 1;
this.dashSize = 3;
this.gapSize = 1;
this.vertexColors = false;
this.fog = true;
this.setValues( parameters );
};
THREE.LineDashedMaterial.prototype = Object.create( THREE.Material.prototype );
THREE.LineDashedMaterial.prototype.clone = function () {
var material = new THREE.LineDashedMaterial();
THREE.Material.prototype.clone.call( this, material );
material.color.copy( this.color );
material.linewidth = this.linewidth;
material.scale = this.scale;
material.dashSize = this.dashSize;
material.gapSize = this.gapSize;
material.vertexColors = this.vertexColors;
material.fog = this.fog;
return material;
};
/**
* @author mrdoob / http://mrdoob.com/
......@@ -15747,6 +15815,75 @@ THREE.ShaderLib = {
},
'dashed': {
uniforms: THREE.UniformsUtils.merge( [
THREE.UniformsLib[ "common" ],
THREE.UniformsLib[ "fog" ],
{
"scale": { type: "f", value: 1 },
"dashSize": { type: "f", value: 1 },
"totalSize": { type: "f", value: 2 }
}
] ),
vertexShader: [
"uniform float scale;",
"attribute float lineDistance;",
"varying float vLineDistance;",
THREE.ShaderChunk[ "color_pars_vertex" ],
"void main() {",
THREE.ShaderChunk[ "color_vertex" ],
"vLineDistance = scale * lineDistance;",
"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
"gl_Position = projectionMatrix * mvPosition;",
"}"
].join("\n"),
fragmentShader: [
"uniform vec3 diffuse;",
"uniform float opacity;",
"uniform float dashSize;",
"uniform float totalSize;",
"varying float vLineDistance;",
THREE.ShaderChunk[ "color_pars_fragment" ],
THREE.ShaderChunk[ "fog_pars_fragment" ],
"void main() {",
"if ( mod( vLineDistance, totalSize ) > dashSize ) {",
"discard;",
"}",
"gl_FragColor = vec4( diffuse, opacity );",
THREE.ShaderChunk[ "color_fragment" ],
THREE.ShaderChunk[ "fog_fragment" ],
"}"
].join("\n")
},
// Depth encoding into RGBA texture
// based on SpiderGL shadow map example
// http://spidergl.org/example.php?id=6
......@@ -16293,6 +16430,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.__webglVertexBuffer = _gl.createBuffer();
geometry.__webglColorBuffer = _gl.createBuffer();
geometry.__webglLineDistanceBuffer = _gl.createBuffer();
_this.info.memory.geometries ++;
......@@ -16370,6 +16508,7 @@ THREE.WebGLRenderer = function ( parameters ) {
_gl.deleteBuffer( geometry.__webglVertexBuffer );
_gl.deleteBuffer( geometry.__webglColorBuffer );
_gl.deleteBuffer( geometry.__webglLineDistanceBuffer );
deleteCustomAttributesBuffers( geometry );
......@@ -16517,6 +16656,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.__vertexArray = new Float32Array( nvertices * 3 );
geometry.__colorArray = new Float32Array( nvertices * 3 );
geometry.__lineDistanceArray = new Float32Array( nvertices * 1 );
geometry.__webglLineCount = nvertices;
......@@ -17113,18 +17253,23 @@ THREE.WebGLRenderer = function ( parameters ) {
function setLineBuffers ( geometry, hint ) {
var v, c, vertex, offset, color,
var v, c, d, vertex, offset, color,
vertices = geometry.vertices,
colors = geometry.colors,
lineDistances = geometry.lineDistances,
vl = vertices.length,
cl = colors.length,
dl = lineDistances.length,
vertexArray = geometry.__vertexArray,
colorArray = geometry.__colorArray,
lineDistanceArray = geometry.__lineDistanceArray,
dirtyVertices = geometry.verticesNeedUpdate,
dirtyColors = geometry.colorsNeedUpdate,
dirtyLineDistances = geometry.lineDistancesNeedUpdate,
customAttributes = geometry.__webglCustomAttributesList,
......@@ -17170,6 +17315,19 @@ THREE.WebGLRenderer = function ( parameters ) {
}
if ( dirtyLineDistances ) {
for ( d = 0; d < dl; d ++ ) {
lineDistanceArray[ d ] = lineDistances[ d ];
}
_gl.bindBuffer( _gl.ARRAY_BUFFER, geometry.__webglLineDistanceBuffer );
_gl.bufferData( _gl.ARRAY_BUFFER, lineDistanceArray, hint );
}
if ( customAttributes ) {
for ( i = 0, il = customAttributes.length; i < il; i ++ ) {
......@@ -19331,6 +19489,15 @@ THREE.WebGLRenderer = function ( parameters ) {
}
// line distances
if ( attributes.lineDistance >= 0 ) {
_gl.bindBuffer( _gl.ARRAY_BUFFER, geometryGroup.__webglLineDistanceBuffer );
_gl.vertexAttribPointer( attributes.lineDistance, 1, _gl.FLOAT, false, 0, 0 );
}
}
// render mesh
......@@ -20147,7 +20314,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry = object.geometry;
if( ! geometry.__webglVertexBuffer ) {
if ( ! geometry.__webglVertexBuffer ) {
createRibbonBuffers( geometry );
initRibbonBuffers( geometry, object );
......@@ -20162,13 +20329,14 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry = object.geometry;
if( ! geometry.__webglVertexBuffer ) {
if ( ! geometry.__webglVertexBuffer ) {
createLineBuffers( geometry );
initLineBuffers( geometry, object );
geometry.verticesNeedUpdate = true;
geometry.colorsNeedUpdate = true;
geometry.lineDistancesNeedUpdate = true;
}
......@@ -20365,7 +20533,7 @@ THREE.WebGLRenderer = function ( parameters ) {
customAttributesDirty = material.attributes && areCustomAttributesDirty( material );
if ( geometry.verticesNeedUpdate || geometry.colorsNeedUpdate || customAttributesDirty ) {
if ( geometry.verticesNeedUpdate || geometry.colorsNeedUpdate || geometry.lineDistancesNeedUpdate || customAttributesDirty ) {
setLineBuffers( geometry, _gl.DYNAMIC_DRAW );
......@@ -20373,6 +20541,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.verticesNeedUpdate = false;
geometry.colorsNeedUpdate = false;
geometry.lineDistancesNeedUpdate = false;
material.attributes && clearCustomAttributes( material );
......@@ -20523,6 +20692,10 @@ THREE.WebGLRenderer = function ( parameters ) {
shaderID = 'basic';
} else if ( material instanceof THREE.LineDashedMaterial ) {
shaderID = 'dashed';
} else if ( material instanceof THREE.ParticleBasicMaterial ) {
shaderID = 'particle_basic';
......@@ -20600,6 +20773,7 @@ THREE.WebGLRenderer = function ( parameters ) {
if ( attributes.color >= 0 ) _gl.enableVertexAttribArray( attributes.color );
if ( attributes.normal >= 0 ) _gl.enableVertexAttribArray( attributes.normal );
if ( attributes.tangent >= 0 ) _gl.enableVertexAttribArray( attributes.tangent );
if ( attributes.lineDistance >= 0 ) _gl.enableVertexAttribArray( attributes.lineDistance );
if ( material.skinning &&
attributes.skinIndex >= 0 && attributes.skinWeight >= 0 ) {
......@@ -20800,6 +20974,11 @@ THREE.WebGLRenderer = function ( parameters ) {
refreshUniformsLine( m_uniforms, material );
} else if ( material instanceof THREE.LineDashedMaterial ) {
refreshUniformsLine( m_uniforms, material );
refreshUniformsDash( m_uniforms, material );
} else if ( material instanceof THREE.ParticleBasicMaterial ) {
refreshUniformsParticle( m_uniforms, material );
......@@ -20973,6 +21152,14 @@ THREE.WebGLRenderer = function ( parameters ) {
};
function refreshUniformsDash ( uniforms, material ) {
uniforms.dashSize.value = material.dashSize;
uniforms.totalSize.value = material.dashSize + material.gapSize;
uniforms.scale.value = material.scale;
};
function refreshUniformsParticle ( uniforms, material ) {
uniforms.psColor.value = material.color;
......@@ -22078,7 +22265,7 @@ THREE.WebGLRenderer = function ( parameters ) {
identifiers = [
"position", "normal", "uv", "uv2", "tangent", "color",
"skinIndex", "skinWeight"
"skinIndex", "skinWeight", "lineDistance"
];
......
build/three.min.js
浏览文件 @ e39cbf23
因为 它太大了无法显示 source diff 。你可以改为 查看blob。
examples/webgl_lines_dashed.html 0 → 100644
浏览文件 @ e39cbf23
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - dashed lines</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
color: #ffffff;
font-family:Monospace;
font-size:13px;
text-align:center;
font-weight: bold;
background-color: #000000;
margin: 0px;
overflow: hidden;
}
#info {
color: #fff;
position: absolute;
top: 0px; width: 100%;
padding: 5px;
z-index:100;
}
</style>
</head>
<body>
<div id="info"><a href="http://threejs.org" target="_blank">three.js</a> - dashed lines example</div>
<div id="container"></div>
<script src="js/Detector.js"></script>
<script src="js/libs/stats.min.js"></script>
<script src="../build/three.min.js"></script>
<script>
if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
var renderer, scene, camera, stats;
var objects = [];
var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
init();
animate();
function init() {
camera = new THREE.PerspectiveCamera( 60, WIDTH / HEIGHT, 1, 200 );
camera.position.z = 150;
scene = new THREE.Scene();
scene.fog = new THREE.Fog( 0x111111, 150, 200 );
root = new THREE.Object3D();
var subdivisions = 6;
var recursion = 1;
var points = hilbert3D( new THREE.Vector3( 0,0,0 ), 25.0, recursion, 0, 1, 2, 3, 4, 5, 6, 7 );
var spline = new THREE.Spline( points );
var geometrySpline = new THREE.Geometry();
for ( var i = 0; i < points.length * subdivisions; i ++ ) {
var index = i / ( points.length * subdivisions );
var position = spline.getPoint( index );
geometrySpline.vertices[ i ] = new THREE.Vector3( position.x, position.y, position.z );
}
var geometryCube = cube( 50 );
computeLineDistances( geometryCube );
computeLineDistances( geometrySpline );
var object = new THREE.Line( geometrySpline, new THREE.LineDashedMaterial( { color: 0xffffff, dashSize: 1, gapSize: 0.5 } ), THREE.LineStrip );
objects.push( object );
scene.add( object );
var object = new THREE.Line( geometryCube, new THREE.LineDashedMaterial( { color: 0xffaa00, dashSize: 3, gapSize: 1, linewidth: 2 } ), THREE.LinePieces );
objects.push( object );
scene.add( object );
renderer = new THREE.WebGLRenderer( { clearColor: 0x111111, clearAlpha: 1, antialias: true } );
renderer.setSize( WIDTH, HEIGHT );
var container = document.getElementById( 'container' );
container.appendChild( renderer.domElement );
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.top = '0px';
container.appendChild( stats.domElement );
//
window.addEventListener( 'resize', onWindowResize, false );
}
function computeLineDistances( geometry ) {
var d = 0;
var vertices = geometry.vertices;
for ( var i = 0, il = vertices.length; i < il; i ++ ) {
if ( i > 0 ) {
d += vertices[ i ].distanceTo( vertices[ i - 1 ] );
}
geometry.lineDistances[ i ] = d;
}
}
function cube( size ) {
var h = size * 0.5;
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3( -h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, -h, h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, h ) );
geometry.vertices.push( new THREE.Vector3( h, h, h ) );
geometry.vertices.push( new THREE.Vector3( h, h, h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, h ) );
geometry.vertices.push( new THREE.Vector3( -h, -h, h ) );
geometry.vertices.push( new THREE.Vector3( -h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, -h, h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( -h, h, h ) );
geometry.vertices.push( new THREE.Vector3( h, h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, h, h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, -h ) );
geometry.vertices.push( new THREE.Vector3( h, -h, h ) );
return geometry;
}
// port of Processing Java code by Thomas Diewald
// http://www.openprocessing.org/visuals/?visualID=15599
function hilbert3D( center, side, iterations, v0, v1, v2, v3, v4, v5, v6, v7 ) {
var half = side/2,
vec_s = [
new THREE.Vector3( center.x - half, center.y + half, center.z - half ),
new THREE.Vector3( center.x - half, center.y + half, center.z + half ),
new THREE.Vector3( center.x - half, center.y - half, center.z + half ),
new THREE.Vector3( center.x - half, center.y - half, center.z - half ),
new THREE.Vector3( center.x + half, center.y - half, center.z - half ),
new THREE.Vector3( center.x + half, center.y - half, center.z + half ),
new THREE.Vector3( center.x + half, center.y + half, center.z + half ),
new THREE.Vector3( center.x + half, center.y + half, center.z - half )
],
vec = [ vec_s[ v0 ], vec_s[ v1 ], vec_s[ v2 ], vec_s[ v3 ], vec_s[ v4 ], vec_s[ v5 ], vec_s[ v6 ], vec_s[ v7 ] ];
if ( --iterations >= 0 ) {
var tmp = [];
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 0 ], half, iterations, v0, v3, v4, v7, v6, v5, v2, v1 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 1 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 2 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 3 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 4 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 5 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 6 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
Array.prototype.push.apply( tmp, hilbert3D ( vec[ 7 ], half, iterations, v6, v5, v2, v1, v0, v3, v4, v7 ) );
return tmp;
}
return vec;
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}
function animate() {
requestAnimationFrame( animate );
render();
stats.update();
}
function render() {
var time = Date.now() * 0.001;
for ( var i = 0; i < objects.length; i ++ ) {
var object = objects[ i ];
//object.rotation.x = 0.25 * time * ( i%2 == 1 ? 1 : -1);
object.rotation.x = 0.25 * time;
object.rotation.y = 0.25 * time;
}
renderer.render( scene, camera );
}
</script>
</body>
</html>
src/core/Geometry.js
浏览文件 @ e39cbf23
......@@ -32,6 +32,8 @@ THREE.Geometry = function () {
this.skinWeights = [];
this.skinIndices = [];
this.lineDistances = [];
this.boundingBox = null;
this.boundingSphere = null;
......@@ -47,6 +49,7 @@ THREE.Geometry = function () {
this.normalsNeedUpdate = false;
this.tangentsNeedUpdate = false;
this.colorsNeedUpdate = false;
this.lineDistancesNeedUpdate = false;
this.buffersNeedUpdate = false;
......
src/materials/LineDashedMaterial.js 0 → 100644
浏览文件 @ e39cbf23
/**
* @author alteredq / http://alteredqualia.com/
*
* parameters = {
* color: <hex>,
* opacity: <float>,
*
* blending: THREE.NormalBlending,
* depthTest: <bool>,
*
* linewidth: <float>,
*
* scale: <float>,
* dashSize: <float>,
* gapSize: <float>,
*
* vertexColors: <bool>
*
* fog: <bool>
* }
*/
THREE.LineDashedMaterial = function ( parameters ) {
THREE.Material.call( this );
this.color = new THREE.Color( 0xffffff );
this.linewidth = 1;
this.scale = 1;
this.dashSize = 3;
this.gapSize = 1;
this.vertexColors = false;
this.fog = true;
this.setValues( parameters );
};
THREE.LineDashedMaterial.prototype = Object.create( THREE.Material.prototype );
THREE.LineDashedMaterial.prototype.clone = function () {
var material = new THREE.LineDashedMaterial();
THREE.Material.prototype.clone.call( this, material );
material.color.copy( this.color );
material.linewidth = this.linewidth;
material.scale = this.scale;
material.dashSize = this.dashSize;
material.gapSize = this.gapSize;
material.vertexColors = this.vertexColors;
material.fog = this.fog;
return material;
};
src/renderers/WebGLRenderer.js
浏览文件 @ e39cbf23
......@@ -488,6 +488,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.__webglVertexBuffer = _gl.createBuffer();
geometry.__webglColorBuffer = _gl.createBuffer();
geometry.__webglLineDistanceBuffer = _gl.createBuffer();
_this.info.memory.geometries ++;
......@@ -565,6 +566,7 @@ THREE.WebGLRenderer = function ( parameters ) {
_gl.deleteBuffer( geometry.__webglVertexBuffer );
_gl.deleteBuffer( geometry.__webglColorBuffer );
_gl.deleteBuffer( geometry.__webglLineDistanceBuffer );
deleteCustomAttributesBuffers( geometry );
......@@ -712,6 +714,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.__vertexArray = new Float32Array( nvertices * 3 );
geometry.__colorArray = new Float32Array( nvertices * 3 );
geometry.__lineDistanceArray = new Float32Array( nvertices * 1 );
geometry.__webglLineCount = nvertices;
......@@ -1308,18 +1311,23 @@ THREE.WebGLRenderer = function ( parameters ) {
function setLineBuffers ( geometry, hint ) {
var v, c, vertex, offset, color,
var v, c, d, vertex, offset, color,
vertices = geometry.vertices,
colors = geometry.colors,
lineDistances = geometry.lineDistances,
vl = vertices.length,
cl = colors.length,
dl = lineDistances.length,
vertexArray = geometry.__vertexArray,
colorArray = geometry.__colorArray,
lineDistanceArray = geometry.__lineDistanceArray,
dirtyVertices = geometry.verticesNeedUpdate,
dirtyColors = geometry.colorsNeedUpdate,
dirtyLineDistances = geometry.lineDistancesNeedUpdate,
customAttributes = geometry.__webglCustomAttributesList,
......@@ -1365,6 +1373,19 @@ THREE.WebGLRenderer = function ( parameters ) {
}
if ( dirtyLineDistances ) {
for ( d = 0; d < dl; d ++ ) {
lineDistanceArray[ d ] = lineDistances[ d ];
}
_gl.bindBuffer( _gl.ARRAY_BUFFER, geometry.__webglLineDistanceBuffer );
_gl.bufferData( _gl.ARRAY_BUFFER, lineDistanceArray, hint );
}
if ( customAttributes ) {
for ( i = 0, il = customAttributes.length; i < il; i ++ ) {
......@@ -3526,6 +3547,15 @@ THREE.WebGLRenderer = function ( parameters ) {
}
// line distances
if ( attributes.lineDistance >= 0 ) {
_gl.bindBuffer( _gl.ARRAY_BUFFER, geometryGroup.__webglLineDistanceBuffer );
_gl.vertexAttribPointer( attributes.lineDistance, 1, _gl.FLOAT, false, 0, 0 );
}
}
// render mesh
......@@ -4342,7 +4372,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry = object.geometry;
if( ! geometry.__webglVertexBuffer ) {
if ( ! geometry.__webglVertexBuffer ) {
createRibbonBuffers( geometry );
initRibbonBuffers( geometry, object );
......@@ -4357,13 +4387,14 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry = object.geometry;
if( ! geometry.__webglVertexBuffer ) {
if ( ! geometry.__webglVertexBuffer ) {
createLineBuffers( geometry );
initLineBuffers( geometry, object );
geometry.verticesNeedUpdate = true;
geometry.colorsNeedUpdate = true;
geometry.lineDistancesNeedUpdate = true;
}
......@@ -4560,7 +4591,7 @@ THREE.WebGLRenderer = function ( parameters ) {
customAttributesDirty = material.attributes && areCustomAttributesDirty( material );
if ( geometry.verticesNeedUpdate || geometry.colorsNeedUpdate || customAttributesDirty ) {
if ( geometry.verticesNeedUpdate || geometry.colorsNeedUpdate || geometry.lineDistancesNeedUpdate || customAttributesDirty ) {
setLineBuffers( geometry, _gl.DYNAMIC_DRAW );
......@@ -4568,6 +4599,7 @@ THREE.WebGLRenderer = function ( parameters ) {
geometry.verticesNeedUpdate = false;
geometry.colorsNeedUpdate = false;
geometry.lineDistancesNeedUpdate = false;
material.attributes && clearCustomAttributes( material );
......@@ -4718,6 +4750,10 @@ THREE.WebGLRenderer = function ( parameters ) {
shaderID = 'basic';
} else if ( material instanceof THREE.LineDashedMaterial ) {
shaderID = 'dashed';
} else if ( material instanceof THREE.ParticleBasicMaterial ) {
shaderID = 'particle_basic';
......@@ -4795,6 +4831,7 @@ THREE.WebGLRenderer = function ( parameters ) {
if ( attributes.color >= 0 ) _gl.enableVertexAttribArray( attributes.color );
if ( attributes.normal >= 0 ) _gl.enableVertexAttribArray( attributes.normal );
if ( attributes.tangent >= 0 ) _gl.enableVertexAttribArray( attributes.tangent );
if ( attributes.lineDistance >= 0 ) _gl.enableVertexAttribArray( attributes.lineDistance );
if ( material.skinning &&
attributes.skinIndex >= 0 && attributes.skinWeight >= 0 ) {
......@@ -4995,6 +5032,11 @@ THREE.WebGLRenderer = function ( parameters ) {
refreshUniformsLine( m_uniforms, material );
} else if ( material instanceof THREE.LineDashedMaterial ) {
refreshUniformsLine( m_uniforms, material );
refreshUniformsDash( m_uniforms, material );
} else if ( material instanceof THREE.ParticleBasicMaterial ) {
refreshUniformsParticle( m_uniforms, material );
......@@ -5168,6 +5210,14 @@ THREE.WebGLRenderer = function ( parameters ) {
};
function refreshUniformsDash ( uniforms, material ) {
uniforms.dashSize.value = material.dashSize;
uniforms.totalSize.value = material.dashSize + material.gapSize;
uniforms.scale.value = material.scale;
};
function refreshUniformsParticle ( uniforms, material ) {
uniforms.psColor.value = material.color;
......@@ -6273,7 +6323,7 @@ THREE.WebGLRenderer = function ( parameters ) {
identifiers = [
"position", "normal", "uv", "uv2", "tangent", "color",
"skinIndex", "skinWeight"
"skinIndex", "skinWeight", "lineDistance"
];
......
src/renderers/WebGLShaders.js
浏览文件 @ e39cbf23
......@@ -2337,6 +2337,75 @@ THREE.ShaderLib = {
},
'dashed': {
uniforms: THREE.UniformsUtils.merge( [
THREE.UniformsLib[ "common" ],
THREE.UniformsLib[ "fog" ],
{
"scale": { type: "f", value: 1 },
"dashSize": { type: "f", value: 1 },
"totalSize": { type: "f", value: 2 }
}
] ),
vertexShader: [
"uniform float scale;",
"attribute float lineDistance;",
"varying float vLineDistance;",
THREE.ShaderChunk[ "color_pars_vertex" ],
"void main() {",
THREE.ShaderChunk[ "color_vertex" ],
"vLineDistance = scale * lineDistance;",
"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
"gl_Position = projectionMatrix * mvPosition;",
"}"
].join("\n"),
fragmentShader: [
"uniform vec3 diffuse;",
"uniform float opacity;",
"uniform float dashSize;",
"uniform float totalSize;",
"varying float vLineDistance;",
THREE.ShaderChunk[ "color_pars_fragment" ],
THREE.ShaderChunk[ "fog_pars_fragment" ],
"void main() {",
"if ( mod( vLineDistance, totalSize ) > dashSize ) {",
"discard;",
"}",
"gl_FragColor = vec4( diffuse, opacity );",
THREE.ShaderChunk[ "color_fragment" ],
THREE.ShaderChunk[ "fog_fragment" ],
"}"
].join("\n")
},
// Depth encoding into RGBA texture
// based on SpiderGL shadow map example
// http://spidergl.org/example.php?id=6
......
utils/includes/common.json
浏览文件 @ e39cbf23
......@@ -41,6 +41,7 @@
"../src/loaders/TextureLoader.js",
"../src/materials/Material.js",
"../src/materials/LineBasicMaterial.js",
"../src/materials/LineDashedMaterial.js",
"../src/materials/MeshBasicMaterial.js",
"../src/materials/MeshLambertMaterial.js",
"../src/materials/MeshPhongMaterial.js",
......
utils/includes/webgl.json
浏览文件 @ e39cbf23
......@@ -40,6 +40,7 @@
"../src/loaders/TextureLoader.js",
"../src/materials/Material.js",
"../src/materials/LineBasicMaterial.js",
"../src/materials/LineDashedMaterial.js",
"../src/materials/MeshBasicMaterial.js",
"../src/materials/MeshLambertMaterial.js",
"../src/materials/MeshPhongMaterial.js",
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或