Linie zeichnen zwischen zwei Tags

[Matthias]

Hallo,

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?

Grüße, Matthias

[Cheatah]

Hi,

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?

indem man

a) Start- und Endpunkt ermittelt und diese
b) unter Verwendung von ungefähr 82.634 absolut positionierten und mit einer Hintergrundfarbe versehenen 1x1 Pixel großen Elementen

Stück für Stück eine Linie erzeugt.

Cheatah

[Matthias]

Alleine a) würde mir schon reichen... nur wie, nur wie.

[Cheatah]

Hi,

Alleine a) würde mir schon reichen... nur wie, nur wie.

naja, wo Du den Start- und den Endpunkt haben möchtest, weiß außer Dir niemand. Solltest Du also bei der Umsetzung ein Problem haben, musst Du dies schon näher erläutern.

Cheatah

[Stahli]

Hi,

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?

indem man

a) Start- und Endpunkt ermittelt und diese
b) unter Verwendung von ungefähr 82.634 absolut positionierten und mit einer Hintergrundfarbe versehenen 1x1 Pixel großen Elementen

Stück für Stück eine Linie erzeugt.

Wie kommst du auf 82.634? Wenn Start- und Endtag absolut positioniert sind (was sie ja sein müssten) bräuchte man im schlimmsten Fall (Der eine Tag liegt links oben, der andere rechts unten) bei einer Auflösung von 1024x768 weniger als 1024 1x1 Pixel große Elemente..

c) Man könnte ein Bild nehmen, das eine Linie von links oben nach rechts unten vor einem transparenten Hintergrund darstellt. Dies könnte man dann absolut positionieren und so verzerren (mittels den Attributen width und height) das es passt. Geht leider nur, wenn das obere Element etwas weiter links liegt als das untere.

Matthias, versuch mal den Sachverhalt genauer zu bescheiben.

Gruß,
Felix

[Harlequin]

Yerf!

c) Man könnte ein Bild nehmen, das eine Linie von links oben nach rechts unten vor einem transparenten Hintergrund darstellt. Dies könnte man dann absolut positionieren und so verzerren (mittels den Attributen width und height) das es passt. Geht leider nur, wenn das obere Element etwas weiter links liegt als das untere.

d) könnte man nicht auch per Javascript ein SVG mit der gewünschten Linie erzeugen?

Gruß,

Harlequin

[Cheatah]

Hi,

b) unter Verwendung von ungefähr 82.634 absolut positionierten und mit einer Hintergrundfarbe versehenen 1x1 Pixel großen Elementen
Stück für Stück eine Linie erzeugt.
Wie kommst du auf 82.634?

_ungefähr_ 82.634. Es können auch bis zu 100% weniger sein, oder aber sehr, sehr viel mehr.

Wenn Start- und Endtag absolut positioniert sind (was sie ja sein müssten)

Wieso müssten sie das?

bräuchte man im schlimmsten Fall (Der eine Tag liegt links oben, der andere rechts unten) bei einer Auflösung von 1024x768 weniger als 1024 1x1 Pixel große Elemente..

Im schlimmsten Fall bräuchte man diverse Milliarden Elemente, selbst wenn man sich mit einer Linie zufrieden stellt, die abgenagt aussieht. Wie kommst Du auf die Idee, die Linie müsse vollständig ins Browserfenster passen? Und was hat das ganze mit der Auflösung zu tun?

c) Man könnte ein Bild nehmen, das eine Linie von links oben nach rechts unten vor einem transparenten Hintergrund darstellt. Dies könnte man dann absolut positionieren und so verzerren (mittels den Attributen width und height) das es passt. Geht leider nur, wenn das obere Element etwas weiter links liegt als das untere.

Mit nur zwei Grafiken ließe sich jede Form der Platzierung nutzen. Allerdings müssen diese Grafiken mindestens die maximal denkbare Größe besitzen, sonst wird es keine Linie, sondern ein Balken - und die maximal denkbare Größe ist nur durch die Ausmaße unseres Universums begrenzt.

Matthias, versuch mal den Sachverhalt genauer zu bescheiben.

Gute Idee.

Cheatah

[Stahli]

Hi,

Wenn Start- und Endtag absolut positioniert sind (was sie ja sein müssten)

Wieso müssten sie das?

Versuch mal ein Element in unserem Universum z.B. nach links zu floaten..

Mit nur zwei Grafiken ließe sich jede Form der Platzierung nutzen. Allerdings müssen diese Grafiken mindestens die maximal denkbare Größe besitzen, sonst wird es keine Linie, sondern ein Balken - und die maximal denkbare Größe ist nur durch die Ausmaße unseres Universums begrenzt.

Und dabei gehen wir davon aus, dass diese Linie eine Gerade ist.

Gruß,
Felix

[Matthias]

Hi,

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?

indem man

a) Start- und Endpunkt ermittelt und diese
b) unter Verwendung von ungefähr 82.634 absolut positionierten und mit einer Hintergrundfarbe versehenen 1x1 Pixel großen Elementen

