Joonistamine

Lipud

function ring() { const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext){ let t=tahvel.getContext(“2d”); t.beginPath(); t.arc(50,50,30,0,2 *Math.PI, true) t.stroke(); t.fillStyle=”blue”; t.fill(); } } function ring2() { const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext){ let t=tahvel.getContext(“2d”); t.beginPath(); t.arc(100,100,15,0,2 *Math.PI, true) t.stroke(); t.fillStyle=”orange”; t.fill(); } } function kustuta() { const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext){ let t=tahvel.getContext(“2d”); t.clearRect(0,0,400,400); } } function ristkylik(){ const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext){ let t=tahvel.getContext(“2d”); t.fillStyle=”green”; t.fillRect(100,120,100,200); } } function joon() { const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext){ let t=tahvel.getContext(“2d”); t.beginPath(); t.lineWidth=”5″; t.moveTo(50,60); t.lineTo(200,100); t.lineTo(50,100); t.lineTo(50,57); t.strokeStyle=”brick red” t.stroke(); } } function eesti() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.fillStyle=”blue”; l.fillRect(0,0,330,70); l.fillStyle=”black”; l.fillRect(0,70,330,140); l.fillStyle=”white”; l.fillRect(0,140,330,210); } } function rootsi() { const lipp = document.getElementById(“lipp”); if (lipp.getContext) { let l = lipp.getContext(“2d”); l.fillStyle = “blue”; l.fillRect(0, 0, 330, 210); l.fillStyle = “yellow”; l.fillRect(0, 70, 330, 30); l.fillRect(70, 0, 30, 210); } } function jaapan() { const lipp = document.getElementById(“lipp”); if (lipp.getContext) { let l = lipp.getContext(“2d”); l.fillStyle = “white”; l.fillRect(0, 0, 330, 210); l.fillStyle = “red”; l.beginPath(); l.arc(165, 105, 50, 0, Math.PI * 2, true); l.fill(); } } function belgia() { const lipp = document.getElementById(“lipp”); if (lipp.getContext) { let l = lipp.getContext(“2d”); l.fillStyle = “white”; l.fillRect(0, 0, 330, 210); l.fillStyle = “black”; l.fillRect(0, 0, 110, 210); l.fillStyle = “yellow”; l.fillRect(110, 0, 110, 210); l.fillStyle = “red”; l.fillRect(220, 0, 110, 210); } } function uganda() { const lipp = document.getElementById(“lipp”); if (lipp.getContext) { let l = lipp.getContext(“2d”); l.fillStyle = “black”; l.fillRect(0, 0, 330, 35); l.fillStyle = “yellow”; l.fillRect(0, 35, 330, 35); l.fillStyle = “red”; l.fillRect(0, 70, 330, 35); l.fillStyle = “black”; l.fillRect(0, 105, 330, 35); l.fillStyle = “yellow”; l.fillRect(0, 140, 330, 35); l.fillStyle = “red”; l.fillRect(0, 175, 330, 35); } } function kustuta2(){ const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.clearRect(0,0,400,400); } } function Mehhiko() { const lipp = document.getElementById(“lipp”); if (lipp.getContext) { let l = lipp.getContext(“2d”); l.fillStyle = “green”; l.fillRect(0, 0, 110, 210); l.fillStyle = “white”; l.fillRect(110, 0, 110, 210); l.fillStyle = “red”; l.fillRect(220, 0, 110, 210); const image = new Image(); image.src = “eagle.png”; l.drawImage(image, 120, 70); } } canvas#tahvel{ border: 1px solid black; background-color: lightcoral; border-radius: 15px; } canvas#lipp{ border: 1px solid black; background-color: grey; }