JSFiddle - React, Tailwind, and code Playground

by Ulrich Bangert

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jcanvas/20.1.4/jcanvas.js"></script>
<canvas width="800" height="600"></canvas>

JavaScript

cv = $("canvas");
        cv.drawImage({
            source: "http://ulrichbangert.de/div/2013-12_Advent/2013-12-04_Advent.jpg",
            layer: true,
            x: 0, y: 0, fromCenter: false,
            mousemove: function (layer) {
                cv.setPixels({
                    x: layer.eventX, y: layer.eventY,
                    width: 1, height: 1,
                    // loop through each pixel
                    each: function (px) {
                        console.log(px.r, px.g, px.b);
                    }
                });
            }
        });