Stück für Stück eine Linie erzeugt.
Wie kommst du auf 82.634? Wenn Start- und Endtag absolut positioniert sind (was sie ja sein müssten) bräuchte man im schlimmsten Fall (Der eine Tag liegt links oben, der andere rechts unten) bei einer Auflösung von 1024x768 weniger als 1024 1x1 Pixel große Elemente..

c) Man könnte ein Bild nehmen, das eine Linie von links oben nach rechts unten vor einem transparenten Hintergrund darstellt. Dies könnte man dann absolut positionieren und so verzerren (mittels den Attributen width und height) das es passt. Geht leider nur, wenn das obere Element etwas weiter links liegt als das untere.

Matthias, versuch mal den Sachverhalt genauer zu bescheiben.

Danke für die Antworten. Ich beschreibe den Sachverhalt mal genauer:

In einer XHtml Seite gibt es diverse <a></a>, die wiederum ein gefülltes Attribut href und eine eindeutige id enthalten.

Ich möchte nun für ein ausgewähltes Paar <a></a> eine Linie anzeigen, die die beiden Tags verbindet.

Welchen Sinn hat diese vorgehensweise?
Wenn ich eine Linie erstellen kann, kann ich auch das Aussehen der Linie manipulieren und dann so interessante Sachen wie Gewichtungen zwischen Links darstellen (dicke Linien verbinden logisch zusammenhängende Links oder spiegeln das Besucherverhalten wieder, oder ich kann mit einem Netz von Linien Mauskorridore visualisieren).

Ich finde sowas super interessant, aber die Grundvoraussetzung, den Start und den Endpunkt im Koordinatensystem zu lokalisieren, stellt mich derzeit vor eine hohe Hürde.

Grüße, Matthias

[Vinzenz Mai]

Hallo Matthias,

Wenn ich eine Linie erstellen kann, kann ich auch das Aussehen der Linie manipulieren und dann so interessante Sachen wie Gewichtungen zwischen Links darstellen (dicke Linien verbinden logisch zusammenhängende Links oder spiegeln das Besucherverhalten wieder, oder ich kann mit einem Netz von Linien Mauskorridore visualisieren).

wenn sich die entsprechende Seite dem Platz im Viewport anpasst, dann sagen
Deine "Mauskorridore" wenig aus. Beim Benutzer angezeigte Linien manipulieren
wiederum das Benutzerverhalten :-)

Ich finde sowas super interessant, aber die Grundvoraussetzung, den Start und den Endpunkt im Koordinatensystem zu lokalisieren, stellt mich derzeit vor eine hohe Hürde.

... und möglicherweise den Rechner, der diese Grafiken mit Pixel-Divs im
Browser darstellen soll - SVG dürfte da möglicherweise ressourcenschonender
sein.

Freundliche Grüße

Vinzenz

[Stahli]

Hi,

Wenn ich eine Linie erstellen kann, kann ich auch das Aussehen der Linie manipulieren und dann so interessante Sachen wie Gewichtungen zwischen Links darstellen (dicke Linien verbinden logisch zusammenhängende Links oder spiegeln das Besucherverhalten wieder, oder ich kann mit einem Netz von Linien Mauskorridore visualisieren).

Ich denke, dass für dieses Vorhaben HTML/JavaScript/CSS _sehr_ ungeeignet sind. Flash dürfte hier eine bessere Wahl sein, wobei man sich auch über die Nachteile, die Flash mit sich bringt, in Klarem sein sollte.

Gruß,
Felix

[MudGuard]

Hi,

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?
indem man
a) Start- und Endpunkt ermittelt und diese
b) unter Verwendung von ungefähr 82.634 absolut positionierten und mit einer Hintergrundfarbe versehenen 1x1 Pixel großen Elementen
Stück für Stück eine Linie erzeugt.

Hm. Äußerst unerwartete Antwort von Dir. Eigentlich hätte ich ob der "Tags" Deine Nachfrage nach dem verwendeten Quelltext-Editors erwartet ...
Oder wenigstens den Hinweis, daß Elemente und Tags grundsätzlich verschiedenartige Dinge sind ...

cu,
Andreas

[Alexander (HH)]

Moin Moin!

Hm. Äußerst unerwartete Antwort von Dir. Eigentlich hätte ich ob der "Tags" Deine Nachfrage nach dem verwendeten Quelltext-Editors erwartet ...
Oder wenigstens den Hinweis, daß Elemente und Tags grundsätzlich verschiedenartige Dinge sind ...

Tja, die Augen werden trübe, die Krallen stumpf, der Jagdtrieb läßt nach, es wird 20 Stunden am Tag geschlafen. So ist das eben, wenn Miezekatzen alt werden. ;-)

Alexander

[Karl]

Hallo Matthias

hat jemand eine Idee, wie ich zwischen zwei bestimmten Tags (eindeutig bestimmbar mittels id) eine Verbindungslinie zeichnen lassen kann?

Was die Bestimmung der Positionen angeht wirst du wohl auf absolute Positionierungen zurückgreifen müssen.

Zum Zeichnen von Linien solltest du dir mal die Vektorgrafik-Bibliothek (Javascript) von Walter Zorn ansehen.

l.g. Karl