RobinNixon
29 lines
792 B
HTML
29 lines
792 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Filling with Gradients</title>
|
|
<script src='OSC.js'></script>
|
|
</head>
|
|
<body>
|
|
<canvas id='mycanvas' width='640' height='240'></canvas>
|
|
|
|
<script>
|
|
canvas = O('mycanvas')
|
|
context = canvas.getContext('2d')
|
|
S(canvas).background = 'lightblue'
|
|
context.fillStyle = 'blue'
|
|
context.strokeStyle = 'green'
|
|
|
|
context.fillRect( 20, 20, 600, 200)
|
|
context.clearRect( 40, 40, 560, 160)
|
|
context.strokeRect(60, 60, 520, 120)
|
|
|
|
gradient = context.createLinearGradient(0, 80, 640,80)
|
|
gradient.addColorStop(0, 'white')
|
|
gradient.addColorStop(1, 'black')
|
|
context.fillStyle = gradient
|
|
context.fillRect(80, 80, 480,80)
|
|
</script>
|
|
</body>
|
|
</html>
|