WebSharper bindings for the glMatrix library
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
WebSharper.GlMatrix.Tests Add explicit FSharp.Core reference Oct 4, 2018
docs Update doc and add license. Oct 1, 2013
LICENSE.md Version 3.0-alpha; Apache license Dec 3, 2014
WebSharper.GlMatrix.sln Update for WebSharper without IntelliFactory prefix Feb 23, 2015
build.fsx Get common buils scripts from build-script repo Jan 29, 2018
ivy.xml Fix build, loosen WebSharper dependency Jan 23, 2018
paket.dependencies Add explicit FSharp.Core reference Oct 4, 2018
paket.lock Add explicit FSharp.Core reference Oct 4, 2018



This WebSharper Extension provides a set of classes and functions almost identical to the ones documented in glMatrix, version 2.2.0. When used in WebSharper projects, these stub classes delegate the work to the actual classes implemented by the browser.

After adding the reference to the project all the classes can be found under the IntelliFactory.WebSharper.GlMatrix module.


The GlMatrix WebSharper extension is as far as possible a one-to-one mapping of glMatrix. Therefore, this documentation will only discuss the differences between glMatrix and the WebSharper extension. For a complete reference, see the glMatrix homepage.

Differences with the JavaScript API

In order to enforce strong typing and take advantage of F# features such as method overloading, we made a few modifications over the glMatrix API.

  • While glMatrix works on Float32Array objects, the WebSharper extension defines classes for each one of Mat2, Mat3, Mat4, Vec2, Vec2d, Vec3, Vec4 and Quad. These classes inherit from the standard Float32Array, which allows you to pass them directly to WebGL methods such as the Uniform series.

Using matrix transformations with WebGL

As the name suggests, glMatrix is mainly intended as a toolbox for coordinate transformation for WebGL. The following example shows a typical use to set the projection and modelview matrices of a given WebGL shader program.

let SetupView (gl : WebGLRenderingContext, program : WebGLProgram) =
    // Set the projection matrix
    let proj = Mat4.Perspective(Mat4.Create(), 45., 4./3., 0.1, 1000.)
    let u_projection = gl.GetUniformLocation(program, "projectionMatrix")
    gl.UniformMatrix4fv(u_projection, false, proj)

    // Set the modelview matrix
    let cameraPosition = Mat4.Identity(Mat4.Create())
    Mat4.Translate(cameraPosition, cameraPosition, Vec3.FromValues(0.2, 2.3, -5.2)) |> ignore
    let u_modelview = gl.GetUniformLocation(program, "modelviewMatrix")
    gl.UniformMatrix4fv(u_modelview, false, cameraPosition)