D3 Examples - Colorspaces

xxxxxxxxxx
 
<!DOCTYPE html>
<meta charset="utf-8">
<style>
</style>
<body>
<canvas id="myCanvas" 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("myCanvas");
var ctx = canvas.getContext("2d");
​
​
var width = canvas.width;
var height = canvas.height;
​
    
/*  ctx.fillStyle = myColor.darker (1)
    ctx.fillRect (0,0,width,height)
*/
​
d3.range(0, width).forEach(function(x) {
​
    d3.range(0, height).forEach(function(y) {
​
        var myColor = d3.cubehelix(360*x/width, (2*y/height), 5);
        ctx.fillStyle = myColor;
        ctx.fillRect(x, y, 1, 1);
    });
});
​
</script>
​
    