Erstellen eines Gitternetzes mit Koordinaten

Question

Ich bin etwas verwirrt mit meiner Array-Erstellung. Ich habe eine Liste von Elementen mit x: y co Koordinaten und ihre Dimensionen auch (in Rastergrößen) ... zum Beispiel:

x: 1 
y: 7 
width: 2 tiles 
height: 2 tiles 

So ist die Idee im zu tun versucht, ist eine Reihe von x zu erstellen: y Gitter das sind "besetzt". Aber Looping solche Daten so die besetzten Fliese würde dort wäre:

x: 1 
y: 7 
// 
x: 2 
y: 7 
// 
x: 1 
y: 8 
// 
x: 2 
y: 8 

Da in dem obigen Beispiel das Element 2 von 2 Fliesen (ein Quadrat).

Meine Aufgabe wird wie folgt strukturiert (in console.log gezeigt (sdata);)

7: Array[4] 
0: "1" 
1: "7" 
2: "2" 
3: "2" 

Also ja im Versuch, ein Array zu machen, diese Art von Gitter reference..Hope speichern ich, was ich erklärt versuchen, an zu bekommen, aber ich kann nicht herausfinden, wie man eine Schleife strukturiert, um das Array zu erstellen.

Answer 1

http://jsfiddle.net/rlemon/JeeV2/ Hier ist ein Beispiel dafür, wie man diese Art produzieren könnte von 'Gitter' belegte Daten.

var chords = [ // instead of arrays we'll use objects.. they're nicer. 
    { 
    x: 1, 
    y: 7, 
    h: 2, // height 
    w: 2}, // width 
{ // ohh look a second plot point. 
    x: 4, 
    y: 1, 
    h: 3, 
    w: 2}, 
]; 

var occupied = { // will be your cells points occupied 
    x: [], 
    y: []  
}; 
chords.forEach(function(chord) { // now lets loop the chords and produce the occupied array 
    occupied.x.push(chord.x); 
    occupied.x.push(chord.x + (chord.w-1)); // expand the width of the cell - initial point 
    occupied.y.push(chord.y); 
    occupied.y.push(chord.y + (chord.h-1)); // expand the height of the cell - initial point 
}); 
console.log(occupied); 
// outputs 
​Object 
    x: Array[4] 
     0: 1 
     1: 2 
     2: 4 
     3: 5 

    y: Array[4] 
     0: 7 
     1: 8 
     2: 1 
     3: 3 

Answer 2

Das resultierende Array outputArray ist eine Sammlung von Objekten im Format { x: value, y: value}.

var inputArray = [ [1,7,2,2], ... ]; 
var outputArray = []; 
for(var i = 0; i < inputArray.length; i++) { 
    var item = { 
     x: inputArray[i][0], 
     y: inputArray[i][1], 
     width: inputArray[i][2], 
     height: inputArray[i][3] 
    }; 
    for(var xx = 0; xx < item.width; xx++) { 
     for(var yy = 0; yy < item.height; yy++) {   
      outputArray.push({ 
       x: item.x + xx, 
       y: item.y + yy 
      }); 
     } 
    } 
} 

Ich fügte hinzu, die x, y, width und height Attribute es verständlicher zu machen.

Answer 3

function range(a, b) { 
    /* 
     range(5) -> [0,1,2,3,4] 
     range(1,4) -> [1,2,3] 
    */ 
    if (b===undefined) 
     var start=0, stop=a; 
    else 
     var start=a, stop=b; 

    var R = []; 
    for(var i=start; i<stop; i++) 
     R.push(i); 
    return R; 
} 

Dann ist es ein Zweizeiler:

range(x, x+width).map(function(x) { 
    return range(y, y+height).map(function(y) { 
     return {x:x, y:y}; // anything you'd like 
    }) 
}) 

Ergebnis (via JSON.stringify erhalten):

[ 
    [ {"x":1,"y":7}, {"x":1,"y":8} ], 
    [ {"x":2,"y":7}, {"x":2,"y":8} ] 
]