從今天開始，我們開始正式的學習osg框架，今天我們學習的是osg的渲染模塊，我們來看一下代碼結構。
所有DrawXXX的js模塊都是渲染的模塊，我們逐一來簡單介紹一下，第一個Drawable.js，這個模塊是描述可繪制對象的類，也是我們今天要討論的類。在osg框架中，渲染管道在准備時期首先要統計管理可繪制對象，我們來看看Drawable模塊到底做了什么操作，進行了哪些管理。先貼出代碼。
/* 可繪制對象 */ let StateBin = require('./StateBin'); let BoundingBox = require('../util/BoundingBox'); let BoundingSphere = require('../util/BoundingSphere'); let Vec3 = require('../util/Vec3'); let Drawable = function (actor) { this._drawActor = actor;//關聯的DrawActor this._geometry = undefined;//渲染的幾何Geometry this._transform = undefined;//世界變換 FloatArray(16) this._statebin = undefined;//狀態結點，原始的狀態，沒有額外功能時的狀態 this._curStatebin = undefined;//如果狀態會動態變化，這里存儲每一幀繪制時的狀態結點 this._depth = 0.0;//場景深度值，透明需要按深度排序繪制 this._boundingBox = undefined;//包圍盒 this._boundingSphere = undefined;//包圍球 }; Drawable.prototype = { setGeometry: function (g, transform) { this._geometry = g; this._transform = transform; }, getGeometry: function () { return this._geometry; }, getTransform: function () { return this._transform; }, setStateBin: function (sb) { this._statebin = sb; }, getStateBin: function () { return this._statebin; }, getCurrentStateBin: function () { return this._curStatebin; }, // setDepth: function (d) { // this._depth = d; // }, getDepth: function () { return this._depth; }, reset: function () { this._geometry = undefined; this._transform = undefined; this._statebin = undefined; this._curStatebin = undefined; this._depth = 0.0; this._boundingBox = undefined; this._boundingSphere = undefined; }, valid: function () { if (this._drawActor.getBaseCamera().isBoundingBoxCulled(this.getBoundingBox())) { return false; } return true; }, isTransparent: function () { return false; }, //計算深度值 computeDepth: function () { //根據包圍盒和相機變換矩陣，確認中心點的Z值 let mvmatrix = this._drawActor.getBaseCamera().getModelViewMatrix(); let temp = Vec3.MemoryPool.alloc(); this._depth = this.distanceZ(this.getBoundingBox().getCenter(temp), mvmatrix); Vec3.MemoryPool.free(temp); //drawable.setDepth(depth); }, //相機的矩陣要取反 distanceZ: function (coord, matrix) { return -(coord[0] * matrix[2] + coord[1] * matrix[6] + coord[2] * matrix[10] + matrix[14]); }, getBoundingBox: function () { if(this._boundingBox === undefined){ this._boundingBox = new BoundingBox(); this._boundingBox.copy(this._geometry.getBoundingBox(true)); if(this._transform){ this._boundingBox.transformMat4(this._transform); } } return this._boundingBox; }, getBoundingSphere: function () { if(this._boundingSphere === undefined) { this._boundingSphere = new BoundingSphere(); let bb = this.getBoundingBox(); this._boundingSphere.expandByBoundingBox(bb); } return this._boundingSphere; }, getRadius: function () { return this.getBoundingSphere().getRadius(); }, // There are 3 cases when there is a prev / current render leaf // pSG: previousStateGraph // cSG: currentStateGraph // pRL: previousRenderLeaf // cRL: currentRenderLeaf // // A B C // +-----+ +-----+ +-----+ +-----+ // | pSG | | cSG | +--+ SG +--+ | SG | // +--+--+ +--+--+ | +-----+ | +--+--+ // | | | | | // +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ // | pSG | | cSG | | pSG | | cSG | +--+ SG +--+ // +--+--+ +--+--+ +--+--+ +--+--+ | +-----+ | // | | | | | | // +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ // | pRL | | cRL | | pRL | | cRL | | pRL | | cRL | // +-----+ +-----+ +-----+ +-----+ +-----+ +-----+ // // // Case A // no common parent StateGraphNode we need to // popStateSet until we find the common parent and then // pushStateSet from the common parent to the current RenderLeaf // // Case B // common parent StateGraphNode so we apply the current stateSet // // Case C // the StateGraphNode is common to the previous RenderLeaf so we dont need // to do anything except if we used an insertStateSet draw: function (glstate, preDrawable) { //先接受狀態，再渲染幾何 let curStateGraph = this._statebin; let curStateGraphStateSet = curStateGraph.getStateSet(); let curStateGraphParent = curStateGraph.getParent(); let preStateGraph; let preStateGraphParent; if(preDrawable !== undefined){ preStateGraph = preDrawable._statebin; preStateGraphParent = preStateGraph.getParent(); if(preStateGraphParent !== curStateGraphParent){//A StateBin.moveStateBin(glstate, preStateGraphParent, curStateGraphParent); glstate.applyStateSet(curStateGraphStateSet); }else if(preStateGraph !== curStateGraph){//B glstate.applyStateSet(curStateGraphStateSet); }else{ // in osg we call apply but actually we dont need // except if the stateSetStack changed. // for example if insert/remove StateSet has been used // if (glstate._stateSetStackChanged(idLastDraw, lastStateSetStackSize )) { // glstate.applyStateSet(curStateGraphStateSet); // } } } else{//如果preLeaf為空，第一個繪制的幾何，狀態遍歷到根節點全部push到GLState中 StateBin.moveStateBin(glstate, undefined, curStateGraphParent); glstate.applyStateSet(curStateGraphStateSet); } let camera = this._drawActor.getBaseCamera(); glstate.applyModelMatrix(this._transform, camera.getModelViewMatrix(), camera.getProjectionMatrix()); this._geometry.draw(glstate); return true; }, }; module.exports = Drawable; // set: function (stateGraph, geometry, , depth) { // this._statebin = stateGraph; // this._geometry = geometry; // // this._depth = depth; // }, // drawGeometry: function (glstate) { // //let program = glstate.getLastProgramApplied(); // //let programID = program.getID(); // //let programCaches = glstate.getProgramCaches(); // //let obj = programCaches[programID]; // // if(!obj){//程序不存在，創建一個新的 // // obj = new CacheUniformApply(glstate, program); // // programCaches[programID] = obj; // // } // // //從相機獲取modelview和projection // //着色器暫時不需要透視矩陣 // //let modelview = this._camera.get // // // // //glstate.applyModelViewMatrix(this._modelview); // //glstate.applyProjectionMatrix(this._projection); // glstate.applyTransformMatrix(this._transform); // //this._modelview = this._camera.getModelViewMatrix(); // //Mat4.mul(this._modelview, this._modelview, this._transform); // //this._projection = this._camera.getProjectionMatrix(); // glstate.applyModelMatrix(this._transform, this._camera.getModelViewMatrix(), this._camera.getProjectionMatrix()); // // // //let gluniforms = program.getGLUniformsCache(); // //let modelviewloc = gluniforms[glstate._modelViewMatrixUniform.getName()]; // //let viewloc = gluniforms[glstate._viewMatrixUniform.getName()]; // // //obj.apply(glstate, this._modelview, this._modelworld, this._view, this._projection, this._normal); // this._geometry.draw(glstate); // },
我們先來看看Drawable的構造函數，截取構造函數代碼
let Drawable = function (actor) { this._drawActor = actor;//關聯的DrawActor this._geometry = undefined;//渲染的幾何Geometry this._transform = undefined;//世界變換 FloatArray(16) this._statebin = undefined;//狀態結點，原始的狀態，沒有額外功能時的狀態 this._curStatebin = undefined;//如果狀態會動態變化，這里存儲每一幀繪制時的狀態結點 this._depth = 0.0;//場景深度值，透明需要按深度排序繪制 this._boundingBox = undefined;//包圍盒 this._boundingSphere = undefined;//包圍球 };
首先我們看到第一個私有屬性是DrawActor，我們看看DrawActor是個什么模塊，先貼出DrawActor類代碼。
/* 繪制對象角色 每個DrawActor管理自己的渲染數據，自己的狀態樹，自己的相機樹 如果該功能銷毀直接銷毀對應的DrawActor資源 但是他引用的狀態，相機並不是他管理 不想把各個DrawActor攪和在一起，邏輯混亂 繪制分幾種情況，全自動，全手動，半自動 全自動-所有的繪制流程從一開始數據構造好后就不會再變更，只需在初始化時確認好 后續直接渲染即可 半自動-部分繪制流程是固定的，部分繪制流程是動態的，比如構件場景下，需要點選高亮等功能變化 全手動-所有的繪制流程都是動態的，每一幀都需要重新構造每個drawable，部分功能數據 */ let Drawable = require('./Drawable'); let StateBin = require('./StateBin'); let NodeVisitor = require('../util/NodeVisitor'); let CullStack = require('./CullStack'); let Mat4 = require('../util/Mat4'); let Group = require('../core/Group'); let Geode = require('../core/Geode'); let MatrixTrasform = require('../core/MatrixTransform'); let SceneRoot = require('../scene/SceneRoot'); let Geometry = require('../core/Geometry'); let DrawActor = function (renderer) { NodeVisitor.call(this, NodeVisitor.TRAVERSE_CHILDREN); CullStack.call(this); //為正確渲染准備的數據 this._renderer = renderer;//所屬的渲染器，固有資產，不會變更 this._baseCamera = this._renderer.getMainCamera();//相機，默認為主相機 this._baseState = new StateBin();//狀態 this._sceneRoot = undefined;//所屬的場景根節點 //渲染的對象 this._drawables = []; // this._drawIndex = 0;//當前繪制的索引數，需要固定幀率渲染的地方使用 // this._currentStateBin = undefined;//當前處理的狀態樹結點，臨時數據 // //this._fixed = false;//是否啟用固定幀率 this._valid = true;//直接屏蔽渲染的標記 }; DrawActor.prototype = Object.create(NodeVisitor.prototype); Object.assign(DrawActor.prototype, CullStack.prototype); DrawActor.prototype.constructor = DrawActor; Object.assign(DrawActor.prototype, { setBaseCamera: function (camera) {//設置當前相機，可以自由設置自己獨特的相機 this._baseCamera = camera; }, getBaseCamera: function () { return this._baseCamera; }, getBaseStateBin: function () { return this._baseState; }, getBaseStateSet: function () { return this._baseState.getStateSet(); }, //復原場景根節點的狀態 revertBaseState: function () { if (this._sceneRoot) { this._baseState.setStateSet(this._sceneRoot.getStateSet()); } }, //與場景的唯一聯系，一定要先定義好場景的幾何和狀態再調用setSceneRoot setSceneRoot: function (root) { this._sceneRoot = root; //一定要先定義好場景根節點的狀態，否則會出錯！！！ //this._baseState.setStateSet(root.getStateSet()); }, createDrawable: function () {//base override return new Drawable(this);//創建對應類型的Drawable }, addDrawable: function (drawable) { this._drawables.push(drawable); }, getDrawables: function () { return this._drawables; }, valid: function (valid) { if (valid !== undefined) { this._valid = valid; } return this._valid; }, //遍歷 apply: function (node) { this[node.typeID](node); }, //重載，壓入一個狀態 pushStateSet: function (stateset) { if (stateset) { //添加StateGraph子節點，更新當前活動的StateGraph為新的狀態 this._currentStateBin = this._currentStateBin.addStateSetChild(stateset); } }, //重載，彈出一個狀態 popStateSet: function (stateset) { if (stateset) { this._currentStateBin = this._currentStateBin.getParent(); } }, //重載 pushDrawable: function (geometry) { let drawable = this.createDrawable(); drawable.setStateBin(this._currentStateBin); drawable.setGeometry(geometry, this.getCurrentTransformMatrix()); this.addDrawable(drawable); }, //根重載，繪制當前Actor下的drawables，繪制不需要固定幀率，永遠在第一幀里繪制完畢 draw: function (glstate, preCamera) { if (!this._valid) {//不再繪制 return preCamera; } this.drawCamera(preCamera); //循環遍歷一遍drawables，繪制實體 let preDrawable = undefined; let l = this._drawables.length; for (let i = this._drawIndex; i < l; i++) { let drawable = this._drawables[i]; if (drawable.valid()) { drawable.draw(glstate, preDrawable);//成功繪制的 preDrawable = drawable; } this._drawIndex++; } return this._baseCamera; }, //每個新幀繪制之前的重置工作 drawReset: function () { this._baseCamera.setClearFlag(false); this._drawIndex = 0; }, //當前Actor的對象是否全部繪制完畢 drawFinished: function () { return this._drawables.length === this._drawIndex; }, //繪制相機狀態(視口，清空) drawCamera: function (preCamera) { if (preCamera === this._baseCamera) {//重復的不再處理 return; } //視口何時都需要設置 let glstate = this._renderer.getGLState(); glstate.applyAttribute(this._baseCamera.getViewport()); //以下是每個相機只需要處理一次的事情 if (!this._baseCamera.getClearFlag()) { //更新視錐體，確保剔除正確，每幀相機的投影矩陣和視圖矩陣可能都會變化 this._baseCamera.updateCullFrustum(); //清空顏色和深度，但如果是主相機不再需要，在最開始就已經清空 let clearmask = this._baseCamera.getClearMask(); if (clearmask !== 0x0) { let gl = glstate.getWebGLContext(); if (clearmask & gl.COLOR_BUFFER_BIT) { let color = this._baseCamera.getClearColor();//清空顏色 gl.clearColor(color[0], color[1], color[2], color[3]); } if (clearmask & gl.DEPTH_BUFFER_BIT) { let depth = this._baseCamera.getClearDepth();//清空深度 gl.depthMask(true); gl.clearDepth(depth); } gl.clear(clearmask); } this._baseCamera.setClearFlag(true); } }, //根重載，線段求交，返回相交的drawable對象 linesegmentIntersect: function (start, end, threshold) { let LineSegmentIntersector = require('../util/LineSegmentIntersector'); let intersector = new LineSegmentIntersector(); intersector.initialize(start, end, threshold); let length = this._drawables.length; for (let i = 0; i < length; i++) { let drawable = this._drawables[i]; if (drawable.valid()) {//沒有隱藏，沒有被剔除的drawable進行相交運算 intersector.intersect(drawable); } } //線段求交結果需要根據ratio排序 return intersector.getIntersections(); }, }); DrawActor.prototype[SceneRoot.typeID] = function (root) { this._baseState.removeChildren(); this._baseState.setStateSet(root.getStateSet()); this._currentStateBin = this._baseState; this.pushTransformMatrix(root.getRootTransform());//變換矩陣中先推入一個單位矩陣作為根節點，非常重要 this.traverse(root); this.popTransformMatrix(); this._currentStateBin = undefined; }; DrawActor.prototype[MatrixTrasform.typeID] = function (node) { //模型矩陣變換 let lastModelMatrix = this.getCurrentTransformMatrix(); let mmatrix = undefined; if (lastModelMatrix) { mmatrix = Mat4.clone(lastModelMatrix); } else { mmatrix = Mat4.new(); } node.computeLocalToWorldMatrix(mmatrix); this.pushTransformMatrix(mmatrix); //狀態 let stateset = node.getStateSet(); this.pushStateSet(stateset); this.traverse(node); this.popStateSet(stateset); this.popTransformMatrix(); }; DrawActor.prototype[Geode.typeID] = function (geode) { this[Group.typeID](geode); }; DrawActor.prototype[Group.typeID] = function (group) { let stateset = group.getStateSet(); this.pushStateSet(stateset); this.traverse(group); this.popStateSet(stateset); }; DrawActor.prototype[Geometry.typeID] = function (geometry) {//Geometry已經是葉子，不需要繼續遞歸了 let stateset = geometry.getStateSet(); this.pushStateSet(stateset); this.pushDrawable(geometry); this.popStateSet(stateset); }; module.exports = DrawActor; // reset: function () { // this._drawables.length = 0;//置空 // this._sceneRoot = undefined; // }, // polytopeIntersect: function () { // // }, // sphereIntersect: function () { // // },
我們可以看到，DrawActor是將要被繪制的對象，分成全自動（初始化模型數據就構造Drawable，准備渲染）、半自動（事件觸發后構造Drawable，等待渲染）、全手動（用戶自己構造Drawable，用戶自己將Drawable排入渲染隊列）。我們看到，DrawActor的構造函數包含的私有屬性有this._renderer渲染器、this._baseCamera待渲染模塊所屬相機、this._baseState狀態（對應shader里的uniform參數）、this._sceneRoot所屬場景根節點、this._drawables包含的渲染對象、this._drawIndex當前繪制的索引數（代表本次繪制是第幾次繪制，如果一此不能全部繪制完，就分多次繪制，例如模型增長）、this._currentStateBin當前處理的狀態樹節點、this._valid屏蔽渲染的標記（true：加入渲染隊列，false：不加入渲染隊列）。
我們再來看看DrawActor的成員函數都做了什么，我們依次來看。
1.setBaseCamera設置參考相機，這就是設置當前繪制對象的觀察相機。2.getBaseCamera獲取參考相機。3.getbaseStateBin獲取狀態信息，包括當前渲染對象綁定的shader，uniform參數以及frameBuffer材質。4.getBaseStateSet同樣是獲取當前渲染對象的狀態信息，shader，uniform，材質信息，depth深度緩沖等。5.revertBaseState恢復場景根節點狀態，包括shader，uniform參數，材質信息，depth深度緩存。6.setSceneRoot設置場景根節點。7.createDrawable創建渲染對象。8.addDrawable追加渲染對象進入繪制對象數組。9.getDrawable返回渲染對象數組。10.valid標記當前渲染對象是否被屏蔽。11.apply取出每個渲染節點。12.pushStateSet向stateBin中加入stateSet，這里說明一點，stateSet是stateBin的屬性。13.popStateSet從stateBin中取出stateSet屬性參數。14.pushDrawable創建渲染對象drawable然后加入drawActor的drawable渲染對象數組。15.draw這才是drawActor的核心功能函數，同學們，鯽魚為大家隆重介紹繪制函數，或者叫渲染函數，這就是將所有的drawable渲染對象進行遍歷渲染的功能函數。16.drawReset每一幀繪制之前的整理重置。17.drawFinished判斷當前drawActor繪制對象是否全部將drawable數組中的渲染對象繪制完畢。18.drawCamera繪制相機狀態（視口，深度緩沖），如果沒有渲染對象私有獨立的相機，就操作主相機。19.linesegmentIntersection射線碰撞，重載父類方法。
依次看一下上面的函數，我們大致了解了DrawActor類處理的是渲染流程管理的工作。我們接下來繼續看Drawable類的其他屬性。我們再貼出一次drawable的構造函數。
let Drawable = function (actor) { this._drawActor = actor;//關聯的DrawActor this._geometry = undefined;//渲染的幾何Geometry this._transform = undefined;//世界變換 FloatArray(16) this._statebin = undefined;//狀態結點，原始的狀態，沒有額外功能時的狀態 this._curStatebin = undefined;//如果狀態會動態變化，這里存儲每一幀繪制時的狀態結點 this._depth = 0.0;//場景深度值，透明需要按深度排序繪制 this._boundingBox = undefined;//包圍盒 this._boundingSphere = undefined;//包圍球 };
我們已經看過了this._drawActor，也知道了drawActor是管理渲染的類。接下來我們看this._geometry渲染的幾何體成員對象。this._transform空間變換矩陣。this._statebin狀態節點，用來添加stateSet狀態參數對象。this._currStatebin，保存每一幀的臨時狀態stateSet。this._depth場景深度值，作用於主相機或渲染對象私有相機（如果有私有相機的話）。this._boundingBox包圍盒。this._boundingSphere包圍球。這些就是Drawable類的成員。我們馬上來看一下Drawable的成員函數。
Drawable成員函數。貼出代碼。
setGeometry: function (g, transform) { this._geometry = g; this._transform = transform; }, getGeometry: function () { return this._geometry; }, getTransform: function () { return this._transform; }, setStateBin: function (sb) { this._statebin = sb; }, getStateBin: function () { return this._statebin; }, getCurrentStateBin: function () { return this._curStatebin; }, // setDepth: function (d) { // this._depth = d; // }, getDepth: function () { return this._depth; }, reset: function () { this._geometry = undefined; this._transform = undefined; this._statebin = undefined; this._curStatebin = undefined; this._depth = 0.0; this._boundingBox = undefined; this._boundingSphere = undefined; }, valid: function () { if (this._drawActor.getBaseCamera().isBoundingBoxCulled(this.getBoundingBox())) { return false; } return true; }, isTransparent: function () { return false; }, //計算深度值 computeDepth: function () { //根據包圍盒和相機變換矩陣，確認中心點的Z值 let mvmatrix = this._drawActor.getBaseCamera().getModelViewMatrix(); let temp = Vec3.MemoryPool.alloc(); this._depth = this.distanceZ(this.getBoundingBox().getCenter(temp), mvmatrix); Vec3.MemoryPool.free(temp); //drawable.setDepth(depth); }, //相機的矩陣要取反 distanceZ: function (coord, matrix) { return -(coord[0] * matrix[2] + coord[1] * matrix[6] + coord[2] * matrix[10] + matrix[14]); }, getBoundingBox: function () { if(this._boundingBox === undefined){ this._boundingBox = new BoundingBox(); this._boundingBox.copy(this._geometry.getBoundingBox(true)); if(this._transform){ this._boundingBox.transformMat4(this._transform); } } return this._boundingBox; }, getBoundingSphere: function () { if(this._boundingSphere === undefined) { this._boundingSphere = new BoundingSphere(); let bb = this.getBoundingBox(); this._boundingSphere.expandByBoundingBox(bb); } return this._boundingSphere; }, getRadius: function () { return this.getBoundingSphere().getRadius(); },
都是設置和獲取屬性的函數，包括包圍盒和包圍球。接下來我們來看看最核心的部分，隆重介紹draw繪制函數，請看代碼。
// There are 3 cases when there is a prev / current render leaf // pSG: previousStateGraph // cSG: currentStateGraph // pRL: previousRenderLeaf // cRL: currentRenderLeaf // // A B C // +-----+ +-----+ +-----+ +-----+ // | pSG | | cSG | +--+ SG +--+ | SG | // +--+--+ +--+--+ | +-----+ | +--+--+ // | | | | | // +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ // | pSG | | cSG | | pSG | | cSG | +--+ SG +--+ // +--+--+ +--+--+ +--+--+ +--+--+ | +-----+ | // | | | | | | // +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ +--v--+ // | pRL | | cRL | | pRL | | cRL | | pRL | | cRL | // +-----+ +-----+ +-----+ +-----+ +-----+ +-----+ // // // Case A // no common parent StateGraphNode we need to // popStateSet until we find the common parent and then // pushStateSet from the common parent to the current RenderLeaf // // Case B // common parent StateGraphNode so we apply the current stateSet // // Case C // the StateGraphNode is common to the previous RenderLeaf so we dont need // to do anything except if we used an insertStateSet draw: function (glstate, preDrawable) { //先接受狀態，再渲染幾何 let curStateGraph = this._statebin; let curStateGraphStateSet = curStateGraph.getStateSet(); let curStateGraphParent = curStateGraph.getParent(); let preStateGraph; let preStateGraphParent; if(preDrawable !== undefined){ preStateGraph = preDrawable._statebin; preStateGraphParent = preStateGraph.getParent(); if(preStateGraphParent !== curStateGraphParent){//A StateBin.moveStateBin(glstate, preStateGraphParent, curStateGraphParent); glstate.applyStateSet(curStateGraphStateSet); }else if(preStateGraph !== curStateGraph){//B glstate.applyStateSet(curStateGraphStateSet); }else{ // in osg we call apply but actually we dont need // except if the stateSetStack changed. // for example if insert/remove StateSet has been used // if (glstate._stateSetStackChanged(idLastDraw, lastStateSetStackSize )) { // glstate.applyStateSet(curStateGraphStateSet); // } } } else{//如果preLeaf為空，第一個繪制的幾何，狀態遍歷到根節點全部push到GLState中 StateBin.moveStateBin(glstate, undefined, curStateGraphParent); glstate.applyStateSet(curStateGraphStateSet); } let camera = this._drawActor.getBaseCamera(); glstate.applyModelMatrix(this._transform, camera.getModelViewMatrix(), camera.getProjectionMatrix()); this._geometry.draw(glstate); return true; },
我將注釋也貼了出來，我們可以看到，渲染繪制是分三種情況的，首先我們要了解一下StateGraph渲染屬性這個來源於osg的概念。stateGraph是渲染的狀態屬性，包括本次渲染綁定的shader，uniform參數，frameBuffer材質屬性，depth深度屬性。好了，大致了解了StateGraph后我們再來了解一下RenderLeaf渲染葉這個同樣來自osg的概念。RenderLeaf是渲染葉，需要注意的是渲染葉保存的是sceneTree的節點狀態，而不是場景樹的幾何和transform信息。好了，了解了這兩個概念我們來看看這三種情況。A.前一幀stateGraph和后一幀stateGraph沒有同一個父節點；B.前后兩幀stateGraph有同一個父節點；C.前后兩幀renderLeaf有共同父節點。針對這三種情況，處理的方式不同，需要注意。鯽魚也才開始逐步研究osg框架，理解不到位之處請各位方家海涵。
好了，今天講述的是osg的渲染模塊中的一部分DrawActor和Drawable兩個模塊。下一篇會進一步講述渲染模塊。歡迎大家討論，祝大家元旦快樂。本文系原創，如需引用，請注明出處：https://www.cnblogs.com/ccentry/p/10199157.html