three.js 源碼注釋(六十六)objects/Sprite.js
來源:程序員人生 發布時間:2015-03-02 08:07:55 閱讀次數:16156次
商域無疆 (http://blog.csdn.net/omni360/)
本文遵守“署名-非商業用處-保持1致”創作公用協議
轉載請保存此句:商域無疆 - 本博客專注于 敏捷開發及移動和物聯裝備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS,否則,出自本博客的文章謝絕轉載或再轉載,謝謝合作。
俺也是剛開始學,好多地兒肯定不對還請見諒.
以下代碼是THREE.JS 源碼文件中objects/Sprite.js文件的注釋.
更多更新在 : https://github.com/omni360/three.js.sourcecode
/**
* @author mikael emtinger / http://gomo.se/
* @author alteredq / http://alteredqualia.com/
*/
/*
///Sprite對象,點精靈對象,對應粒子對象,具體的實現是通過BufferGeometry創建1個總是面對相機的平面.
/// 用法:var map = THREE.ImageUtils.loadTexture("sprite.png"); //加載image對象
/// var material = new THREE.SpriteMaterial({map:map,color: 0xffffff,fog: true}); //創建材質對象,這里有專門適用于Sprite對象的材質對象SpriteMaterial.
/// var sprite = new THREE.Sprite( material); //創建精靈對象.
/// scene.add(line); //將精靈添加到場景中.
*/
///<summary>Sprite</summary>
///<param name ="material" type="THREE.SpriteMaterial">可選參數,SpriteMaterial對象(點精靈對象專用的材質對象)</param>
///<returns type="Sprite">返回Sprite對象</returns>
THREE.Sprite = ( function () {
var vertices = new Float32Array( [ - 0.5, - 0.5, 0, 0.5, - 0.5, 0, 0.5, 0.5, 0 ] );
var geometry = new THREE.BufferGeometry(); //使用buffergeometry對象
geometry.addAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) ); //為geometry對象添加position屬性.這里可以看考BufferGeometry對象的源碼注釋.
return function ( material ) {
THREE.Object3D.call( this ); //調用Object3D對象的call方法,將本來屬于Object3D的方法交給當前對象Sprite來使用.
this.geometry = geometry;
this.material = ( material !== undefined ) ? material : new THREE.SpriteMaterial();
};
} )();
/*************************************************
****下面是Sprite對象的方法屬性定義,繼承自Object3D
**************************************************/
THREE.Sprite.prototype = Object.create( THREE.Object3D.prototype );
/*
///raycast方法用來取得當前對象與射線(參數raycaster)的交點.raycaster.intersectObject會調用這個方法。主要是用來進行碰撞檢測,
/// 在選擇場景中的對象時常常會用到,判斷當前鼠標是不是與對象重適用來選擇對象.
/// NOTE:raycast方法中參數intersects參數用來存儲交點的集合,格式以下
/// intersects.push( {
///
/// distance: distance,
/// point: this.position,
/// face: null,
/// object: this
///
/// } );
///
*////<summary>raycast</summary>
///<param name ="raycaster" type="THREE.Raycaster">射線對象</param>
///<param name ="intersects" type="ObjectArray">交點的屬性集合</param>
///<returns type="ObjectArray">交點的屬性集合</returns>
THREE.Sprite.prototype.raycast = ( function () {
var matrixPosition = new THREE.Vector3();
return function ( raycaster, intersects ) {
matrixPosition.setFromMatrixPosition( this.matrixWorld );
var distance = raycaster.ray.distanceToPoint( matrixPosition );
if ( distance > this.scale.x ) {
return;
}
intersects.push( {
distance: distance,
point: this.position,
face: null,
object: this
} );
};
}() );
/*updateMatrix方法
///updateMatrix方法更新場景中當前精靈的平移、旋轉和縮放屬性.
*/
///<summary>updateMatrix</summary>
///<returns type="Skeleton">返回新的Sprite精靈對象.</returns>
THREE.Sprite.prototype.updateMatrix = function () {
this.matrix.compose( this.position, this.quaternion, this.scale ); //compose方法利用變換矩陣的平移、旋轉和縮放設置
this.matrixWorldNeedsUpdate = true; //Sprite對象matrixWorldNeedsUpdate屬性,設置為true.
};
/*clone方法
///clone方法克隆1個Sprite精靈對象.
*/
///<summary>clone</summary>
///<param name ="object" type="Sprite">接收克隆的Sprite對象</param>
///<returns type="Sprite">返回克隆的Sprite精靈對象.</returns>
THREE.Sprite.prototype.clone = function ( object ) {
if ( object === undefined ) object = new THREE.Sprite( this.material );
THREE.Object3D.prototype.clone.call( this, object );
return object; //返回克隆的Sprite精靈對象
};
// Backwards compatibility 向后兼容,粒子被更名為精靈.
THREE.Particle = THREE.Sprite;
商域無疆 (http://blog.csdn.net/omni360/)
本文遵守“署名-非商業用處-保持1致”創作公用協議
轉載請保存此句:商域無疆 - 本博客專注于 敏捷開發及移動和物聯裝備研究:數據可視化、GOLANG、Html5、WEBGL、THREE.JS,否則,出自本博客的文章謝絕轉載或再轉載,謝謝合作。
以下代碼是THREE.JS 源碼文件中objects/Sprite.js文件的注釋.
更多更新在 : https://github.com/omni360/three.js.sourcecode
生活不易,碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