Browse Source

Funktion zum Zeichnen von Linien für die Schlangen und Leitern erstellt

main
Richard Halsall 2 years ago
parent
commit
eb2259b7fb
  1. 32
      schlangen_und_leitern/js/makeBoard.js

32
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);
}

|||||||
100:0
Loading…
Cancel
Save