JSFiddle - React, Tailwind, and code Playground

by gregross

HTML

<div id='surfacePlotDiv'>
    <!-- SurfacePlot goes here... -->
</div>

JavaScript

/////////////////// javascript.js file contents begin here //////////////////

function registerNameSpace(ns) {
    var nsParts = ns.split(".");
    var root = window;
    var n = nsParts.length;

    for (var i = 0; i < n; i++) {
        if (typeof root[nsParts[i]] == "undefined") root[nsParts[i]] = new Object();

        root = root[nsParts[i]];
    }
}

registerNameSpace("greg.ross.visualisation");

/*
 * This is the main class and entry point of the tool
 * and represents the Google viz API.
 * ***************************************************
 */
greg.ross.visualisation.SurfacePlot = function (container) {
    this.containerElement = container;
}

greg.ross.visualisation.SurfacePlot.prototype.draw = function (data, options) {
    var xPos = options.xPos;
    var yPos = options.yPos;
    var w = options.width;
    var h = options.height;
    var colourGradient = options.colourGradient;
    var fillPolygons = options.fillPolygons;
    var tooltips = options.tooltips;
    var xTitle = options.xTitle;
    var yTitle = options.yTitle;
    var zTitle = options.zTitle;
    var restrictXRotation = options.restrictXRotation;

    if (this.surfacePlot == undefined) this.surfacePlot = new greg.ross.visualisation.JSSurfacePlot(xPos, yPos, w, h, colourGradient, this.containerElement, fillPolygons, tooltips, xTitle, yTitle, zTitle, restrictXRotation);

    this.surfacePlot.redraw(data);
}

/*
 * This class does most of the work.
 * *********************************
 */
greg.ross.visualisation.JSSurfacePlot = function(x, y, width, height, colourGradient, targetElement, fillRegions, tooltips, xTitle, yTitle, zTitle, restrictXRotation){
    this.targetDiv;
    var id = allocateId();
    var canvas;
    var canvasContext = null;
    
    var scale = greg.ross.visualisation.JSSurfacePlot.DEFAULT_SCALE;
    
    var currentZAngle = greg.ross.visualisation.JSSurfacePlot.DEFAULT_Z_ANGLE;
    var currentXAngle = greg.ross.visualisation.JSSurfacePlot.DEFAULT_X_ANGLE;
    
   ...