| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| </style> | |
| <body> | |
| <canvas id="painting" width=960 height=500> | |
| <script src="https://d3js.org/d3.v4.0.0-alpha.45.js"></script> | |
| <script src="https://d3js.org/d3-hsv.v0.0.js"></script> | |
| <script src="https://d3js.org/d3-scale-chromatic.v0.3.js"></script> | |
| <script> | |
| var canvas = document.getElementById("painting"); | |
| var ctx = canvas.getContext("2d"); | |
| d3.range(0, canvas.width).forEach(function(x) { | |
| d3.range(0, canvas.height).forEach(function(y) { | |
| ctx.fillStyle = d3.lab(65, -100+200*x/canvas.width, -100+200*y/canvas.height); | |
| ctx.fillRect(x, y, 1, 1); | |
| }); | |
| }); | |
| </script> |
