Three.jsのピクセルを比較する方法

Question

ピクセルレベルで比較したいthree.jsに2つのテクスチャがあります。しかし、私はそれをどうやって行うのか分かりません。 Three.jsのドキュメントは私の質問に答えるものではありません。実際、クラスのいくつかは文書化されていません。

簡潔に言えば、2つの異なる画像が（私の遺伝的アルゴリズムで適合度を計算するために）どのように計算したいのですか？

編集：私はより多くの情報を提供する必要があると言われています。さあ。

一つのテクスチャ「loadTexture」を使用してロードされたイメージからである：

：私は2番目のシーンにいくつかのポリゴンを追加して、後で私はテクスチャにそのシーンをレンダリングする上で他のものを得る

 referenceTexture = THREE.ImageUtils.loadTexture('images/tia1.jpg'); //256px*256px image 

var bufferScene = new THREE.Scene(); 
var bufferTexture = new THREE.WebGLRenderTarget(window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter,format: THREE.RGBAFormat}); 
bufferScene.add(triangle) //This is a bucle in the real code. 
renderer.setSize(256,256); 
requestAnimationFrame(render); 
renderer.render(bufferScene, camera, bufferTexture); 

ありがとうございます。

Answer 1

各テクスチャをレンダーターゲットにアタッチし、次にrenderer.readRenderTargetPixelsを呼び出して、各テクスチャのピクセルを取得して比較することができます。あなたが別の両方のテクスチャをレンダリングすることができ

OR

は2つのテクスチャをdiffをシェーダを使用してターゲットをレンダリングしてからrenderer.readRenderTargetPixels

Answer 2

テクスチャと同じサイズのキャンバスにテクスチャを描画し、フレームバッファのピクセルカラーをgl.readPixelsで読み取ることができます。その後、CPUの値を比較することができます。

また、GPUでピクセルカラーの減算を行い、差異をレンダリングしてからreadPixelsを実行することもできます。