JSFiddle - React, Tailwind, and code Playground

by phollome

CSS

canvas {
  background-color: red;
}

JavaScript

const width = 200;
const height = 300;

// Load image and initialize
const img = new Image();
img.onload = () => {
	console.log('image loaded');
	initGL();
}
img.src = `https://picsum.photos/${height}/${width}`;

let gl;

function initGL() {
	const canvas = document.createElement('canvas');
  canvas.width = width;
  canvas.height = height;
  gl = canvas.getContext('webgl');
  document.body.appendChild(canvas);
  document.body.appendChild(img);
  
  
}

const vertexShader = `
	void main () {}
`;

const fragmentShader = `
	void main () {}
`;