Beiträge von Nina Scholz

Nina Scholz

Zitat von basti1012

dein bild ist sehr klein da sieht man nix . und fiddle ist gerade mal wieder down wie immer

geändert!

Nina Scholz

Hey.

Ich habe einen javascript array der wie folgt aussieht:

Code

var array=[
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000'
 ]

Alles anzeigen

Ich möchte in diesen Array (2d matrix) eine Linie mit ...

* einem bestimmten Winkel

* einer bestimmten Länge

* einem bestimmten Startpunkt

...einzeichnen und habe hierfür diese Funktion geschrieben:

Code

Array.prototype.draw_line = function(startX, startY, length, angle) {
  var matrix = this, radians = (Math.PI / 180) * angle, cos = Math.cos(radians), sin = Math.sin(radians)
  for (var i=0; i<length; i++) {
      var x=startX+i;
      var y=Math.round(sin*(x-startX)) + startY
    try {
      var point = matrix[y].split('');point[x] = 'Ä';matrix[y] = point.toString().replace(/,/g,'');
    } catch(e) {}
  }
  
  var point = matrix[startY].split('');point[startX] = 'X';matrix[startY] = point.toString().replace(/,/g,'');
    return matrix;
}

Alles anzeigen

Doch an dieser Stelle haben mich meine Mathe-Kenntnisse leider verlassen!!

Ich möchte die Linie von einem bestimmten Startpunkt (x/y) in der 2d-Matrix starten lassen und sie mit einem bestimmten Winkel zwischen (0° und 359°) kippen. Leider funktioniert meine obige Funktion nicht wirklich gut / richtig, weshalb ich mich über kleine Verbesserungen seeeeeehr freuen würde

Code

var length = 27, startX=7, startY=8, angle=0°;
var array=[
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '0000000X1111111111111111111111111100000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000'
]
 


var length = 7, startX=15, startY=8, angle=45°;
var array=[
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000001000000000000000000000',
 '000000000000000000010000000000000000000000',
 '000000000000000000100000000000000000000000',
 '0000000000000000010000000000000000000000000',
 '0000000000000000100000000000000000000000000',
 '0000000000000001000000000000000000000000000',
 '00000000000000X000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000'
]
 


var length = ~25, startX=27, startY=6, angle=~150°;
var array=[
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '011111100000000000000000000000000000000000',
 '000000111111000000000000000000000000000000',
 '000000000001111100000000000000000000000000',
 '000000000000000111111111000000000000000000',
 '000000000000000000000001111X00000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000',
 '000000000000000000000000000000000000000000'
]

Alles anzeigen

Liebe Grüße, Nina

Hier das passende jsfiddle <--

Code

var array=[
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000',
     '000000000000000000000000000000000000000000'
 ]Array.prototype.draw_line = function(startX, startY, length, angle) {
  var matrix = this, radians = (Math.PI / 180) * angle, cos = Math.cos(radians), sin = Math.sin(radians)

  for (var i=0; i<length; i++) {
        var x=startX+i;
        var y=Math.round(sin*(x-startX)) + startY
    try {
      var point = matrix[y].split('');point[x] = 'Ä';matrix[y] = point.toString().replace(/,/g,'');
    } catch(e) {}
  }
  

  var point = matrix[startY].split('');point[startX] = 'X';matrix[startY] = point.toString().replace(/,/g,'');
    return matrix;
}

console.log(array.draw_line(15,9,10,90).join('\n'))

Alles anzeigen

---

Edit: Diese Abbildung verdeutlicht die Winkel der Gerade.

https://picload.org/view/ddraoapa/…um11.3.png.html

Beiträge von Nina Scholz

Gerade mit bestimmten Winkel / bestimmter Länge in array zeichnen (How to?)

Gerade mit bestimmten Winkel / bestimmter Länge in array zeichnen (How to?)