Request for Forum or Documentation

[backspaces]

I'm new to three, converting a canvas2d project to webgl/three and followed the help guideline to use stackoverflow or irc only.

I asked this on SO: http://stackoverflow.com/questions/40497646/threejs-colormaps-lookuptables-luts .. basically how to use colormaps.

I also tried using irc (new to me) and got a pointer to a demo which may help. But irc is pretty weak, no history apparently so can't be searched or left by itself for a while.

So this is a Feature Request, I guess, of augmenting the (great) documentation with a forum .. or having fairly serious watch over SO.

[backspaces]

BTW: maybe this could be solved with a plugin/extension architecture document, I'm familiar with webgl and fine augmenting a shader.

[mrdoob]

Sorry, but your question is too broad... It would be helpful to see the actual project you are trying to port.

[backspaces]

OK. The project is the second generation of http://agentscript.org/ written in es6. The current state of the rewrite is http://backspaces.github.io/asx/.

Here is a simple fire model cellular automata: http://backspaces.github.io/asx/test.html?fire and here it is modified for three.js http://backspaces.github.io/asx/test.html?fire3

I'd like to convert to the three architecture, which is really appealing. The issues I face is the details of converting from my CPU structures to three.js rendering. The example mentioned above is a colormap where 256 color, for example, are referred to by their indices into the colors array. The colors are a hybrid of string, pixel, and typed array. (It's amazing how many folks think [256, 0, 0] is a color!) The maps can be MatLab-style gradients, structured r, g, b steps, and basically any color array the user provides.

Because the models have a large number of objects (patches, turtles, links) I tend to use JS tricks to minimize storage. Colormaps are an example. I also work in typed arrays both for storage efficiency and to be webgl-ready. In the fire/fire3 example, the data is a typed array with both rgba views (ImageData object) and a pixel view.

I'd prefer to use three.js, either directly or via plugins/extensions rather than use our own webgl libraries, although, for Ed Angel's webgl mooc I used a stunt similar to greggman's twgl library: use the information in the program/shaders to create buffer/attributes & uniform objects that correctly match the glsl variables. Removes verbosity.

So what I'm groping for is a way to use three.js for specific architectural needs of the core agentscript for rendering. Possibly I'm taking the wrong approach, but it seems to me reasonable to minimize CPU storage, and other issues like our agents ("turtles") having x,y,z,heading,color, etc attributes (again, already in typed arrays). I definitely don't want to have a convert step every draw from JS/CPU data to webgl/three .. I want to have the JS/CPU to be webgl/three ready.

My guess is that there is an isomorphism from our current architecture to three's. But I keep running into details that seem to clash.

So if there is an extension/plugin approach, or simply ways to use three as-is, I'd like easier access to help.

[backspaces]

BTW: Thank you for your interest .. feel free to close this, it's not a bug. But it would be nifty to have a better understanding of how to "extend" or build a "plugin" .. hence the Forum or Documentation title. Especially with es6 and webgl2.

[mrdoob]

I think what you really want is to port your thing to glsl...?

https://www.shadertoy.com/view/4dVXWz

[backspaces]

No. I want to integrate into Three. And I would like agentscript programmers to be able to use Three, integrated into our renderers. But I don't know how, and I don't think irc & slashdot questions will work.

So by integration I mean a plugin/extension documentation. How do those of us who want to build a framework/library on top of Three go about it? Preferably using es6 "inside", maybe bundling outside. WebGL2 may be important but I'm not sure.

This could mean extending existing shaders but not abandoning Three's shaders. If the shaders are Template Strings or something similar, then my bet is shaders could be extended using ${xx} templates at key places such as one in the global space, and one in the main for both vertex shaders and fragment shaders.

Extensibility may not be a top priority of Three, that'd be understandable .. it's amazing what it does now. Maybe just more documentation ( or my reading all of the existing docs! :).

Bottom line: I'm going to commit to Three until I run into problems I can't resolve. My team needs it https://www.simtable.com/ for further simulations for fire, police, .. emergency first responders of all sorts.

Thanks you for your response.

[backspaces]

I'm closing this for now, while I complete the initial conversion of the patches layer of agentscript. I'll add much more precise issues as I go if I feel they may be important to others like myself making extensive use of es6 and Modules. What a GREAT system, btw!