使用canvas繪製一個色卡,思路就是通過循環改變rgb值
// 色卡
function draw() {
var canvas = document.getElementById('box');
!canvas.getContext && alert('canvas無法加載');
var ctx = canvas.getContext('2d');
for (var i = 0; i < 10; i++) {
for (var j = 0; j < 10; j++) {
for(var z = 0; z < 10; z++){
// 設置rgb值
ctx.fillStyle = 'rgb(' + Math.floor(255 - 25.5 * i) + ',' +
Math.floor(255 - 25.5 * j) + ','
+ Math.floor(0 + 25.5 * z) + ')';
ctx.fillRect(i * 50, j * 50, 50, 50);
}
}
}
}
draw();