PHP, HTML & CSS Koordinatensystem

[TheCreeper202]

hallöchen
ich mach zurzeit eine koordinatensystem api die so ein koordinatensystem erzeugen soll:

<?php
include 'class.koordinatensystem.php';
$ks = new Koordinatensystem(5, 5, "bg.png");
$k1 = new Koordinate(5, 5);
$k2 = new Koordinate(3, 4);
$ks->neu($k1);
$ks->neu($k2);
echo $ks;
?>

und macht daraus das:

<div style="height: 5cm; width: 5cm; background-image: url('bg.png');">
      <div style="height: 1cm; width: 1cm; z-index: 1; left: 5cm; top: 0cm; position: absolute; background-image: url('kor.png')">
      <div style="height: 1cm; width: 1cm; z-index: 2; left: 3cm; top: 1cm; position: absolute; background-image: url('kor.png')">
</div>

alles funkt nur der zweite punkt kos beginnt ein kos direkt daneben also der erste punkt wird eingefügt geht alles doch da wo das bild vom ersten endet beginnt der zweite an zu messen alse:

erster:
left: 5cm;
zweiter:
left: 3cm;
(ist aber 8cm)
helft mir bitte

 

[freak_007]

Ich glaube du brauchst das hier. Es entfernt sämtliche browserspezifische stylistische Änderungen. Ansonsten denke ich du kannst es mit JQuery und Ajax machen. Das ist einfacher als DOM JavaScript.
Gruß,
Freak

 

[irgendjemand]

@TO
also der post haut ja mal derb aus dem "zuständigkeitsbereich" raus ...
das man hier mal ab und zu was von JS liest ... ja ... aber das da ist heftig es im netzwerk-subforum zu posten ...

 

[freak_007]

@TO
also der post haut ja mal derb aus dem "zuständigkeitsbereich" raus ...
das man hier mal ab und zu was von JS liest ... ja ... aber das da ist heftig es im netzwerk-subforum zu posten ...

Verdammt ich dachte wir wären im System.gc(); JavaScript Bereich.

 

[irgendjemand]

worauf ich eigentlich hinaus wollte : das man hier öfter mal sachen über JS liest ... ja ... *no further com* ...
aber das man in nem forum , welches sich eigentlich mit möglichkeiten von java rund ums netzwerk beschäftigt , den aufbau einer site *und teile des backends* postet was mit dem thema des forums mal überhaupt keine gemeinsamkeiten hat ... ist dann doch recht fehl-platziert ...

und das sollte man nach 43 posts hier im java-forum auch eigentlichen wissen

 

[TheCreeper202]

alles was ich wissen will ist wie man das übereinanderlegt
mein ganzer code:

<?php
class Koordinatensystem {
    private $echo;
    private $l;
    private $b;
    private $z = 1;
    public function __construct($l, $b, $bild) {
        $this->echo = "<div style=\"height: ".$b."cm; width: ".$l."cm; background-image: url('".$bild."');\">\n";
        $this->l = $l;
        $this->b = $b;
    }
    public function __toString() {
        return $this->echo."        </div>\n";
    }
    public function neu(Koordinate $koordinate) {
        $x = $koordinate->positionX();
        $y = $koordinate->positionY();
        $y = $this->l - $y;
        $this->echo .= "            <div style=\"height: 1cm; width: 1cm; z-index: $this->z; left: ".$x."cm; top: ".$y."cm; position: absolute; background-image: url('kor.png')\" />\n";
        $this->z++;
    }
}
class Koordinate {
    private $x;
    private $y;
    public function __construct($x, $y) {
        $this->x = $x;
        $this->y = $y;
    }
    public function positionX() {
        return $this->x;
    }
    public function positionY() {
        return $this->y;
    }
}
?>

die tabs und \ns sind für einen übersichtlichen quelltext im browser

 

[TheCreeper202]

habs geschafft:

<?php
class Koordinatensystem {
    private $echo;
    private $l;
    private $b;
    private $z = 1;
    public function __construct($l, $b, $bild) {
        $this->echo = "<div style=\"height: ".$b."cm; width: ".$l."cm; background-image: url('".$bild."');\">\n";
        $this->l = $l;
        $this->b = $b;
    }
    public function __toString() {
        return $this->echo."        </div>\n";
    }
    public function neu(Koordinate $koordinate) {
        $x = $koordinate->positionX();
        $y = $koordinate->positionY();
        $y = $this->l - $y;
        $this->echo .= "            <div style=\"height: 1cm; width: 1cm; z-index: $this->z; left: ".$x."cm; top: ".$y."cm; position: absolute;\">\n               <img src=\"kor.png\">\n            </div>\n";
        $this->z++;
    }
}
class Koordinate {
    private $x;
    private $y;
    public function __construct($x, $y) {
        $this->x = $x;
        $this->y = $y;
    }
    public function positionX() {
        return $this->x;
    }
    public function positionY() {
        return $this->y;
    }
}
?>

