From eb2259b7fbdd895f7bc2fe1ce21ba34d9a720e6c Mon Sep 17 00:00:00 2001 From: Richard Halsall Date: Mon, 6 Feb 2023 19:02:00 +0100 Subject: [PATCH] =?UTF-8?q?Funktion=20zum=20Zeichnen=20von=20Linien=20f?= =?UTF-8?q?=C3=BCr=20die=20Schlangen=20und=20Leitern=20erstellt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- schlangen_und_leitern/js/makeBoard.js | 32 ++++++++++++++++++++++++++- 1 file changed, 31 insertions(+), 1 deletion(-) diff --git a/schlangen_und_leitern/js/makeBoard.js b/schlangen_und_leitern/js/makeBoard.js index 7efd1af..e871dbf 100644 --- a/schlangen_und_leitern/js/makeBoard.js +++ b/schlangen_und_leitern/js/makeBoard.js @@ -66,13 +66,19 @@ function boardObject(){ this.start; this.end; } + + //leiter Objekte(anfang , ende) let leitern = [[7, 33],[24, 44],[31, 55],[60, 77]]; //schlange Objekte (anfang , ende) let schlangen = [[99, 56], [86, 64],[60, 28],[18,1]]; + + + //fullen des Objekts array function generateBoardObjects (leitern, schlangen, objectArray){ + for(let i = 0; i < leitern.length; i++){ let leiter = new boardObject; leiter.type = "l"; @@ -88,8 +94,32 @@ function generateBoardObjects (leitern, schlangen, objectArray){ schlange.end = schlangen[i][1]; objectArray.push(schlange); } - } +//function that draws a line using x,y cooridinates of two points +function drawLine(type, count, ax,ay, bx, by){ + if(ay>by) + { + bx=ax+bx; + ax=bx-ax; + bx=bx-ax; + by=ay+by; + ay=by-ay; + by=by-ay; + } + var calc=Math.atan((ay-by)/(bx-ax)); + calc=calc*180/Math.PI; + var length=Math.sqrt((ax-bx)*(ax-bx)+(ay-by)*(ay-by)); + console.log(length) + + + let newLine = document.createElement("div") + newLine.id = type + count; + + let style = "height:" + length + "px;width:5px;background-color:black;position:absolute;top:" + (ay) + "px;left:" + (ax) + "px;transform:rotate(" + calc + "deg);-ms-transform:rotate(" + calc + "deg);transform-origin:0% 0%;-moz-transform:rotate(" + calc + "deg);-moz-transform-origin:0% 0%;-webkit-transform:rotate(" + calc + "deg);-webkit-transform-origin:0% 0%;-o-transform:rotate(" + calc + "deg);-o-transform-origin:0% 0%;" + + newLine.style.cssText = style; + document.getElementById("board").appendChild(newLine); + }