lore-engine - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

example/flybrain3.js

 (function() {
     let lore = Lore.init('lore', {
-        clearColor: '#222222'
+        clearColor: '#222222',
+        enableTransparency: true
     });
@@ -16,3 +17,3 @@
         original_data = data;
-        pointHelper = new Lore.PointHelper(lore, 'Seppli', 'default');
+        pointHelper = new Lore.PointHelper(lore, 'Seppli', 'smoothcircle');
         pointHelper.setPositionsXYZHSS(data['x'], data['y'], data['z'], data['c'], 1.0, 1.0)
@@ -19,0 +20,0 @@ pointHelper.setPointScale(1.0);

gulpfile.js

@@ -59,2 +59,3 @@ var fs = require('fs');
     'src/Shaders/Circle.js',
+    'src/Shaders/SmoothCircle.js',
     'src/Shaders/SimpleSphere.js',
@@ -61,0 +62,0 @@ 'src/Shaders/Sphere.js',

package.json

 {
   "name": "lore-engine",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A WebGL based 3D data visualization engine.",
@@ -5,0 +5,0 @@ "main": "./dist/lore.js",

src/Cameras/CameraBase.js

@@ -0,1 +1,2 @@
+
 /** 
@@ -2,0 +3,0 @@ * An abstract class representing the base for camera implementations.

src/Core/Renderer.js

@@ -24,3 +24,4 @@ /**
             center: new Lore.Vector3f(),
-            enableDepthTest: true
+            enableDepthTest: true,
+            enableTransparency: false
         }
@@ -31,2 +32,3 @@
         this.canvas = document.getElementById(targetId);
+        this.webgl2 = true;
         this.parent = this.canvas.parentElement;
@@ -68,6 +70,11 @@ this.fps = 0;
 
-        this.gl = this.canvas.getContext('webgl', settings) || 
-            this.canvas.getContext('experimental-webgl', settings);
+        this.gl = this.canvas.getContext('webgl2', settings) || this.canvas.getContext('experimental-webgl2');
 
         if (!this.gl) {
+          this.webgl2 = false;
+          this.gl = this.canvas.getContext('webgl', settings) ||
+              this.canvas.getContext('experimental-webgl', settings);
+        }
+
+        if (!this.gl) {
             console.error('Could not initialize the WebGL context.');
@@ -87,13 +94,7 @@ return;
             console.info('High precision support: ' + hasHighp);
+
+            console.info('WebGL2 supported: ' + this.webgl2);
         }
 
-        // Blending
-        /*
-        g.blendFunc(g.SRC_ALPHA, g.ONE);
-        g.enable(g.BLEND);
-        g.disable(g.DEPTH_TEST);
-        */
-
         // Extensions
-        
         let oes = 'OES_standard_derivatives';
@@ -120,20 +121,29 @@ let extOes = g.getExtension(oes);
 
+        // Blending
+        if (!this.webgl2) {
+          this.setClearColor(this.opts.clearColor);
+          g.clearDepth(this.opts.clearDepth);
 
-        this.setClearColor(this.opts.clearColor);
-        g.clearDepth(this.opts.clearDepth);
-
-        if (this.opts.enableDepthTest) {
-            g.enable(g.DEPTH_TEST);
-            g.depthFunc(g.LEQUAL);
-            
-            if (this.opts.verbose) {
-                console.log('enable depth test');
-            }
+          if (this.opts.enableTransparency) {
+            g.blendFunc(g.SRC_ALPHA, g.ONE_MINUS_SRC_ALPHA);
+            g.enable(g.BLEND);
+            g.disable(g.DEPTH_TEST);
+          }
+          else if (this.opts.enableDepthTest) {
+              g.enable(g.DEPTH_TEST);
+              g.depthFunc(g.LEQUAL);
+              
+              if (this.opts.verbose) {
+                  console.log('enable depth test');
+              }
+          }
+        } else {
+            g.blendEquationSeparate(g.FUNC_ADD, g.FUNC_ADD);
+            g.blendFuncSeparate(g.ONE, g.ONE_MINUS_SRC_ALPHA, g.ONE, g.ONE_MINUS_SRC_ALPHA);
+            g.enable(g.BLEND);
+            g.disable(g.DEPTH_TEST);
+            // g.depthFunc(g.ALWAYS);
+            // g.depthMask(true);
         }
 
-        /*
-        g.blendFunc(g.SRC_ALPHA, g.ONE_MINUS_SRC_ALPHA);
-        g.enable(g.BLEND);
-        */
-
         setTimeout(function () {
@@ -246,3 +256,3 @@ _this.updateViewport(0, 0, _this.getWidth(), _this.getHeight());
                 this.fpsCount++;
-            } else {
+            } else {// 
                 this.opts.fpsElement.innerHTML = Math.round(this.fps / this.fpsCount);
@@ -256,2 +266,3 @@ this.fpsCount = 0;
         this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
+        // this.gl.clear(this.gl.COLOR_BUFFER_BIT);
         this.render(this.camera, this.geometries);
@@ -273,3 +284,3 @@ // this.effect.unbind();
         let shader = Lore.getShader(shaderName);
-        shader.init(this.gl);
+        shader.init(this.gl, this.webgl2);
         let geometry = new Lore.Geometry(name, this.gl, shader);
@@ -276,0 +287,0 @@

src/Core/Shader.js

@@ -9,3 +9,3 @@ /**
 Lore.Shader = class Shader {
-    constructor(name, uniforms, vertexShader, fragmentShader) {
+    constructor(name, glVersion, uniforms, vertexShader, fragmentShader) {
         this.name = name;
@@ -15,2 +15,3 @@ this.uniforms = uniforms || {};
         this.fragmentShader = fragmentShader || [];
+        this.glVersion = glVersion;
         this.gl = null;
@@ -20,3 +21,3 @@ this.program = null;
         this.lastTime = new Date().getTime();
-
+        
         // Add the two default shaders (the same shaders as in getVertexShader)
@@ -31,3 +32,3 @@ this.uniforms['modelViewMatrix'] = new Lore.Uniform('modelViewMatrix',
     clone() {
-        return new Lore.Shader(this.name, this.uniforms, this.vertexShader, this.fragmentShader);
+        return new Lore.Shader(this.name, this.glVersion, this.uniforms, this.vertexShader, this.fragmentShader);
     }
@@ -43,9 +44,16 @@
 
-    getVertexShader(gl) {
+    getVertexShader(gl, isWebGL2 = false) {
         let shader = gl.createShader(gl.VERTEX_SHADER);
+        let vertexShaderCode = '';
 
-        let vertexShaderCode = 'uniform mat4 modelViewMatrix;\n' +
+        if (!isWebGL2 && this.glVersion === 2) {
+          throw('The shader expects WebGL 2.0');
+        } else if (this.glVersion === 2) {
+          vertexShaderCode += '#version 300 es\n';
+        }
+
+        vertexShaderCode += 'uniform mat4 modelViewMatrix;\n' +
             'uniform mat4 projectionMatrix;\n\n' +
             this.getVertexShaderCode();
-
+            
         gl.shaderSource(shader, vertexShaderCode);
@@ -58,4 +66,13 @@ gl.compileShader(shader);
 
-    getFragmentShader(gl) {
+    getFragmentShader(gl, isWebGL2 = false) {
         let shader = gl.createShader(gl.FRAGMENT_SHADER);
+
+        let fragmentShaderCode = '';
+
+        if (!isWebGL2 && this.glVersion === 2) {
+          throw('The shader expects WebGL 2.0');
+        } else if (this.glVersion === 2) {
+          fragmentShaderCode += '#version 300 es\n';
+        }
+
         // Adding precision, see:
@@ -65,3 +82,3 @@ // http://stackoverflow.com/questions/27058064/why-do-i-need-to-define-a-precision-value-in-webgl-shaders
         // http://stackoverflow.com/questions/13780609/what-does-precision-mediump-float-mean
-        let fragmentShaderCode = '#ifdef GL_OES_standard_derivatives\n#extension GL_OES_standard_derivatives : enable\n#endif\n\n' +
+        fragmentShaderCode += '#ifdef GL_OES_standard_derivatives\n#extension GL_OES_standard_derivatives : enable\n#endif\n\n' +
             '#ifdef GL_ES\nprecision highp float;\n#endif\n\n' +
@@ -77,7 +94,7 @@ this.getFragmentShaderCode();
 
-    init(gl) {
+    init(gl, isWebGL2 = false) {
         this.gl = gl;
         this.program = this.gl.createProgram();
-        let vertexShader = this.getVertexShader(this.gl);
-        let fragmentShader = this.getFragmentShader(this.gl);
+        let vertexShader = this.getVertexShader(this.gl, isWebGL2);
+        let fragmentShader = this.getFragmentShader(this.gl, isWebGL2);
 
@@ -84,0 +101,0 @@ if (!vertexShader || !fragmentShader) {

src/Lore.js

@@ -6,3 +6,3 @@ /**
 let Lore = {
-    Version: '1.0.0'
+    Version: '1.0.2'
 };
@@ -54,3 +54,3 @@
     
-    Lore.getGrakaInfo(canvas);
+    // Lore.getGrakaInfo(canvas);
     
@@ -57,0 +57,0 @@ var cc = Lore.Color.fromHex(this.opts.clearColor);

src/Math/Statistics.js

@@ -97,2 +97,53 @@ /** A helper class containing statistics methods. */
     /**
+     * Normalize / scale an array between 0 and 1 (outliers will be set to max or min respectively).
+     * The IQR method is used for outlier detection.
+     * 
+     * @param {Number[]} arr An array.
+     * @returns {Number[]} The normalized / scaled array.
+     */
+    static normalizeNoOutliers(arr) {
+        let newArr = arr.slice();
+        let max = Number.NEGATIVE_INFINITY;
+        let min = Number.POSITIVE_INFINITY;
+
+        newArr.sort((a, b) => a - b);
+
+        let q1 = Lore.Statistics.getPercentile(newArr, 0.25);
+        let q3 = Lore.Statistics.getPercentile(newArr, 0.75);
+        let iqr = q3 - q1;
+        let lower = q1 - (iqr * 1.5);
+        let upper = q3 + (iqr * 1.5);
+        
+        let diff = upper - lower;
+
+        for (let i = 0; i < newArr.length; i++) {
+            newArr[i] = (newArr[i] - lower) / diff;
+            if (newArr[i] < 0.0) {
+                newArr[i] = 0.0;
+            } else if (newArr[i] > 1.0) {
+                newArr[i] = 1.0;
+            }
+        }
+        
+        return newArr;
+    }
+
+    /**
+     * Gets the percentile from a sorted array.
+     * 
+     * @param {Number[]} arr A sorted array.
+     * @param {Number} percentile The percentile (e.g. 0.25).
+     * @returns {Number} The percentile value.
+     */
+    static getPercentile(arr, percentile) {
+        let index = percentile * arr.length;
+
+        if (Math.floor(index) === index) {
+            return (arr[index - 1] + arr[index]) / 2.0;
+        } else {
+            return arr[Math.floor(index)];
+        }
+    }
+
+    /**
      * Scales a number to within a given scale.
@@ -99,0 +150,0 @@ *

src/Shaders/Circle.js

@@ -1,2 +0,2 @@
-Lore.Shaders['circle'] = new Lore.Shader('Circle', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['circle'] = new Lore.Shader('Circle', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                      fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogEnd: new Lore.Uniform('fogEnd', 0.0, 'float'),

src/Shaders/Coordinates.js

@@ -1,2 +0,2 @@
-Lore.Shaders['coordinates'] = new Lore.Shader('Coordinates', { }, [
+Lore.Shaders['coordinates'] = new Lore.Shader('Coordinates', 1, { }, [
     'attribute vec3 position;',
@@ -3,0 +3,0 @@ 'attribute vec3 color;',

src/Shaders/Default.js

@@ -1,2 +0,2 @@
-Lore.Shaders['default'] = new Lore.Shader('Default', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['default'] = new Lore.Shader('Default', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                        type: new Lore.Uniform('type', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),

src/Shaders/DefaultAnimated.js

@@ -1,2 +0,2 @@
-Lore.Shaders['defaultAnimated'] = new Lore.Shader('DefaultAnimated', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['defaultAnimated'] = new Lore.Shader('DefaultAnimated', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                                        fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogEnd: new Lore.Uniform('fogEnd', 0.0, 'float'),

src/Shaders/DefaultEffect.js

@@ -1,2 +0,2 @@
-Lore.Shaders['defaultEffect'] = new Lore.Shader('DefaultEffect', {}, [
+Lore.Shaders['defaultEffect'] = new Lore.Shader('DefaultEffect', 1, {}, [
     'attribute vec2 v_coord;',
@@ -3,0 +3,0 @@ 'uniform sampler2D fbo_texture;',

src/Shaders/FXAAEffect.js

@@ -1,2 +0,2 @@
-Lore.Shaders['fxaaEffect'] = new Lore.Shader('FXAAEffect', { resolution: new Lore.Uniform('resolution', [ 500.0, 500.0 ], 'float_vec2') }, [
+Lore.Shaders['fxaaEffect'] = new Lore.Shader('FXAAEffect', 1, { resolution: new Lore.Uniform('resolution', [ 500.0, 500.0 ], 'float_vec2') }, [
     'attribute vec2 v_coord;',
@@ -3,0 +3,0 @@ 'uniform sampler2D fbo_texture;',

src/Shaders/SimpleSphere.js

@@ -1,2 +0,2 @@
-Lore.Shaders['simpleSphere'] = new Lore.Shader('SimpleSphere', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['simpleSphere'] = new Lore.Shader('SimpleSphere', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                      fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogEnd: new Lore.Uniform('fogEnd', 0.0, 'float'),

src/Shaders/Sphere.js

@@ -1,2 +0,2 @@
-Lore.Shaders['sphere'] = new Lore.Shader('Sphere', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['sphere'] = new Lore.Shader('Sphere', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                      fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogEnd: new Lore.Uniform('fogEnd', 0.0, 'float'),

src/Shaders/Tree.js

@@ -1,2 +0,2 @@
-Lore.Shaders['tree'] = new Lore.Shader('Tree', { size: new Lore.Uniform('size', 5.0, 'float'),
+Lore.Shaders['tree'] = new Lore.Shader('Tree', 1, { size: new Lore.Uniform('size', 5.0, 'float'),
                                                  fogStart: new Lore.Uniform('fogStart', 0.0, 'float'),
@@ -3,0 +3,0 @@ fogEnd: new Lore.Uniform('fogEnd', 0.0, 'float'),

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

43903125

increased by0.02%

Number of package files

177

increased by0.57%

Lines of code

32504

increased by0.75%

No dependency changes