nicht angemeldet
6ecke anordnen
Hallöchen,
ich versuche mich seit ein paar Tagen an HTML und stehe nun vor meinem ersten großen Problem: Ich möchte für ein Browsergame eine Karte anfertigen, die aus Sechsecken besteht. Jetzt habe ich aber keine Ahnung ( etwa 2h Ziel- und Planlos herumprobiert ), wie ich diese anordnen kann. 4eckige imgs sind einfach in einer Tabelle darzustellen aber 6ecke ...
1. besteht das Problem, dass ich nicht so recht von der 4eckigen Bildform wegkomme ( benutze Adobe Photoshop aber auch da bleibt der weiße "Restrand" )
2. Muss das irgendwie wabenförmig angeordnet werden ...
Es soll dann in etwa so aussehen, wie dieses Drahtgitter:
http://www.kaufmann-drahtwaren.de/images/sechseck.jpg
Und jedes Element muss eigens "anklickbar" sein. Muss übrigens nicht alles per HTML gelöst werden, können auch PHP-Befehle mit einfließen.
Aber irgendwie habe ich gerade ein Brett vorm Kopf - keinerlei Ideen mehr, wie ich es anstellen könnte ....
-
Hi,
ich versuche mich seit ein paar Tagen an HTML und stehe nun vor meinem ersten großen Problem: Ich möchte für ein Browsergame eine Karte anfertigen, die aus Sechsecken besteht. Jetzt habe ich aber keine Ahnung ( etwa 2h Ziel- und Planlos herumprobiert ), wie ich diese anordnen kann. 4eckige imgs sind einfach in einer Tabelle darzustellen aber 6ecke ...
Ein großes Bild mit der gesamten Karte, dazu map/area?
cu,
Andreas--
MudGuard? Siehe http://www.Mud-Guard.de/
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hello,
gifs und Transparenz nutzen. Dann kannst Du sie in Quadraten verpacken, die mit position:absolute oder so ähnlich positioniert werden.
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau-
Hi,
gifs und Transparenz nutzen. Dann kannst Du sie in Quadraten verpacken, die mit position:absolute oder so ähnlich positioniert werden.
Dann sind aber auch die anklickbaren Bereiche Rechtecke, nicht Sechsecke.
cu,
Andreas--
MudGuard? Siehe http://www.Mud-Guard.de/
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.-
Hi,
gifs und Transparenz nutzen. Dann kannst Du sie in Quadraten verpacken, die mit position:absolute oder so ähnlich positioniert werden.
Dann sind aber auch die anklickbaren Bereiche Rechtecke, nicht Sechsecke.
cu,
AndreasDer User soll natürlich nur auf den sichtbaren Bereich klicken. Blöd wird es nur, wenn sich die Bereiche überschneiden, dann weiß ich nicht, welchen Feld html dann nimmt ... hmmm ... na ich werde es mal ausprobieren. Aber wie gesagt - für komfortablere Lösungsvorschläge bin ich immer zu haben :)
-
Hello,
lass den User überall klicken und entscheide auf dem Server, was wozu gehört.
Es erhöht ja auch die Spannung des Spiels, wenn der User sich verklicken kann.Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
-
Moin!
Dann sind aber auch die anklickbaren Bereiche Rechtecke, nicht Sechsecke.
Nicht, wenn der oberste, mit CSS angeordnete Rahmen ein durchsichtiges Gif mitsamst Imagemap enthält und darunter sich die mit CSS angeordneten Grafiken befinden, welche die Sechsecke darstellen.
Damit wäre dann ein sechseckiger Bereich anklickbar und die Grafiken - optisch die "Bereiche" - sogar einzeln für "highlighting" adressierbar. Alles ohne auf allzugroßen serverseitigen Schnodder zurückgreifen zu müssen- aber zu können :)
So. Falls das jetzt jemand patentieren will... hier stehts schon...
MFFG (Mit freundlich- friedfertigem Grinsen)
fastix®
--
Als Freiberufler bin ich immer auf der Suche nach Aufträgen: Schulungen, Development. Auch für seriöse Agenturen.
-
-
Ich schau es mir mal an - habe mit dem Befehl schonmal gearbeitet, war aber irgendwie sehr aufwändig :p
Wenn jemand noch eine bessere Idee hat nehme ich sie gerne entgegen, wenn nicht - so sollte es gehen.
Danke schonmal!
-
-
Hi,
ich versuche mich seit ein paar Tagen an HTML und stehe nun vor meinem ersten großen Problem: Ich möchte für ein Browsergame eine Karte anfertigen, die aus Sechsecken besteht. Jetzt habe ich aber keine Ahnung ( etwa 2h Ziel- und Planlos herumprobiert ), wie ich diese anordnen kann. 4eckige imgs sind einfach in einer Tabelle darzustellen aber 6ecke ...
Ein großes Bild mit der gesamten Karte, dazu map/area?
cu,
AndreasEs geht mir weniger darum, eine komplette Karte zu haben, auf der ich einige Punkte linken kann, nein. Die gesamte Karte besteht aus Sechseckigen Feldern. Jedes Einzelne ist ein input für sich, bzw soll es mal werden :)
Somit muss jedes Feld an jeder Stelle anklickbar sein. Außerdem ist es geplant, dass sich die Felder im Aussehen "verändern" ( also von unentdeckt zu entdeckt ), somit entfällt die Idee mit der Komplettkarte - außerdem lässt sich eine Karte aus vielen gleichen Elementen viel besser / leicher erweitern!Im Moment sind es bei mir tables in tables, so bekomme ich die grobe anordnung hin. Jedoch nur als Vierecke - wie ich die Sechecke _ineinander_ bekomme habe ich immernoch keine Ahnung ...
-
Hi,
ich versuche mich seit ein paar Tagen an HTML und stehe nun vor meinem ersten großen Problem: Ich möchte für ein Browsergame eine Karte anfertigen, die aus Sechsecken besteht. Jetzt habe ich aber keine Ahnung ( etwa 2h Ziel- und Planlos herumprobiert ), wie ich diese anordnen kann. 4eckige imgs sind einfach in einer Tabelle darzustellen aber 6ecke ...
Ein großes Bild mit der gesamten Karte, dazu map/area?
Es geht mir weniger darum, eine komplette Karte zu haben, auf der ich einige Punkte linken kann, nein. Die gesamte Karte besteht aus Sechseckigen Feldern. Jedes Einzelne ist ein input für sich, bzw soll es mal werden :)Ja und? Für jedes Sechseck der Karte ein sechseckiges area.
Ich sehe keine andere Möglichkeit, mit HTML/CSS Sechsecke, die direkt aneinandergrenzen, als klickbare Flächen zu erhalten.Somit muss jedes Feld an jeder Stelle anklickbar sein. Außerdem ist es geplant, dass sich die Felder im Aussehen "verändern" ( also von unentdeckt zu entdeckt ), somit entfällt die Idee mit der Komplettkarte - außerdem lässt sich eine Karte aus vielen gleichen Elementen viel besser / leicher erweitern!
Setze die Graphik serverseitig jeweils aus den einzelnen verdeckten/geöffneten Sechsecken zusammen.
Im Moment sind es bei mir tables in tables, so bekomme ich die grobe anordnung hin. Jedoch nur als Vierecke - wie ich die Sechecke _ineinander_ bekomme habe ich immernoch keine Ahnung ...
Um eine vom Rechteck abweichende anklickbare Fläche in HTML/CSS zu erhalten, gibt es meines Wissens nur die des shape="polygon".
cu,
Andreas--
MudGuard? Siehe http://www.Mud-Guard.de/
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da. -
Hello,
Man kann das auch auf einer kompletten Karte anklickbar machen.
Mit der GD-LIB kann man das Ding malen und dann über die Servermap die Koordiante bestimmen. damit man dann nicht lange rumrätseln muss, zu welchem Sechseck die Stelle gehört, stellt man einfach die Farbe an dieser Stelle fest (die weichen alle gaaaanz leicht ab). Man rechnet also auch wieder nur vorwärts das Bild im Speicher aus, pickt das Pixel, schaut nach der Farbe und weiß zu welchem Sechseck es gehört.
Schau mal unter http://www.szene-braunschweig.de/~games/HausVomNiko/SpielHvN.php
Da habe ich das so gemacht.
Harzliche Grüße aus http://www.annerschbarrich.de
Tom
--
Fortschritt entsteht nur durch die Auseinandersetzung der Kreativen
Nur selber lernen macht schlau
-
-
-
____ ____
__/ \___/ \_
\___/ \___/
__/ \___/ \_
\___/ \___/Ein Bild sieht dann so aus:
____ B
A \____/ C (Den Rahmen kannst du dir denken)
____/ \ DDie Bilder werden einfach hintereinander angeordnet, z. B.
<img ... /><img ... /><img ... /><br />
<img ... /><img ... /><img ... /><br />Die Bilder liegen in einem Array, das n*m Elemente hat (n Zeilen, m Spalten, aber keine HTML-Tabelle(!)). Wird ein Bild angeklickt, so muss erst ermittelt werden, welcher Bereich angeklickt wurde. Man kann dafür entweder jedes Bild als eine ImageMap betrachten, oder über die Koordinaten des Bildes und der Maus gehen. Wird nun ein Bereich angeklickt, z. B. B, so ersetzt du das Bild durch ein Bild, in dem der B-Bereich irgendwie markiert ist, und das darüberlegende Bild (Modulo ist dein Freund) wird mit einem Bild ersetzt, in dem der D-Bereich markiert ist. Je nach dem, ob mehrfache Selektion möglich ist oder nicht, must du die entsprechende Anzahl von Bildern erstellen.
MfG Dimitri Rettig
-
N'Obend
Denke das sollte mit (heftigem) Tabelleneinsatz kein Problem sein
________________
/| |\ | | /
/_|_|_|_|/____
\ | | /| |\ _|_|/_|_|_\______
/| |\ | | /
/_|_|_|_|/___OK, sehe schon, da blickt eh keiner durch...
Jedenfalls machst du ein Gerüst in dem jedes Kästchen 2 Zeilen Höhe hat.
Jeder Kasten ist demnach dann auf 6 Zellen verteilt.
In der Mitte übereinander 2 Rechtecke, links und recht drumherum dann die schrägen Kanten.http://home.arcor.de/dbenzhuser/daten/hextest.html
Achtung: Mieser Code, ich hatte jetzt einfach keine Lust zuviel zeit zu verschwenden :) (daher auch die großen Bilder, die hatte ich noch rumliegen....)Problematisch sind also nur noch die schrägen Bilder. Da sollte es aber mit einer simplen Image-Map getan sein.
Den Wulst (inkl. Image-Maps, richtigen Farben etc.) zu erstellen ist sicher etwas an stupidem Programmieraufwand, sollte aber zu machen sein.
Tschö,
dbenzhuser -
Hallo,
ich versuche mich seit ein paar Tagen an HTML und stehe nun vor meinem ersten großen Problem: Ich möchte für ein Browsergame eine Karte anfertigen, die aus Sechsecken besteht. Jetzt habe ich aber keine Ahnung ( etwa 2h Ziel- und Planlos herumprobiert ), wie ich diese anordnen kann.
Vielleicht bringt http://www.designdetector.com/tips/3DBorderDemo2.html dich auf Ideen. :-)
Gruß,
MI
--
Webdienstleistungen für kleine und mittlere Unternehmen: http://jendryschik.com/
Einführung in XHTML, CSS und Webdesign: http://jendryschik.de/wsdev/einfuehrung/
Disclaimer? Eine Stellungnahme zum Thema : http://jendryschik.de/misc/disclaimer-
Holladiewaldfee,
Vielleicht bringt http://www.designdetector.com/tips/3DBorderDemo2.html dich auf Ideen. :-)
Interessant :-)
Aber was sollen Dinger wiewidth:758px;
w\idth:500px; ?Wenn ich die obere Zeile rausnehmen ändert sich nix, und der Schrägstrich in der unteren Zeile scheint irgendwie nichts zu bewirken...
Ciao,
Harry
--
Bald kommt die Waldfee ... (Projektphase: Planung)
Bis dahin:
http://harry.ilo.de/projekte/berge/-
Hallo,
Interessant :-)
Aber was sollen Dinger wiewidth:758px;
w\idth:500px; ?http://www.designdetector.com/tips/3DBorderDemo2.html
...
/* firstly deal with IE5's broken box model. The rule below works for IE only */
/* See http://www.info.com.ph/~etan/w3pantheon/style/modifiedsbmh.html */* html div {
width:60px; /* Total box width (borders + padding + width) for IE5/Win */
w\idth:52px; /* Other versions of IE get this width */
height:26px; /* Total box height */
he\ight:18px;
}
...http://www.info.com.ph/~etan/w3pantheon/style/modifiedsbmh.html
viele Grüße
Axel
-
Holladiewaldfee,
/* firstly deal with IE5's broken box model. The rule below works for IE only */
/* See http://www.info.com.ph/~etan/w3pantheon/style/modifiedsbmh.html */Hab ich auch grade entdeckt, Danke ;-)
Ciao,
Harry
--
Bald kommt die Waldfee ... (Projektphase: Planung)
Bis dahin:
http://harry.ilo.de/projekte/berge/
-
-
-
-
http://www.kaufmann-drahtwaren.de/images/sechseck.jpg
Ich kann dir das Feld anbieten, aber das Problem sind die Klicks, da ist dann doch ein bisschen mehr Feinarbeit nötig
http://home.arcor.de/struebig/computer/javascript/test/hexagon.htmlJemand der schon mal ein Spiel programmiert hat, sollte die Logik, die dafür nötig ist aber hinkriegen (ich vermute mal, das man die Koordintaten in einem Array speichert und dann beim Klick diese vergleicht, dafür gibt es bestimmt auch einen Algorithmus)
Struppi.