Changeset 19992

Timestamp:

01/23/16 22:57:50 (9 years ago)

Author:

dlcheng

Message:

CHG (javascript): Implementing point cloud rendering.

Location:

issm/trunk-jpl/src/m/plot

Files:

• applyoptions.js (modified) (6 diffs)
• webgl.js (modified) (2 diffs)

issm/trunk-jpl/src/m/plot/applyoptions.js

@@ -21 +21 @@
                                         })
                                 });
-                                data = data[node["movieFrame"]].slice(0,-1);
+                                data = data[node['movieFrame']].slice(0,-1);
                                 console.log(data);
                         } //}}}
@@ -209 +209 @@
         }
         //}}}
-        //Make texture canvas //{{{
+        //texture canvas //{{{
         var tcontext,tcanvas,tcanvasid,tcanvashtml,tURL,tgradient;
         tcanvasid = 'texturecanvas';
@@ -235 +235 @@
         tcontext.fillRect(0,0,256,256);
         tURL = tcanvashtml.toDataURL();
-        node["texture"] = initTexture(gl,tURL);
+        node['texture'] = initTexture(gl,tURL);
         //}}}
-        //expdisp contours
+        //expdisp contours {{{
         if (options.exist('expdisp')) {
-                canvas.nodes["expdisp"] = Node(gl,options);
-                var node = canvas.nodes["expdisp"];
+                canvas.nodes['expdisp'] = Node(gl,options);
+                var node = canvas.nodes['expdisp'];
                 
                 //declare variables:  {{{
@@ -262 +262 @@
                 //}}}
 
-                //Compute coordinates and data range:
+                //Compute coordinates and data range: //{{{
                 var modelxlim = [ArrayMin(x),ArrayMax(x)];
                 var modelylim = [ArrayMin(y),ArrayMax(y)];
@@ -275 +275 @@
                 zmin = zlim[0];
                 zmax = zlim[1];
-
-                //Compute scaling: 
+                //}}}
+
+                //Compute scaling: //{{{
                 var scale = 1 / (xmax - xmin);
-                node["shaderName"] = "colored";
-                node["shader"] = gl["shaders"][node["shaderName"]]["program"];
-                node["scale"] = [scale, scale, scale*options.getfieldvalue('heightscale',1)];
-                node["translation"] = [(xmin + xmax) / (-2 / scale), (ymin + ymax) / (-2 / scale), (zmin + zmax) / (-2 / scale)];
-                node["modelMatrix"] = recalculateModelMatrix(node);
-                node["drawMode"] = gl.LINE_LOOP;
-                node["drawOrder"] = 0;
-                node["useIndexBuffer"] = false;
-                node["disableDepthTest"] = true;
-                                        
+                node['shaderName'] = 'colored';
+                node['shader'] = gl['shaders'][node['shaderName']]['program'];
+                node['scale'] = [scale, scale, scale*options.getfieldvalue('heightscale',1)];
+                node['translation'] = [(xmin + xmax) / (-2 / scale), (ymin + ymax) / (-2 / scale), (zmin + zmax) / (-2 / scale)];
+                node['modelMatrix'] = recalculateModelMatrix(node);
+                node['drawMode'] = gl.LINE_LOOP;
+                node['drawOrder'] = 0;
+                node['useIndexBuffer'] = false;
+                node['disableDepthTest'] = true;
+                //}}}
+
                 //some defaults:
                 colors.itemSize = 4;
@@ -309 +311 @@
                 }
 
-                /*Initalize buffers: */
-                node["arrays"] = [vertices, colors];
-                node["buffers"] = initBuffers(gl, node["arrays"]);
-        }
+                //Initalize buffers:
+                node['arrays'] = [vertices, colors];
+                node['buffers'] = initBuffers(gl, node['arrays']);
+        } //}}}
+        //cloud of points {{{
+        if (options.exist('cloud')) {
+                canvas.nodes['cloud'] = Node(gl,options);
+                var node = canvas.nodes['cloud'];
+
+                //declare variables:  {{{
+                var vertices = [];
+                var indices = [];
+                var colors = [];
+                var rgbcolor = [];
+                var xmin,xmax;
+                var ymin,ymax;
+                var zmin,zmax;
+                var scale;
+                
+                //Process data and model
+                var x = options.getfieldvalue('cloud')['x'];
+                var y = options.getfieldvalue('cloud')['y'];
+                var z = Array.apply(null, Array(x.length)).map(Number.prototype.valueOf,0);
+                
+                if (options.getfieldvalue('cloud')['z']) {
+                        z = options.getfieldvalue('cloud')['z'];
+                }
+                //}}}
+
+                //Compute coordinates and data range: //{{{
+                var modelxlim = [ArrayMin(x),ArrayMax(x)];
+                var modelylim = [ArrayMin(y),ArrayMax(y)];
+                var modelzlim = [ArrayMin(z),ArrayMax(z)];
+                var xlim = options.getfieldvalue('xlim',modelxlim);
+                var ylim = options.getfieldvalue('ylim',modelylim);
+                var zlim = options.getfieldvalue('zlim',modelzlim);
+                xmin = xlim[0];
+                xmax = xlim[1];
+                ymin = ylim[0];
+                ymax = ylim[1];
+                zmin = zlim[0];
+                zmax = zlim[1];
+                //}}}
+
+                //Compute scaling: //{{{
+                var scale = 1 / (xmax - xmin);
+                node['shaderName'] = 'colored';
+                node['shader'] = gl['shaders'][node['shaderName']]['program'];
+                node['scale'] = [scale, scale, scale*options.getfieldvalue('heightscale',1)];
+                node['translation'] = [(xmin + xmax) / (-2 / scale), (ymin + ymax) / (-2 / scale), (zmin + zmax) / (-2 / scale)];
+                node['modelMatrix'] = recalculateModelMatrix(node);
+                node['drawMode'] = gl.POINTS;
+                node['drawOrder'] = 0;
+                node['useIndexBuffer'] = false;
+                node['disableDepthTest'] = true;
+                //}}}
+
+                //some defaults:
+                colors.itemSize = 4;
+
+                //retrieve some options
+                var linewidth=options.getfieldvalue('linewidth',1);
+                var edgecolor=options.getfieldvalue('edgecolor','black'); //RGBCOLOR?
+
+                vertices.itemSize = 3;
+                for(var i = 0; i < x.length; i++){
+                        vertices[vertices.length] = x[i];
+                        vertices[vertices.length] = y[i];
+                        vertices[vertices.length] = z[i];
+
+                        //edgecolor
+                        rgbcolor = [0.0, 0.0, 0.0];
+                        colors[colors.length] = rgbcolor[0];
+                        colors[colors.length] = rgbcolor[1];
+                        colors[colors.length] = rgbcolor[2];
+                        colors[colors.length] = 1.0;
+                }
+
+                //Initalize buffers:
+                node['arrays'] = [vertices, colors];
+                node['buffers'] = initBuffers(gl, node['arrays']);
+        } //}}}
 }

issm/trunk-jpl/src/m/plot/webgl.js

@@ -199 +199 @@
                 '',
                 'void main(void) {',
+                '       gl_PointSize = 3.0;',
                 '       gl_Position = uMVPMatrix * vec4(aVertexPosition.xyz, 1.0);',
                 '       vColor = vec4(aVertexColor.xyz, uAlpha);',
@@ -221 +222 @@
                 '',
                 'void main(void) {',
+                '       gl_PointSize = 3.0;',
                 '       gl_Position = uMVPMatrix * vec4(aVertexPosition.xyz, 1.0);',
                 '       vTextureCoord = aTextureCoord;',