Skip to content

Instantly share code, notes, and snippets.

@n1ckfg

n1ckfg/resizeNN_old.js

Forked from gncgnc/resizeNN.js
Last active June 7, 2023 01:55
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save n1ckfg/d0681ceb354711893d05d2ae3b91943d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save n1ckfg/d0681ceb354711893d05d2ae3b91943d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. n1ckfg renamed this gist Jun 7, 2023. 1 changed file with 0 additions and 0 deletions.
    0 resizeNN.js → resizeNN_old.js
    View file
    File renamed without changes.
  2. @gncgnc gncgnc revised this gist Mar 7, 2017. 1 changed file with 14 additions and 9 deletions.
    23 changes: 14 additions & 9 deletions resizeNN.js
    View file
    Original file line number Diff line number Diff line change
    @@ -3,9 +3,12 @@
    * proportionally, use 0 as the value for the wide or high parameter.
    * For instance, to make the width of an image 150 pixels, and change
    * the height using the same proportion, use resize(150, 0).
    * Otherwise same usage as the regular resize().
    *
    **** Note: Disproportionate resizing squashes the "pixels" from squares to rectangles.
    * Note: Disproportionate resizing squashes the "pixels" from squares to rectangles.
    * This works about 10 times slower than the regular resize. Any suggestions for performance increase are welcome.
    */

    p5.Image.prototype.resizeNN = function(width, height) {
    if (width === 0 && height === 0) {
    width = this.canvas.width;
    @@ -20,16 +23,20 @@ p5.Image.prototype.resizeNN = function(width, height) {
    height = Math.floor(height);

    var temp = createImage(width,height),
    wScale = width / this.width ,
    hScale = height / this.height
    xScale = width / this.width ,
    yScale = height / this.height

    this.loadPixels()
    temp.loadPixels()
    for(var x=0; x<temp.width; x++) {
    for(var y=0; y<temp.height; y++) {
    // var ind = 4*(y*img.width + x)
    var sourceP = this.get(1.0*x/wScale, 1.0*y/hScale)
    temp.set(x,y,sourceP)
    var sourceInd = 4*(Math.floor(y/yScale)*this.width + Math.floor(x/xScale))
    var targetInd = 4*(y*temp.width + x)
    var sourceP = this.pixels.slice(sourceInd,sourceInd+4)//this.get(x/wScale, y/hScale)
    temp.pixels[targetInd] = sourceP[0]
    temp.pixels[targetInd+1] = sourceP[1]
    temp.pixels[targetInd+2] = sourceP[2]
    temp.pixels[targetInd+3] = sourceP[3]
    }
    }
    temp.updatePixels()
    @@ -38,10 +45,8 @@ p5.Image.prototype.resizeNN = function(width, height) {
    this.canvas.width = this.width = width;
    this.canvas.height = this.height = height;

    console.log(temp)

    this.drawingContext.drawImage(temp.canvas,
    0, 0, width, height,
    0, 0, width, height
    );
    )
    };
  3. @gncgnc gncgnc revised this gist Mar 7, 2017. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion resizeNN.js
    View file
    Original file line number Diff line number Diff line change
    @@ -4,7 +4,7 @@
    * For instance, to make the width of an image 150 pixels, and change
    * the height using the same proportion, use resize(150, 0).
    *
    * Note: Disproportionate resizing squashes the "pixels" from squares to rectangles.
    **** Note: Disproportionate resizing squashes the "pixels" from squares to rectangles.
    */
    p5.Image.prototype.resizeNN = function(width, height) {
    if (width === 0 && height === 0) {
  4. @gncgnc gncgnc created this gist Mar 7, 2017.
    47 changes: 47 additions & 0 deletions resizeNN.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,47 @@
    /**
    * Resize the image to a new width and height using nearest neigbor algorithm. To make the image scale
    * proportionally, use 0 as the value for the wide or high parameter.
    * For instance, to make the width of an image 150 pixels, and change
    * the height using the same proportion, use resize(150, 0).
    *
    * Note: Disproportionate resizing squashes the "pixels" from squares to rectangles.
    */
    p5.Image.prototype.resizeNN = function(width, height) {
    if (width === 0 && height === 0) {
    width = this.canvas.width;
    height = this.canvas.height;
    } else if (width === 0) {
    width = this.canvas.width * height / this.canvas.height;
    } else if (height === 0) {
    height = this.canvas.height * width / this.canvas.width;
    }

    width = Math.floor(width);
    height = Math.floor(height);

    var temp = createImage(width,height),
    wScale = width / this.width ,
    hScale = height / this.height

    this.loadPixels()
    temp.loadPixels()
    for(var x=0; x<temp.width; x++) {
    for(var y=0; y<temp.height; y++) {
    // var ind = 4*(y*img.width + x)
    var sourceP = this.get(1.0*x/wScale, 1.0*y/hScale)
    temp.set(x,y,sourceP)
    }
    }
    temp.updatePixels()
    this.updatePixels()

    this.canvas.width = this.width = width;
    this.canvas.height = this.height = height;

    console.log(temp)

    this.drawingContext.drawImage(temp.canvas,
    0, 0, width, height,
    0, 0, width, height
    );
    };