# How to apply color quantization to an image

**URL:** https://discourse.processing.org/t/how-to-apply-color-quantization-to-an-image/4849
**Category:** Coding Questions
**Created:** [October 25, 2018, 2:01am UTC](https://discourse.processing.org/t/how-to-apply-color-quantization-to-an-image/4849 "2018-10-25T02:01:44Z")
**Posts on this page:** 1
**Showing post:** 21

<div class="post-metadata">

### Author: ![quark](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/quark/32/26_2.png) [@quark](https://discourse.processing.org/u/quark)
#### Post date: [October 31, 2018, 12:37pm UTC](https://discourse.processing.org/t/how-to-apply-color-quantization-to-an-image/4849/21 "2018-10-31T12:37:18Z")

</div>

This is an interesting problem and I used to use it years ago to keep image file sizes down but I can’t remember what software I used. So it piqued my interest enough to create a sketch that uses the Quantize class code in the link provided by @jb4x (thanks).

So here is the result ouput from my sketch  
 ![sample](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/d5fa50e9be687173aa05b7424724ea712b43c247.png)

I have simply created a new tab called `Quantize.java` and copied the code from the link into it. NOTE that the tab name must match _precisely_ the class name to make it a top level class.  
The `Quatize` class expects the pixel data to be in a 2D array wheres PImage stores pixel data in a 1D array so I have created a class called `QImage` which performs all the conversion and use the `Quatize` class to do its stuff.

Anyway the main tab sketch code is shown below but if you want you can download the entire sketch from [here](http://www.lagers.org.uk/zzz/QuantizeImage.zip)

Enjoy 😂

```auto
PImage img;
QImage qimg256, qimg64, qimg16;

void setup() {
  size(520, 400);
  img = loadImage("london.jpg");
  textSize(14);
  fill(0);
  background(255);
  // Make sonme quantized images
  qimg256 = new QImage(img, 256);
  qimg64 = new QImage(img, 64);
  qimg16 = new QImage(img, 16);

  text("32 bit ARGB", 10, 18);
  image(img, 0, 20);
  text("256 colors", 270, 18);
  image(qimg256.getImage(), 260, 20);

  text("64 colors", 10, 218);
  image(qimg64.getImage(), 0, 220);
  text("16 colors", 270, 218);
  image(qimg16.getImage(), 260, 220);
  save("sample.png");
}

/**
 This class is used to store the result of the image quantization.
 The final image comprises a color table and a 2D array containing 
 an index into the color table.
 It also creates a new PImage with the reduced color set for 
 convenience.
 */
public class QImage {
  final int[][] pixels;
  final int w, h;
  final int[] colortable;
  final PImage reducedImage;

  /**
   img = the PImage we want to quantize
   maxNbrColors - color table size
   */
  public QImage(PImage img, int maxNbrColors) {
    // Pixel data needs to be in 2D array for Quantize class.
    w = img.width;
    h = img.height;
    pixels = new int[h][w];
    img.loadPixels();
    int[] p = img.pixels;
    int n = 0;
    for (int y = 0; y < h; y++) {
      for (int x = 0; x < w; x++) {
        pixels[y][x] = p[n++];
      }
    } 
    // Quantize the image
    colortable = Quantize.quantizeImage(pixels, maxNbrColors);
    //Create a PImage with the reduced color pallette
    reducedImage = createImage(w, h, ARGB);
    for (int y = 0; y < h; y++) {
      for (int x = 0; x < w; x++) {
        reducedImage.set(x, y, colortable[pixels[y][x]]);
      }
    }
  }

  /**
   Convenience method to draw the quatized image at a 
   given position.
   */
  public void displayRAW(int px, int py) {
    for (int y = 0; y < h; y++) {
      for (int x = 0; x < w; x++) {
        set(px + x, py+y, colortable[pixels[y][x]]);
      }
    }
  }

  /**
   Get the pixel color index data
   */
  public int[][] getPixels() {
    return pixels;
  }

  /**
   Get the color table data
   */
  public int[] getColorTable() {
    return colortable;
  }

  /**
   Get the maximum number of colors in the reduced image.
   The actual number of unique colors maybe less than this.
   */
  public int nbrColors() {
    return colortable.length;
  }

  /**
   Convenience method to get the quatized image as a PImage
   that can be used directly in processing
   */
  public PImage getImage() {
    return reducedImage;
  }
}

```

---

_[View the full topic](https://discourse.processing.org/t/how-to-apply-color-quantization-to-an-image/4849)._