How to use the gl-matrix.mat3.create function in gl-matrix

To help you get started, we’ve selected a few gl-matrix examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github yoo2001818 / webglue / client-test / scene / channelBox.js View on Github external
0, 1, 3, 3, 2, 0,
        0, 1, 3, 3, 2, 0,
        0, 1, 3, 3, 2, 0,
        0, 1, 3, 3, 2, 0
      ]
    }
  });
  let box = renderer.geometries.create(calcNormals(originalData));
  let shader = renderer.shaders.create(
    require('../shader/phong.vert'),
    require('../shader/phong.frag')
  );
  let texture = renderer.textures.create(require('../texture/2.png'));

  let model1Mat = mat4.create();
  let model1Normal = mat3.create();

  return (delta, context) => {
    // mat4.rotateY(model1Mat, model1Mat, Math.PI * delta / 1000 / 2);
    // mat3.normalFromMat4(model1Normal, model1Mat);

    renderer.render({
      options: {
        clearColor: new Float32Array([0, 0, 0, 1]),
        clearDepth: 1,
        cull: gl.BACK,
        depth: gl.LEQUAL
      },
      uniforms: Object.assign({}, context.camera, {
        uPointLight: [{
          position: [0, 0, 8],
          color: '#ffffff',
github Whatever-Inc / KAMRA-Deja-Vu / experiments / 19 - Particle to Face / src / deformable-face-geometry.js View on Github external
init(featurePoint2D, imageWidth, imageHeight, planeHeight, cameraZ = 2435.782592) {
    // convert to image coord to world coord
    let featurePoint3D, size
    {
      let min = [Number.MAX_VALUE, Number.MAX_VALUE]
      let max = [Number.MIN_VALUE, Number.MIN_VALUE]
      let mtx = mat3.create()
      let scale = planeHeight / imageHeight
      mat3.scale(mtx, mtx, [scale, -scale])
      mat3.translate(mtx, mtx, [-imageWidth / 2, -imageHeight / 2])
      featurePoint3D = featurePoint2D.map((p) => {
        let q = vec2.transformMat3([], p, mtx)
        vec2.min(min, min, q)
        vec2.max(max, max, q)
        return q
      })
      size = vec2.sub([], max, min)
    }

    // calc z position
    let scale = vec2.len(size) / this.standardFace.size
    {
      let min = [Number.MAX_VALUE, Number.MAX_VALUE]
github rezaali / webgl-sketches / triangulate / triangulate.js View on Github external
geoWire.faces( lines, { size: 2 } )

  geoPoints = glGeometry( gl );
  geoPoints.attr( 'aPosition', wirePositions );
} );


// Set the canvas size to fill the window and its pixel density
var mobile = isMobile( navigator.userAgent );
var dpr = mobile ? 1 : ( window.devicePixelRatio || 1 );
window.addEventListener( 'resize', fit( canvas, null, dpr ), false );

// Setup Matricies
var projection = mat4.create();
var normalm4 = mat4.create();
var normalm3 = mat3.create();
var view = mat4.create();

// Setup Shaders
var vertexShader = glslify( './shaders/shader.vert' );
var fragmentShader = glslify( './shaders/shader.frag' );
var shader = glShader( gl, vertexShader, fragmentShader );

var vertexWireframeShader = glslify( './shaders/shaderDebug.vert' );
var fragmentWireframeShader = glslify( './shaders/shaderDebug.frag' );
var shaderDebug = glShader( gl, vertexWireframeShader, fragmentWireframeShader );

var color = [ 1.0, 1.0, 1.0, 1.0 ];
var colorPoints = [ 1.0, 1.0, 1.0, 0.5 ];
var colorWire = [ 1.0, 1.0, 1.0, 0.5 ];

// Setup Sketch Variables
github Whatever-Inc / KAMRA-Deja-Vu / experiments / 27 - Face image maker / src / deformable-face-geometry.js View on Github external
p[1] *= perspective
        p[2] = z
        vec2.min(min, min, p)
        vec2.max(max, max, p)
      })
      size = vec2.sub([], max, min)
      scale = this.standardFace.size / vec2.len(size)
    }

    // normalize captured feature point coords
    {
      let center = featurePoint3D[41]
      let yAxis = vec2.sub([], featurePoint3D[75], featurePoint3D[7])
      let angle = Math.atan2(yAxis[1], yAxis[0]) - Math.PI * 0.5

      let mtx = mat3.create()
      mat3.rotate(mtx, mtx, -angle)
      mat3.scale(mtx, mtx, [scale, scale])
      mat3.translate(mtx, mtx, vec2.scale([], center, -1))

      this.matrixFeaturePoints = new THREE.Matrix4()
      this.matrixFeaturePoints.makeRotationZ(angle)
      let s = 1 / scale
      this.matrixFeaturePoints.scale(new THREE.Vector3(s, s, s))
      this.matrixFeaturePoints.setPosition(new THREE.Vector3(center[0], center[1], center[2]))

      this.normalizedFeaturePoints = featurePoint3D.map((p) => {
        let q = vec2.transformMat3([], p, mtx)
        q[2] = p[2] * scale
        return q
      })
    }
github Whatever-Inc / KAMRA-Deja-Vu / experiments / 27 - Face image maker / src / webcam-plane.js View on Github external
for (let i = 71; i < 80; i++) {
        let p = vec2.sub([], this.standardFaceData.getFeatureVertex(i), faceCenter)
        vec2.scale(p, p, scale)
        p[1] *= -1
        vec2.transformMat3(p, p, rotation)
        vec2.add(p, p, center)
        this.rawFeaturePoints[i] = p
      }
    }

    // convert to canvas coord to world coord
    let size
    {
      let min = [Number.MAX_VALUE, Number.MAX_VALUE]
      let max = [Number.MIN_VALUE, Number.MIN_VALUE]
      let mtx = mat3.create()
      let scale = this.scale.y / 180
      mat3.scale(mtx, mtx, [scale, -scale, scale])
      mat3.translate(mtx, mtx, [-160, -90, 0])
      this.featurePoint3D = this.rawFeaturePoints.map((p) => {
        let q = vec2.transformMat3([], p, mtx)
        vec2.min(min, min, q)
        vec2.max(max, max, q)
        return q
      })
      size = vec2.sub([], max, min)
    }

    // calc z position
    let scale = vec2.len(size) / this.standardFaceData.size
    {
      let min = [Number.MAX_VALUE, Number.MAX_VALUE]
github Kitware / vtk-js / Sources / Rendering / OpenGL / Actor / index.js View on Github external
export function extend(publicAPI, model, initialValues = {}) {
  Object.assign(model, DEFAULT_VALUES, initialValues);

  // Inheritance
  vtkViewNode.extend(publicAPI, model, initialValues);

  model.keyMatrixTime = {};
  macro.obj(model.keyMatrixTime, { mtime: 0 });
  model.keyMatrices = {
    normalMatrix: mat3.create(),
    mcwc: mat4.create(),
  };

  // Build VTK API
  macro.setGet(publicAPI, model, ['context']);

  macro.get(publicAPI, model, ['activeTextures']);

  // Object methods
  vtkOpenGLActor(publicAPI, model);
}
github Whatever-Inc / KAMRA-Deja-Vu / experiments / 09 - Editor / src / deformableface.js View on Github external
let normalized = points.map((p) => {
      return vec2.transformMat3([], p, mtx)
    })

    // open the mouth
    let lipPair = [[45, 61], [47, 60], [49, 59], [52, 58], [53, 57], [54, 56]]
    let lipThickness = lipPair.map((pair) => {
      return normalized[pair[0]][1] - normalized[pair[1]][1]
    })

    let mouthWidth = normalized[50][0] - normalized[44][0]
    let mouthHeight = normalized[60][1] - normalized[57][1]
    let offset = mouthWidth * 0.2 - mouthHeight
    let origin = vec2.lerp([], normalized[46], normalized[48], 0.5)
    scale = (Math.abs(normalized[53][1] - origin[1]) + offset) / Math.abs(normalized[53][1] - origin[1])
    mtx = mat3.create()
    mat3.translate(mtx, mtx, origin)
    mat3.scale(mtx, mtx, [1, scale])
    mat3.translate(mtx, mtx, vec2.scale([], origin, -1))
    for (let i = 44; i <= 61; i++) {
      vec2.transformMat3(normalized[i], normalized[i], mtx)
    }
    lipPair.forEach((pair, i) => {
      normalized[pair[1]][1] = normalized[pair[0]][1] - lipThickness[i]
    })

    return normalized
  }
github Whatever-Inc / KAMRA-Deja-Vu / experiments / 09 - Editor / src / main.js View on Github external
placeEditPoints() {
    this.editPoints = []

    this.tracker.currentPosition.forEach(this.addEditPoint.bind(this))

    let fpCenter = vec2.lerp([], this.face.getFPCoord(14), this.face.getFPCoord(0), 0.5)
    let scale = 1.0 / vec2.sub([], this.face.getFPCoord(14), fpCenter)[0]
    
    let v0 = this.tracker.currentPosition[0]
    let v1 = this.tracker.currentPosition[14]
    let center = vec2.lerp(vec2.create(), v0, v1, 0.5)
    let xAxis = vec2.sub([], v1, center)
    scale *= vec2.len(xAxis)
    let rotation = mat3.create()
    mat3.rotate(rotation, rotation, Math.atan2(xAxis[1], xAxis[0]))
    for (let i = 71; i < 80; i++) {
      let p = vec2.sub([], this.face.getFPCoord(i), fpCenter)
      vec2.scale(p, p, scale)
      p[1] *= -1
      vec2.transformMat3(p, p, rotation)
      vec2.add(p, p, center)
      this.addEditPoint(p, i)
    }
  }
github xml3d / xml3d.js / src / renderer / webgl / render-passes / scene-pass.js View on Github external
renderObjectsToActiveBuffer: (function () {
        var tmpModelMatrix = mat4.create();
        var tmpModelMatrixN = mat3.create();
        var tmpModelView = mat4.create();
        var tmpModelViewProjection = mat4.create();
        var tmpModelViewN = mat3.create();
        var c_objectSystemUniforms = ["modelMatrix", "modelMatrixN", "modelViewMatrix", "modelViewProjectionMatrix", "modelViewMatrixN"];

        return function (objectArray, scene, target, systemUniforms, sceneParameterFilter, opt) {
            var objCount = 0;
            var primitiveCount = 0;
            var stats = opt.stats || {};
            var transparent = opt.transparent === true || false;
            var gl = this.renderInterface.context.gl;
            var program = opt.program || objectArray[0].getProgram();

            if (objectArray.length == 0) {
                return stats;
            }

            if (transparent) {
                gl.enable(gl.BLEND);
github mapbox / mapbox-gl-js / src / render / program / fill_extrusion_program.js View on Github external
const fillExtrusionUniformValues = (
    matrix: Float32Array,
    painter: Painter,
    shouldUseVerticalGradient: boolean,
    opacity: number
): UniformValues => {
    const light = painter.style.light;
    const _lp = light.properties.get('position');
    const lightPos = [_lp.x, _lp.y, _lp.z];
    const lightMat = mat3.create();
    if (light.properties.get('anchor') === 'viewport') {
        mat3.fromRotation(lightMat, -painter.transform.angle);
    }
    vec3.transformMat3(lightPos, lightPos, lightMat);

    const lightColor = light.properties.get('color');

    return {
        'u_matrix': matrix,
        'u_lightpos': lightPos,
        'u_lightintensity': light.properties.get('intensity'),
        'u_lightcolor': [lightColor.r, lightColor.g, lightColor.b],
        'u_vertical_gradient': +shouldUseVerticalGradient,
        'u_opacity': opacity
    };
};