Joonistamine

Lipud

function ring() { //x,y – keskpunkt, R – raadius const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext(“2d”)){ let t=tahvel.getContext(“2d”); t.beginPath(); t.arc(50, 50, 30, 0, 2 *Math.PI, true); t.strokeStyle=”black”; t.stroke(); //ümberjoon t.fillStyle=”pink”; t.fill(); //taust } } function ring2() { //x,y – keskpunkt, R – raadius const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext(“2d”)){ let t=tahvel.getContext(“2d”); t.beginPath(); t.arc(120, 50, 30, 0, 2 *Math.PI, true); t.strokeStyle=”black”; t.stroke(); //ümberjoon t.fillStyle=”plum”; t.fill(); //taust } } 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=”purple”; t.fillRect(35, 100, 100, 200); } } //joon function joon() { const tahvel=document.getElementById(“tahvel”); if(tahvel.getContext(“2d”)){ let t=tahvel.getContext(“2d”); t.beginPath(); t.lineWidth=2; t.moveTo(50, 60); //alguspunkt t.lineTo(100, 120); t.lineTo(200, 100); t.lineTo(200, 100); t.lineTo(50, 60); //lõppunkt t.strokeStyle=”black”; t.stroke(); //ümberjoon } } function kustuta2() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let t=lipp.getContext(“2d”); t.clearRect(0,0, 400,400); } } 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 araabia() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.fillStyle=”green”; l.fillRect(0, 0, 330, 70); l.fillStyle=”white”; l.fillRect(0, 70, 330, 140); l.fillStyle=”black”; l.fillRect(0, 140, 330, 210); l.fillStyle=”red”; l.fillRect(0, 0, 80, 210); } } function leedu() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.fillStyle=”yellow”; l.fillRect(0, 0, 330, 70); l.fillStyle=”green”; l.fillRect(0, 70, 330, 140); l.fillStyle=”red”; l.fillRect(0, 140, 330, 210); } } function austria() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.fillStyle=”red”; l.fillRect(0, 0, 330, 70); l.fillStyle=”white”; l.fillRect(0, 70, 330, 140); l.fillStyle=”red”; l.fillRect(0, 140, 330, 210); } } function belgia() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); 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 laos() { const lipp=document.getElementById(“lipp”); if(lipp.getContext){ let l=lipp.getContext(“2d”); l.fillStyle=”red”; l.fillRect(0, 0, 330, 50); l.fillStyle=”darkblue”; l.fillRect(0, 50, 330, 160); l.fillStyle=”red”; l.fillRect(0, 160, 330, 210); l.beginPath(); l.arc(155, 105, 50, 0, 2 *Math.PI, true); l.strokeStyle=”black”; l.stroke(); //ümberjoon l.fillStyle=”white”; l.fill(); } } canvas#tahvel { width: 30%; background-color: lavenderblush; border: 1px solid black; } canvas#lipp{ border: 1px solid black; } canvas#pyhi{ border: 1px solid black; }