DOM要素の代わりにheadless-gl javascriptのブラウザ実装の 'new Image（）'？

Question

現在、私はクライアント側でwebGLベースのブラウザ実装コードを使用しています。それは完璧に働いています。しかし、私はサーバー側で同じコードを使用したい。はい、これはブラウザベースの純粋なjavascriptコードではなく、headless-glラッパーを使用しています。

これを実行中に問題が発生しています。

新しいImage()はブラウザで識別されますが、サーバー側ではエラーImage is not definedが発生しています。

が

*var Image = require("node-webgl").Image;*、

として私は

*require("gl").Image; *と*require('gl')(width, height, { preserveDrawingBuffer: true }).Image*と試みヘッドレス-GLに使用することができるノードのWebGLで

。

上記で私は何の成功もしていません。誰かが何らかの説明をしたり、適切な場所にアドバイスしてヘッドレスglマニュアルを探すことができますか？

Answer 1

Headless-glはWebGLのみを提供します。それは

var images = require('images'); 
var img = images('/path/to/img.jpg'); 
var raw = img.toBuffer(images.TYPE_RAW); 
var pixels = new Uint8Array(raw.buffer, 12); // skip the raw header 

を動作するはずのWebGL自体の一部ではない画像の読み込みを提供しない、画像がHTML5

の一部であるあなたは、このようなデータ何かをロードし、取得するにはimages package

を試すことができません

これで、画像

gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, img.width(), img.height(), 
       0, gl.RGBA, gl.UNSIGNED_BYTE, pixels); 

をアップロードするか、画像

用のWebGL APIをエミュレートするためのラッパーを作ることができます

gl.texImage2D = function(origFn) { 
    return function(bind, mip, internalFormat) { 
    var width; 
    var height; 
    var border; 
    var format; 
    var type; 
    var data; 
    if (arguments.length === 9) { 
     // sig1: bind, mip, internalFormat, width, height, border, format, type, data 
     width = arguments[3]; 
     height = arguments[4]; 
     border = arguments[5]; 
     format = arguments[6]; 
     type = arguments[7]; 
     data = arguments[8]; 
    } else if (arguments.length === 6) { 
     // sig2: bind, mip, internalFormat, format, type, image 
     format = arguments[3]; 
     type = arguments[4]; 
     img = arguments[6]; 
     var raw = img.toBuffer(images.TYPE_RAW); 
     data = new Uint8Array(raw.buffer, 12); // skip the raw header   
     width = img.width(); 
     height = img.height(); 
     border = 0; 
    } else { 
     throw "Bad args to texImage2D"; 
    } 
    gl.texImage2D(bind, mip, internalFormat, width, height, 
        border, format, type, data); 
    }; 
}(gl.texImage2D);