{"id":477,"date":"2025-03-13T06:42:41","date_gmt":"2025-03-13T06:42:41","guid":{"rendered":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477"},"modified":"2025-03-20T13:57:02","modified_gmt":"2025-03-20T13:57:02","slug":"veebirakendused","status":"publish","type":"page","link":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477","title":{"rendered":"Veebirakendused"},"content":{"rendered":"\n<p><strong>Js: joonistamine<\/strong><\/p>\n\n\n\n<h1>Joonistamine JS abil<\/h1>\n<canvas id=\"pyhi\" width=\"400\" height=\"300\"><\/canvas>\n<br>\n<input type=\"button\" value=\"kustuta\" onclick=\"kustuta()\">\n<input type=\"button\" value=\"ring\" onclick=\"ring()\">\n<label for=\"radius\">Radius<\/label>\n<input type=\"number\" id=\"radius\" min=\"1\" max=\"200\" step=\"10\" onclick=\"ring()\">\n<br>\n<input type=\"button\" value=\"ristkylik\" onclick=\"ristkylik()\">\n<label for=\"laius\">Laius<\/label>\n<input type=\"number\" id=\"laius\" min=\"1\" max=\"200\" step=\"10\" onclick=\"ristkylik()\">\n<label for=\"korgus\">K\u00f5rgus<\/label>\n<input type=\"number\" id=\"korgus\" min=\"1\" max=\"200\" step=\"10\" onclick=\"ristkylik()\">\n<br>\n<input type=\"button\" value=\"joon\" onclick=\"joon()\">\n<h1>Lipud<\/h1>\n<canvas id=\"lipp\" width=\"330\" height=\"210\"><\/canvas>\n<br>\n<input type=\"button\" value=\"Eesti\" onclick=\"eestilipp()\">\n<input type=\"button\" value=\"Prantsusmaa\" onclick=\"france()\">\n<input type=\"button\" value=\"Sveits\" onclick=\"switzerland()\">\n<input type=\"button\" value=\"Impeeria lipp\" onclick=\"russianEmpire(); showFlagInfo();\">\n<input type=\"button\" value=\"Kustuta\" onclick=\"kustutalipp()\">\n<br>\n<h1>Majake<\/h1>\n<br>\n<canvas id=\"majake\" width=\"400\" height=\"300\"><\/canvas>\n<br>\n<input type=\"button\" value=\"Joonista sein\" onclick=\"drawWall()\">\n<input type=\"button\" value=\"Joonista katus\" onclick=\"drawRoof()\">\n<input type=\"button\" value=\"Joonista uks\" onclick=\"drawDoor()\">\n<input type=\"button\" value=\"Joonista aken\" onclick=\"drawWindow()\">\n<input type=\"button\" value=\"Joonista korsten\" onclick=\"drawChimney()\">\n<input type=\"button\" value=\"Joonista p\u00e4ike\" onclick=\"drawSun()\">\n<input type=\"button\" value=\"Joonista puu\" onclick=\"drawTree()\">\n<input type=\"button\" value=\"Joonista k\u00f5ik\" onclick=\"drawAll()\">\n<input type=\"button\" value=\"Kustuta majake\" onclick=\"kustutamajake()\">\n<br>\n<a href=\"\/content\/tood.html\" class=\"nav-link\">Tagasi<\/a>\n<br>\n<img decoding=\"async\" src=\"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg\" alt=\"pilt\">\n\n\n\n<script>\nfunction kustutalipp() {\n    const lipp = document.getElementById('lipp');\n\n    if (lipp.getContext) {\n        let p = lipp.getContext('2d');  \/\/ canvas \u0630\u00b8\u0630\u00bc\u0631\u0688\n        p.clearRect(0, 0, 330, 210); \/\/ \u0630\u200d\u0631\u2021\u0630\u00b8\u0631\u067e\u0631\u201a\u0630\u061b\u0630\u00b0 \u0631\u201e\u0630\u00bb\u0630\u00b0\u0630\u00b3\u0630\u00b0\n    }\n\n    \/\/\u0631\u0192\u0630\u00b4\u0630\u00b0\u0630\u00bb\u0630\u00b5\u0630\u00bd\u0630\u00b8\u0630\u00b5 \u0630\u00b8\u0630\u00bd\u0631\u201e\u0630\u00be\u0631\u20ac\u0630\u00bc\u0630\u00b0\u0631\u2020\u0630\u00b8\u0630\u00b8 \u0630\u00be \u0631\u201e\u0630\u00bb\u0630\u00b0\u0630\u00b3\u0630\u00b5\n    let infoBox = document.getElementById('flagInfo');\n    if (infoBox) {\n        infoBox.remove();\n    }\n}\n\n\nfunction eestilipp() {\n    const lipp = document.getElementById('lipp');\n    if (lipp.getContext) {\n        let l = lipp.getContext('2d');  \/\/ canvas nimi\n\n        l.fillStyle = \"blue\";\n        l.fillRect(0, 0, 330, 70);\n\n        l.fillStyle = \"black\";\n        l.fillRect(0, 70, 330, 70);\n\n        l.fillStyle = \"white\";\n        l.fillRect(0, 140, 330, 70);\n    }\n}\n\nfunction france() {\n    const lipp = document.getElementById('lipp');\n    if (lipp.getContext) {\n        let l = lipp.getContext('2d');  \/\/ canvas nimi\n\n        l.fillStyle = \"blue\";\n        l.fillRect(0, 0, 110, 210);\n\n        l.fillStyle = \"white\";\n        l.fillRect(110, 0, 110, 210);\n\n        l.fillStyle = \"red\";\n        l.fillRect(220, 0, 110, 210);\n    }\n}\n\nfunction switzerland() {\n    const lipp = document.getElementById('lipp');\n    if (lipp.getContext) {\n        let l = lipp.getContext('2d');  \/\/ canvas nimi\n\n        l.fillStyle = \"red\";\n        l.fillRect(0, 0, 330, 210);\n\n        l.fillStyle = \"white\";\n        l.fillRect(135, 45, 60, 120); \/\/\u0630\u00b2\u0630\u00b5\u0631\u20ac\u0631\u201a\u0630\u00b8\u0630\u061b\u0630\u00b0\u0630\u00bb\u0631\u0152\u0630\u00bd\u0630\u00b0\u0631\u0688\n\n        l.fillRect(90, 90, 150, 60); \/\/\u0630\u00b3\u0630\u00be\u0631\u20ac\u0630\u00b8\u0630\u00b7\u0630\u00be\u0630\u00bd\u0631\u201a\n    }\n}\n\nfunction russianEmpire() {\n    const lipp = document.getElementById('lipp');\n    if (lipp.getContext) {\n        let l = lipp.getContext('2d');  \/\/ canvas nimi\n\n        \/\/\u0631\u201e\u0630\u00be\u0630\u00bd \u0631\u201e\u0630\u00bb\u0630\u00b0\u0630\u00b3\u0630\u00b0\n        l.fillStyle = \"white\";\n        l.fillRect(0, 0, 330, 70); \/\/\u0630\u00b1\u0630\u00b5\u0630\u00bb\u0630\u00b0\u0631\u0688 \u0630\u061f\u0630\u00be\u0630\u00bb\u0630\u00be\u0631\u067e\u0630\u00b0\n\n        l.fillStyle = \"black\";\n        l.fillRect(0, 70, 330, 70); \/\/\u0631\u2021\u0630\u00b5\u0631\u20ac\u0630\u00bd\u0630\u00b0\u0631\u0688 \u0630\u061f\u0630\u00be\u0630\u00bb\u0630\u00be\u0631\u067e\u0630\u00b0\n\n        l.fillStyle = \"gold\";\n        l.fillRect(0, 140, 330, 70); \/\/\u0630\u00bd\u0630\u00b8\u0630\u00b6\u0630\u00bd\u0631\u0688\u0631\u0688 \u0630\u061f\u0630\u00be\u0630\u00bb\u0630\u00be\u0631\u067e\u0630\u00b0\n\n        \/\/\u0630\u00b3\u0630\u00b5\u0631\u20ac\u0630\u00b1\n        let img = new Image();\n        img.src = \"rusgerb.png\";\n        img.onload = function() {\n            l.drawImage(img, 10, 10, 60, 60); \/\/\u0630\u00b3\u0630\u00b5\u0631\u20ac\u0630\u00b1 \u0630\u061f\u0630\u00be \u0631\u2020\u0630\u00b5\u0630\u00bd\u0631\u201a\u0631\u20ac\u0631\u0192\n        };\n    }\n}\n\/\/\u0630\u061f\u0631\u20ac\u0630\u00be\u0630\u00b1\u0631\u0192\u0631\u0698 \u0630\u00b4\u0630\u00be\u0630\u00b1\u0630\u00b0\u0630\u00b2\u0630\u00b8\u0631\u201a\u0631\u0152 \u0630\u00b8\u0630\u00bd\u0631\u201e\u0630\u00be\u0630\u2018\u0630\u00be\u0630\u061b\u0631\u067e\nfunction showFlagInfo() {\n    let infoBox = document.getElementById('flagInfo');\n\n    if (!infoBox) {\n        infoBox = document.createElement('div'); \/\/\u0631\u2021\u0631\u201a\u0630\u00be \u0630\u00b1\u0631\u2039 \u0631\u0688\u0631\u2030\u0630\u00b8\u0630\u061b \u0631\u067e \u0630\u00b8\u0630\u00bd\u0631\u201e\u0630\u00be\u0630\u00b9 \u0630\u00bd\u0630\u00b5 \u0631\u0192\u0630\u00bb\u0630\u00b5\u0631\u201a\u0630\u00b0\u0630\u00bb \u0630\u00bd\u0630\u00b0 \u0630\u00b2\u0630\u00b5\u0631\u20ac\u0631\u2026\n        infoBox.id = 'flagInfo';\n        infoBox.style.marginTop = '10px';\n        infoBox.style.padding = '10px';\n        infoBox.style.border = '1px solid black';\n        infoBox.style.backgroundColor = 'white';\n        infoBox.style.width = '330px';\n\n\n        let flagContainer = document.getElementById('lipp').parentNode;\n        flagContainer.appendChild(infoBox);\n    }\n\n    infoBox.innerHTML = \"<strong>\u0630\u00a4\u0630\u00bb\u0630\u00b0\u0630\u00b3 \u0630 \u0630\u00be\u0631\u067e\u0631\u067e\u0630\u00b8\u0630\u00b9\u0631\u067e\u0630\u061b\u0630\u00be\u0630\u00b9 \u0630\u00b8\u0630\u00bc\u0630\u061f\u0630\u00b5\u0631\u20ac\u0630\u00b8\u0630\u00b8<\/strong><br>\u0630\u06a9\u0631\u067e\u0630\u061f\u0630\u00be\u0630\u00bb\u0631\u0152\u0630\u00b7\u0630\u00be\u0630\u00b2\u0630\u00b0\u0630\u00bb\u0631\u067e\u0631\u0688 \u0631\u067e 1858 \u0630\u061f\u0630\u00be 1917 \u0630\u00b3\u0630\u00be\u0630\u00b4. \u0630\u060c\u0630\u00be\u0631\u067e\u0631\u201a\u0630\u00be\u0630\u00b8\u0631\u201a \u0630\u00b8\u0630\u00b7 \u0631\u201a\u0631\u20ac\u0630\u00b5\u0631\u2026 \u0630\u00b3\u0630\u00be\u0631\u20ac\u0630\u00b8\u0630\u00b7\u0630\u00be\u0630\u00bd\u0631\u201a\u0630\u00b0\u0630\u00bb\u0631\u0152\u0630\u00bd\u0631\u2039\u0631\u2026 \u0630\u061f\u0630\u00be\u0630\u00bb\u0630\u00be\u0631\u067e: \u0630\u00b1\u0630\u00b5\u0630\u00bb\u0630\u00be\u0630\u00b9, \u0631\u2021\u0630\u00b5\u0631\u20ac\u0630\u00bd\u0630\u00be\u0630\u00b9 \u0630\u00b8 \u0630\u00b7\u0630\u00be\u0630\u00bb\u0630\u00be\u0631\u201a\u0630\u00be\u0630\u00b9. \u0630\u2019 \u0630\u00bb\u0630\u00b5\u0630\u00b2\u0630\u00be\u0630\u00bc \u0630\u00b2\u0630\u00b5\u0631\u20ac\u0631\u2026\u0630\u00bd\u0630\u00b5\u0630\u00bc \u0631\u0192\u0630\u00b3\u0630\u00bb\u0631\u0192 \u0631\u20ac\u0630\u00b0\u0631\u067e\u0630\u061f\u0630\u00be\u0630\u00bb\u0630\u00be\u0630\u00b6\u0630\u00b5\u0630\u00bd \u0630\u00b3\u0630\u00b5\u0631\u20ac\u0630\u00b1 \u0630 \u0630\u00be\u0631\u067e\u0631\u067e\u0630\u00b8\u0630\u00b9\u0631\u067e\u0630\u061b\u0630\u00be\u0630\u00b9 \u0630\u00b8\u0630\u00bc\u0630\u061f\u0630\u00b5\u0631\u20ac\u0630\u00b8\u0630\u00b8.\";\n\n}\n<\/script>\n\n<script>\nfunction kustuta(){\n    const pyhi=document.getElementById('pyhi');\n\n    if(pyhi.getContext) {\n        let p = pyhi.getContext('2d');  \/\/ canvas nimi\n        p.clearRect(0, 0, 400, 300)\n    }\n}\n\n\/\/\u0623\u00bcmberjoon - okruzhnost\nfunction ring(){\n    const pyhi=document.getElementById('pyhi');\n    let radius=document.getElementById('radius');\n\n    if(pyhi.getContext){\n        let p=pyhi.getContext('2d');  \/\/ canvas nimi\n        \/\/ \u0623\u00bcmberjoon - \u0630\u00be\u0630\u061b\u0631\u20ac\u0631\u0192\u0630\u00b6\u0630\u00bd\u0630\u00be\u0631\u067e\u0631\u201a\u0631\u0152\n        p.beginPath();    \/\/algab tee\n        p.arc(50, 50, 20, 0, 2*Math.PI, true);  \/\/ \u0630\u061f\u0630\u00be\u0630\u061f\u0631\u20ac\u0630\u00be\u0630\u00b1\u0630\u00be\u0630\u00b2\u0630\u00b0\u0631\u201a\u0631\u0152 \u0630\u00bd\u0630\u00b5 2*Math.PI \u0630\u00b0 360\n        p.strokeStyle=\"red\"\n        p.stroke(); \/\/ joonista\n\n        \/\/ring\n        p.beginPath();    \/\/algab tee\n        p.arc(100, 50, radius.value, 0, 2*Math.PI, true);  \/\/ \u0630\u061f\u0630\u00be\u0630\u061f\u0631\u20ac\u0630\u00be\u0630\u00b1\u0630\u00be\u0630\u00b2\u0630\u00b0\u0631\u201a\u0631\u0152 \u0630\u00bd\u0630\u00b5 2*Math.PI \u0630\u00b0 360\n        p.fillStyle=\"black\"\n        p.fill(); \/\/ joonista\n\n    }\n}\n\nfunction ristkylik(){\n    const pyhi=document.getElementById('pyhi');\n    let laius=document.getElementById('laius');\n    let korgus=document.getElementById('korgus');\n\n    if(pyhi.getContext) {\n        let p = pyhi.getContext('2d');  \/\/ canvas nimi\n        p.fillStyle=\"green\";\n        p.fillRect(100, 200, laius.value, korgus.value); \/\/ x, y, width, height\n\n    }\n}\n\n    function joon() {\n        const pyhi = document.getElementById(\"pyhi\");\n        if (pyhi.getContext) {\n            let p = pyhi.getContext(\"2d\");\n            \/\/joon\n            p.beginPath();\n            p.strokeStyle = \"blue\";\n            p.lineWidth = \"2\";\n            p.moveTo(300, 80); \/\/alguspunkt\n            p.lineTo(150, 80); \/\/l\u0623\u00b5ppunkt\n            p.stroke();\n            \/\/kolmnurk\n            p.beginPath();\n            p.strokeStyle = \"blue\";\n            p.lineWidth = \"2\";\n            p.fillStyle = \"blue\";\n            p.moveTo(50, 100); \/\/alguspunkt\n            p.lineTo(150, 100);\n            p.lineTo(100, 250);\n            p.lineTo(50, 100);\/\/l\u0623\u00b5ppunkt\n            p.stroke();\n            p.fill();\n        }\n    }\n<\/script>\n\n<script>\nfunction drawWall() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#8B4513\"; \/\/\u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0631\u067e\u0631\u201a\u0630\u00b5\u0630\u00bd\n        p.fillRect(100, 150, 200, 100); \/\/\u0630\u060c\u0631\u201a\u0630\u00b5\u0630\u00bd\u0631\u2039\n    }\n}\n\nfunction drawRoof() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#A52A2A\"; \/\/\u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0630\u061b\u0631\u20ac\u0631\u2039\u0631\u02c6\u0630\u00b8\n        p.beginPath();\n        p.moveTo(200, 80);\n        p.lineTo(80, 150);\n        p.lineTo(320, 150);\n        p.closePath();\n        p.fill();\n    }\n}\n\nfunction drawDoor() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#654321\"; \/\/ \u0630\u00a2\u0630\u00b5\u0630\u00bc\u0630\u00bd\u0630\u00be-\u0630\u061b\u0630\u00be\u0631\u20ac\u0630\u00b8\u0631\u2021\u0630\u00bd\u0630\u00b5\u0630\u00b2\u0631\u2039\u0630\u00b9 \u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0630\u00b4\u0630\u00b2\u0630\u00b5\u0631\u20ac\u0630\u00b8\n        p.fillRect(175, 190, 50, 60);\n    }\n}\n\nfunction drawWindow() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#87CEEB\"; \/\/\u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0630\u00be\u0630\u061b\u0630\u00bd\u0630\u00b0\n        p.fillRect(230, 170, 40, 40);\n    }\n}\n\nfunction drawChimney() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#B22222\"; \/\/\u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0631\u201a\u0631\u20ac\u0631\u0192\u0630\u00b1\u0631\u2039\n        p.fillRect(250, 90, 20, 40);\n    }\n}\n\nfunction drawSun() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"yellow\";\n        p.beginPath();\n        p.arc(350, 50, 30, 0, 2 * Math.PI);\n        p.fill();\n    }\n}\n\nfunction drawTree() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n\n        \/\/ \u0630\u060c\u0631\u201a\u0630\u00b2\u0630\u00be\u0630\u00bb \u0630\u00b4\u0630\u00b5\u0631\u20ac\u0630\u00b5\u0630\u00b2\u0630\u00b0\n        p.fillStyle = \"#8B4513\";\n        p.fillRect(50, 200, 20, 50);\n\n        \/\/\u0630\u00b4\u0630\u00b5\u0631\u20ac\u0630\u00b5\u0630\u00b2\u0630\u00be \u0630\u061f\u0631\u20ac\u0630\u00be\u0630\u00b4\u0630\u00be\u0630\u00bb\u0630\u00b6.\n        p.fillStyle = \"green\";\n        p.beginPath();\n        p.arc(60, 180, 30, 0, 2 * Math.PI);\n        p.fill();\n    }\n}\n\nfunction drawGrass() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.fillStyle = \"#228B22\"; \/\/ \u0630\u2014\u0630\u00b5\u0630\u00bb\u0630\u00b5\u0630\u00bd\u0631\u2039\u0630\u00b9 \u0631\u2020\u0630\u00b2\u0630\u00b5\u0631\u201a \u0631\u201a\u0631\u20ac\u0630\u00b0\u0630\u00b2\u0631\u2039\n        p.fillRect(0, 250, 400, 50); \/\/\u0631\u201a\u0631\u20ac\u0630\u00b0\u0630\u00b2\u0630\u00b0\n    }\n}\n\nfunction drawAll() {\n    drawGrass();\n    drawWall();\n    drawRoof();\n    drawDoor();\n    drawWindow();\n    drawChimney();\n    drawSun();\n    drawTree();\n}\n\nfunction kustutamajake() {\n    const majake = document.getElementById('majake');\n    if (majake.getContext) {\n        let p = majake.getContext('2d');\n        p.clearRect(0, 0, majake.width, majake.height);\n    }\n}\n<\/script>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Js: joonistamine Joonistamine JS abil Radius Laius K\u00f5rgus Lipud Majake Tagasi<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-477","page","type-page","status-publish"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Veebirakendused - Gleb Dranitsyn \/ Portfolio<\/title>\n<meta name=\"description\" content=\"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477\" \/>\n<meta property=\"og:locale\" content=\"et_EE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Veebirakendused - Gleb Dranitsyn \/ Portfolio\" \/>\n<meta property=\"og:description\" content=\"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477\" \/>\n<meta property=\"og:site_name\" content=\"Gleb Dranitsyn \/ Portfolio\" \/>\n<meta property=\"article:modified_time\" content=\"2025-03-20T13:57:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minut\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477\",\"url\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477\",\"name\":\"Veebirakendused - Gleb Dranitsyn \\\/ Portfolio\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/1111.jpg\",\"datePublished\":\"2025-03-13T06:42:41+00:00\",\"dateModified\":\"2025-03-20T13:57:02+00:00\",\"description\":\"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477#breadcrumb\"},\"inLanguage\":\"et\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"et\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477#primaryimage\",\"url\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/1111.jpg\",\"contentUrl\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/wp-content\\\/uploads\\\/2024\\\/11\\\/1111.jpg\",\"width\":442,\"height\":816},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?page_id=477#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\",\"item\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Veebirakendused\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#website\",\"url\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/\",\"name\":\"Gleb Dranitsyn \\\/ Portfolio\",\"description\":\"Tarkvara aarendaja\",\"publisher\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"et\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#organization\",\"name\":\"Gleb Dranitsyn \\\/ Portfolio\",\"url\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"et\",\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/cropped-cropped-logo1.jpg\",\"contentUrl\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/cropped-cropped-logo1.jpg\",\"width\":400,\"height\":171,\"caption\":\"Gleb Dranitsyn \\\/ Portfolio\"},\"image\":{\"@id\":\"https:\\\/\\\/glebdranitson24.thkit.ee\\\/wp\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Veebirakendused - Gleb Dranitsyn \/ Portfolio","description":"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477","og_locale":"et_EE","og_type":"article","og_title":"Veebirakendused - Gleb Dranitsyn \/ Portfolio","og_description":"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.","og_url":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477","og_site_name":"Gleb Dranitsyn \/ Portfolio","article_modified_time":"2025-03-20T13:57:02+00:00","og_image":[{"url":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minut"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477","url":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477","name":"Veebirakendused - Gleb Dranitsyn \/ Portfolio","isPartOf":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#website"},"primaryImageOfPage":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477#primaryimage"},"image":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477#primaryimage"},"thumbnailUrl":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg","datePublished":"2025-03-13T06:42:41+00:00","dateModified":"2025-03-20T13:57:02+00:00","description":"JavaScript joonistamine \u2013 \u00f5ppige kasutama HTML5 Canvast, et luua d\u00fcnaamilisi graafikaid, animatsioone ja interaktiivseid visuaale.","breadcrumb":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477#breadcrumb"},"inLanguage":"et","potentialAction":[{"@type":"ReadAction","target":["https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477"]}]},{"@type":"ImageObject","inLanguage":"et","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477#primaryimage","url":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg","contentUrl":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2024\/11\/1111.jpg","width":442,"height":816},{"@type":"BreadcrumbList","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/?page_id=477#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430","item":"https:\/\/glebdranitson24.thkit.ee\/wp\/"},{"@type":"ListItem","position":2,"name":"Veebirakendused"}]},{"@type":"WebSite","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#website","url":"https:\/\/glebdranitson24.thkit.ee\/wp\/","name":"Gleb Dranitsyn \/ Portfolio","description":"Tarkvara aarendaja","publisher":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/glebdranitson24.thkit.ee\/wp\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"et"},{"@type":"Organization","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#organization","name":"Gleb Dranitsyn \/ Portfolio","url":"https:\/\/glebdranitson24.thkit.ee\/wp\/","logo":{"@type":"ImageObject","inLanguage":"et","@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#\/schema\/logo\/image\/","url":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2025\/03\/cropped-cropped-logo1.jpg","contentUrl":"https:\/\/glebdranitson24.thkit.ee\/wp\/wp-content\/uploads\/2025\/03\/cropped-cropped-logo1.jpg","width":400,"height":171,"caption":"Gleb Dranitsyn \/ Portfolio"},"image":{"@id":"https:\/\/glebdranitson24.thkit.ee\/wp\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/pages\/477","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=477"}],"version-history":[{"count":6,"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/pages\/477\/revisions"}],"predecessor-version":[{"id":486,"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=\/wp\/v2\/pages\/477\/revisions\/486"}],"wp:attachment":[{"href":"https:\/\/glebdranitson24.thkit.ee\/wp\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}