Mathematik Problem: n-Rechtecke in ein Rechteck

[robert]

Schon wieder bin ich da mit einer Frage,

ich versuche einen kleinen Code zu schreiben, der mir n-Rechtecke
in einem großen Rechteck platziert. Mein erster Gedanke war, die Fläche
des großen Rechtecks zu berechnen, diese durch die Anzahl der kleinen
zu teilen und dann mit der Wurzel die Seitenflächen der kleinen Rechtecke
auszurechen.
Funktioniert so aber leider nicht, da es ja dann nicht zwangsläufig ins Format
des Rechtecks passt. Das würde nur funktionieren, wenn das Große Rechteck
ein Quadrat wäre, ist es aber nicht zwangsläufig.

Die kleinen Quadrate hingegen haben ein festes Seitenverhältnis.

Ich habe dazu auch eine kleine Grafik gemacht, die vll. das Verständnis
erleichtert.


hoffe, jemand weiß da weiter

[robert]

Noch ein paar zusätzliche Infos, damits vll. leichter verständlich ist:

* Das Browser Fenster ist x * y Pixel groß.
* Die kleinen Rechtecke haben keine vorgegebene Größe, aber
ein vorgegebenes Seitenverhältnis
* Die Anzahl der kleinen Rechtecke ist vorgegeben
* Breite des Fensters sollte auf jeden Fall komplett ausgenutzt werden
d.h. die angeordneten kleinen Rechtecke sollten nebeneinander von ganz
links nach ganz rechts gehen
* Wenn möglich sollte das gleiche für die Höhe gelten

[Martin Kraft]

Nachfrage: Möchtest Du wissen...

1. wieviele Recht Ecke (einer bestimmten Größe) in ein anderes Rechteck (einer bestimmten Größe) passen?
2. wie groß ein beliebiges Rechteck sein müsste, um eine gegeben Anzahl kleinerer Rechtecke (einer bestimmten Größe) enthalten zu können?
3. wie groß ein Rechteck (einer bestimmten Proportionen) sein müsste, um eine gegeben Anzahl kleinerer Rechtecke (einer bestimmten Größe) enthalten zu können?

Edit: Ok - hab's verstanden. Ich denk mal drüber nach, aber ganz profan ist das nicht.

[robert]

Oh. Entschuldige, dass man das nicht gleich herauslesen konnte.

Beispiel:

Mein Browserfenster ist gerade 1000x700px groß. Ich habe jetzt 18 Divs,
die ich unterbringen will. Wie breit/hoch müssen die 18 Divs sein, dass
eine Zeile der 18 Divs (sozusagen im Grid angeordnet) in jedem Fall 1000px
breit ist, und wenn möglich die Spalte der 18 Divs (im Grid angeordnet)
700px hoch ist.

Also möchte ich im Endeffekt ausrechnen, wieviele dieser Divs in eine
Zeile müssen und wie breit diese einzelnen Divs sind. Sie haben ein fixes
Seitenverhältnis von z.b. 16:10.

[robert]

Habs gelöst. Was mir dabei klar wurde ist, dass es nicht möglich ist, dass
es in Breite und Höhe ins Fenster passt. Sondern nur ungefähr in der Höhe
und in der Breite auf jeden fall.

Die Lösung war für mich das Annähern.
Am Anfang mach ich die kleinen Rechtecke so breit wie das Große und
berechne deren Höhe dann entsprechend des Seitenverhältnisses.
Dann schaue ich ob die Höhe mal der Projektanzahl größer ist, als die
Höhe des Großen Rechtecks. Wenn ja, dann muss eine Spalte hinzu, d.h.
die kleinen Rechtecke sind nurnoch halb so groß, wie das große Rechteck.

Und so weiter.


Code wäre:

windowWidth = $(window).width();
	windowHeight = $(window).height();

	var projectWidth = windowWidth;
	var projectHeight = (windowWidth/16)*10;
	var pRows = 1;

	//make a straight number out of the div count
	while(nps % 2 != 0) {
		nps += 1;
	}
	while(  (((windowWidth/pRows)/16) * 10) * nps/pRows > windowHeight) {
		pRows += 1;
	}
	projectWidth = windowWidth / pRows;
	projectHeight = (projectWidth/16)*10;

Danke für die Hilfe

[Martin Kraft]

Hab mir auch mal den Kopf zerbrochen und festgestellt, das sich das Ganze auch berechnen läßt. Gerade bei größeren Anzahlen dürfte das erheblich performanter sein:

PHP-Code:

private function findSmallScale( big:Rectangle, small:Rectangle, num:uint ):Number {

    var f:Number = (big.width * small.height) / (small.width * big.height);
    var hNum:Number = Math.sqrt( num/f ); // vertial Number of Elements
    var wNum:Number = f * hNum; // horizontal Number of Elements
    
    return (Math.ceil(wNum) / wNum) > (Math.ceil(hNum) / hNum) ?
        big.width / (Math.ceil(wNum) * small.width): // If horizontal fill is better
        big.height / (Math.ceil(hNum) * small.height); // if vertical fill is better

}

// Test-Code

var small:Rectangle = new Rectangle(0, 0, 100, 60);
var big:Rectangle = new Rectangle(0, 0, 1024, 768);

var s:Number = findSmallScale(big, small, 26);

var wNum:Number = Math.floor(big.width / (small.width * s));
var hNum:Number = Math.floor(big.height / (small.height * s));

trace("s: "+s+ " | wNum:"+wNum+" | hNum:"+hNum+" = "+(wNum*hNum) ); 


Wusste nicht, dass Du JS brauchst und habe es der einfachheithalber in AS3 angelegt. Sollte ja kein Problem sein, das umzuschreiben?!