Joonistamine
Joonistamine
Eesti lipp
Poola lipp
Lirimaa lipp
Rootsi lipp
Tšiili lipp
Tšehhi vabariik lipp
// joon – линия
function joon() {
const paber1 = document.getElementById(“paber1”);
if (paber1.getContext) {
let p1 = paber1.getContext(“2d”);
p1.beginPath(); // algab tee
p1.lineWidth = “5”;
p1.strokeStyle = “red”;
p1.moveTo(20, 20); // alguspunkt
p1.lineTo(120, 120); // lõpp
p1.stroke();
}
}
function ring() {
const paber1 = document.getElementById(“paber1”);
if (paber1.getContext) {
let p1 = paber1.getContext(“2d”);
p1.beginPath(); // algab tee
p1.arc(50,50,30,0,2 * Math.PI,true) // xy – keskPunkt, R – radius
p1.strokeStyle=”green”;
p1.fillStyle = “blue”;
p1.stroke(); // ümberjoon
p1.fill(); // taust
}
}
function ristkylik() {
const paber1 = document.getElementById(“paber1”);
if (paber1.getContext) {
let p1 = paber1.getContext(“2d”);
p1.fillStyle = “black”;
p1.fillRect(30,25,200,100); //x, y, laius, kõrgus
}
}
function ristkylik2() {
const paber1 = document.getElementById(“paber1”);
if (paber1.getContext) {
let p1 = paber1.getContext(“2d”);
let laius = document.getElementById(“laius”);
let korgus = document.getElementById(“korgus”);
p1.fillStyle = “black”;
p1.fillRect(30,25,laius.value,korgus.value); //x, y, laius, kõrgus
}
}
function eemalda() {
const paber1 = document.getElementById(“paber1”);
if (paber1.getContext) {
let p1 = paber1.getContext(“2d”);
p1.clearRect(0,0,300,250);
}
}
function eestiLipp() {
const eesti = document.getElementById(“eesti”);
if (eesti.getContext) {
let e = eesti.getContext(“2d”);
e.fillStyle = “blue”;
e.fillRect(0,0,330,70);
e.fillStyle = “black”;
e.fillRect(0,70,330,70);
e.fillStyle = “white”;
e.fillRect(0,140,330,70);
}
}
function poolaLipp() {
const poola = document.getElementById(“poola”);
if (poola.getContext) {
let p = poola.getContext(“2d”);
p.fillStyle = “white”;
p.fillRect(0,0,330,105);
p.fillStyle = “red”;
p.fillRect(0,105,330,105);
}
}
function lirimaaLipp() {
const lirimaa = document.getElementById(“lirimaa”);
if (lirimaa.getContext) {
let l = lirimaa.getContext(“2d”);
l.fillStyle = “green”;
l.fillRect(0,0,110,210);
l.fillStyle = “white”;
l.fillRect(110,0,110,210);
l.fillStyle = “orange”;
l.fillRect(220,0,110,210);
}
}
function rootsiLipp() {
const rootsi = document.getElementById(“rootsi”);
if (rootsi.getContext) {
let r = rootsi.getContext(“2d”);
r.fillStyle = “dodgerblue”;
r.fillRect(0,0,330,210);
r.fillStyle = “yellow”;
r.fillRect(110,0,45,210);
r.fillStyle = “yellow”;
r.fillRect(0,80,330,45);
}
}
function tsiiliLipp() {
const tsiili = document.getElementById(“tsiili”);
if (tsiili.getContext) {
let t = tsiili.getContext(“2d”);
t.fillStyle = “darkblue”;
t.fillRect(0,0,330,105);
t.fillStyle = “red”;
t.fillRect(0,105,330,105);
t.fillStyle = “white”;
t.fillRect(110,0,330,105);
t.beginPath(); // algab tee
t.lineWidth = “3”;
t.strokeStyle = “white”;
t.moveTo(40, 50); // alguspunkt *
t.lineTo(80, 50); // paremal
t.lineTo(30, 85); // vasakul alla
t.lineTo(50, 25); // üles
t.lineTo(70, 85); // paremal alla
t.lineTo(20, 50); // vasakul
t.lineTo(40, 50); // lõpp *
t.fillStyle = “white”;
t.stroke();
t.fill();
}
}
function tsehhiLipp() {
const tsehhi = document.getElementById(“tsehhi”);
if (tsehhi.getContext) {
let ts = tsehhi.getContext(“2d”);
ts.fillStyle = “white”;
ts.fillRect(0,0,330,105);
ts.fillStyle = “red”;
ts.fillRect(0,105,330,105);
ts.beginPath();
ts.lineWidth = “3”;
ts.strokeStyle=”darkblue”
ts.moveTo(0, 0);
ts.lineTo(100, 105);
ts.lineTo(0, 210);
ts.lineTo(0, 0);
ts.fillStyle = “darkblue”;
ts.stroke();
ts.fill();
}
}
#paber1 {
background-color: azure;
width: 300px;
height: 250px;
border: 1px solid black;
}
#eesti, #poola, #lirimaa, #rootsi, #tsiili, #tsehhi {
border: 1px solid black;
}
.lipp-container {
display: flex;
}
.vasakul, .paremal{
flex: 1;
display: flex;
flex-direction: column;
}