einfach img tag verwenden

 

[freak_007]

Glaub ich nicht. Die div Tags sind nicht html konform. Deswegen ging es nicht. Diese Tags musst du schließen. Ich habe kleine Tests durchgeführt und meine. Du solltest es so umschreiben. Somit brauchst du keine img Tags

<?php 
class Koordinatensystem { 
    private $echo; 
    private $l; 
    private $b; 
    private $z = 1; 
    public function __construct($l, $b, $bild) { 
        $this->echo = "<div style=\"height: ".$b."cm; width: ".$l."cm; background-image: url('".$bild."'); position:absolute\">\n";// Hab position zu position absolute geänder 
        $this->l = $l; 
        $this->b = $b; 
    } 
    public function __toString() { 
        return $this->echo."</div>\n"; 
    } 
    public function neu(Koordinate $koordinate) { 
        $x = $koordinate->positionX() - 1; // Du willst doch das bild vor den x Koordinaten machen
        $y = $koordinate->positionY(); 
        $y = $this->l - $y; 
        $this->echo .= "\t<div style=\"height: 1cm; width: 1cm; z-index: $this->z; left: ".$x."cm; top: ".$y."cm; position: absolute; background-image: url('kor.png')\" /></div>\n"; 
        $this->z++; 
    } 
} 
class Koordinate { 
    private $x; 
    private $y; 
    public function __construct($x, $y) { 
        $this->x = $x; 
        $this->y = $y; 
    } 
    public function positionX() { 
        return $this->x; 
    } 
    public function positionY() { 
        return $this->y; 
    } 
} 
?>

Übrigens wenn du nächstes mal so etwas entwickelst schau darauf das du es zuerst ohne Bilder entwickelst (mit Farben) und dann diese Farben mit Bilder füllst.
Gruß, Freak

 

[TheCreeper202]

doch geht so denn <div ... /> schließt es sofort aber jetzt würd ich gern noch eine skalierung für die cm mit strichen und zahlen
also:

5
-
4
-
3
-
2
-
1
-
0 | 1 | 2 | 3 | 4 | 5

 

[freak_007]

doch geht so denn <div ... /> schließt es sofort

Nein, nicht bei HTML, sondern nur bei XHTML. Lese dir bei SelfHTML es nochmal durch die Unterschiede zwischen XHTML und HTML an.

5
-
4
-
3
-
2
-
1
-
0 | 1 | 2 | 3 | 4 | 5

Ich werde nicht alles machen was du willst, sondern du musst explizite Fragen zu den Thema stellen oder eine genaue Beschreibung (Zeichnung) über das was du realisieren willst und Fragen dazu stellen wie du es realisieren kannst. Falls du es selbst nicht machen willst, stelle es als Job Angebot. Von mir persönlich bekommst du kein Code Fertiggericht sondern nur Verbesserungsvorschläge. Streng dein Hirn an. Schau darauf das du dein Code selber zusammenbekommst.
Gruß,
Freak

 

[Evil-Devil]

Ein Div sollte man auch in XHTML mit </div> abschließen. Meiner Erfahrung nach verhält sich ein <div /> nämlich wie ein Inline-Element und das wo ein DIV eigentlich ein Block Element ist. Drum immer <div>inhalt</div>!

Und in deinen Inline-Styles würde ich nur die left, top und z-index Werte angeben. ALles andere sollte über CSS Definitionen in der CSS Datei erfolgen.

Alles in allem ist es aber relativ einfach dein Vorhaben...
Eventuell würde es auch Sinn machen anstatt DIV ein SPAN zu nutzen. Je nachdem was an der Koordinate noch liegen/passieren soll.

 

[TheCreeper202]

ich hab in nem buch von der g2 bibliothek gelesen da wurde aber nur erwähnt wie man quadrate polygone usw macht kann man da irgend wie ne skalierung machen? am besten für jede mögliche koordinate ein quadrat aber mit skalierung rechts und unten in cm