Grid.js

/**
 * @module Grid
 * @description This is the code documentation for our Grid class.
 *
 * @author Noah Watzal, Aymeric Hollaus 
 */


class Grid {
    /**
     * @method constructor
     * @description Creates the class instances for Grid.
     * @param  n {Number} width of the grid.
     * @param  m {Number} height of the grid.
     * @param  x_min {Number} min for scaling of x.
     * @param  x_max {Number} max for scaling of x.
     * @param  y_min {Number} min for scaling of y.
     * @param  y_max {Number} max for scaling of y.
     * @param  vmin {Number} min for color scaling.
     * @param  vmax {Number} max for color scaling.
     */
    constructor([n, m], func, [xmin, xmax], [ymin, ymax], [vmin, vmax]) {
      this.width = n;
      this.height = m;
      this.x = d3.scaleLinear().domain([0, this.width]).range([xmin, xmax]);
      this.y = d3.scaleLinear().domain([0, this.height]).range([ymax, ymin]); // Turn upside down
      this.color = d3.scaleSequentialSqrt(d3.interpolateBlues).domain([vmin, vmax]);
  
      this.values = new Array(this.width * this.height);
      for (var j = 0, k = 0; j < this.height; ++j) {
        for (var i = 0; i < this.width; ++i, ++k) {
          this.values[k] = func(this.x(i), this.y(j));
        }
      }
    }
  
    /**
     * @method get
     * @description usual get methods for the values.
     * @returns this.values
     */
    get(i, j) {
      return this.values[i + j * this.width];
    }
  
  
    /**
     * @method pos_at_index
     * @description gives postion at certain index.
     */
    pos_at_index(ind) {
      return [ind % this.width, Math.floor(ind / this.width)];
    }

    /**
     * @method to_context
     */
    to_context() {
      let ct = document.createElement('canvas').getContext('2d');
      ct.canvas.width = this.width;
      ct.canvas.height = this.height;
    
      this.values.forEach((value, ind) => {
        const d = ind % this.width;
        const e = Math.floor(ind / this.width);
        ct.fillStyle = this.color(value);
        ct.fillRect(d, e, 1, 1);
      });
    
      ct.canvas.id = 'canvas';
      return ct;
    }
  }
   export default Grid;