Color mode

[svenhb]

Your tool is so cool!!! I made a color version but didn't test the result with my plotter up to now - https://grbl-plotter.de/plotterfun-color
Also drag & drop of an images on to the canvas is possible
To do: I can't change the order of the colors (the lightest color first would be nice), output scaled to given mm (somehow a factor of 3.78 is applied...)

[mitxela]

Very nice! Sorry I didn't comment earlier.

When I tried my CMYK plot, I did it by processing four separate images, which I generated in Krita, so this is certainly a lot easier.

[Triod-project]

Your tool is so cool!!! I made a color version but didn't test the result with my plotter up to now - https://grbl-plotter.de/plotterfun-color Also drag & drop of an images on to the canvas is possible To do: I can't change the order of the colors (the lightest color first would be nice), output scaled to given mm (somehow a factor of 3.78 is applied...)

Hi svenhb, Have you share your code?

[svenhb]

Just rigth-click on the open site and save the code... https://grbl-plotter.de/plotterfun-color/

[asutay38]

Does this site have a program? For example (Drawing Bot V3)

[asutay38]

Or does this site allow you to save individual CMYK colors?

[svenhb]

The program is HTML and JavaScript, just open the site and check the source code (right click in browser window). Inside the saved SVG, the color, are separated - just open in a text-editor. If you need something else than RGB or CMY color model: In line 359 the colors will be separated from the image. RGB is easy because pixel-date is stored in RGB, for CMY calculations are needed to separate cyan, magenta and yellow:

< function applyFilter (channel, context) { // https://wiki.selfhtml.org/wiki/JavaScript/Canvas/Pixel_Manipulation var data, mod, x, y, offset; var r,g,b,k,c,m,yl; mod = context.createImageData(cw, ch);

    for (x = 0; x < cw; x++) {
        for (y = 0; y < ch; y++) {
            offset = (cw * y + x) * 4;
                        
            if ((channel < 0) || (channel > 3)) {
                mod.data[offset]     = imgData.data[offset];
                mod.data[offset + 1] = imgData.data[offset + 1];
                mod.data[offset + 2] = imgData.data[offset + 2];
                mod.data[offset + 3] = imgData.data[offset + 3];
            }
            else {
                if (modeRGB) {
                    if (channel > 2) channel = 2;
                    mod.data[offset] = mod.data[offset + 1] = mod.data[offset + 2] = 255 - imgData.data[offset + channel];
                } else {
                    r = imgData.data[offset] / 255;     // https://stackdev.io/question/1077/convert-rgb-to-cmyk
                    g = imgData.data[offset + 1] / 255;
                    b = imgData.data[offset + 2] / 255;
                    k = Math.min(1 - r, Math.min(1 - g, 1 - b));
                    if (k == 1) {
                        c = m = yl = 0;
                    } else {
                        c = (1 - r - k) / (1 - k);
                        m = (1 - g - k) / (1 - k);
                        yl = (1 - b - k) / (1 - k);
                    }
                    
                    if (channel == 3) {
                        mod.data[offset] = mod.data[offset + 1] = mod.data[offset + 2] = 255 - byteRange(k * 255);                           
                    } else {                        
                        mod.data[offset] = byteRange(c * 255);
                        mod.data[offset + 1] = byteRange(m * 255);
                        mod.data[offset + 2] = byteRange(yl * 255);
                        
                        mod.data[offset] = mod.data[offset + 1] = mod.data[offset + 2] = 255 - mod.data[offset + channel];
                    }
                }
                mod.data[offset + 3] = 255;
            }
        }
    }
    context.putImageData(mod, 0, 0);
}    

[mariana-s-fernandes]

HI @svenhb, I have been using your color version, works really well! Do you have the code in a repo?

[svenhb]

I made a repo here: https://github.com/svenhb/plotterfun-color I hope it is ok for mitxela