TypeScript

by artgas_pro

HTML

<canvas id="mycanvas" width="700" height="800"></canvas>

TypeScript

canvas = document.getElementById('mycanvas')
			context = canvas.getContext('2d')

			context.beginPath()
			context.moveTo(0, 250)
			context.bezierCurveTo(250, 250, 400, 0, 700, 200)
			context.moveTo(700, 200)
			context.lineTo(700, 0)
			context.lineTo(0, 0)
			context.lineTo(0, 250)
			context.fillStyle = 'green'
			context.fill()
			context.closePath()

			context.beginPath()
			context.moveTo(0, 350)
			context.bezierCurveTo(330, 500, 400, 300, 700, 280)
			context.lineTo(700, 200)
			context.bezierCurveTo(400, 0, 250, 250, 0, 250)
			context.lineTo(0, 350)
			context.fillStyle = 'white'
			context.fill()
			context.closePath()

			context.beginPath()
			context.moveTo(0, 700)
			context.bezierCurveTo(450, 550, 400, 530, 700, 650)
			context.lineTo(700, 280)
			context.bezierCurveTo(400, 300, 330, 500, 0, 350)
			context.lineTo(0, 700)
			context.fillStyle = 'green'
			context.fill()
			context.closePath()