Map erstellen

Moin moin.

Ich bräuchte mal Eure Hilfe bzw. Eure Erfahrungen.

Bei unserem neuen Spiel wird es eine Karte geben auf dem der User sich bewegen kann. Die Map an sich wird eine Größe von mind. 400 x 400 haben wovon jedes Feld ein anderer Typ (Wald, Wiese etc) sein kann. Der User sieht aber natürlich nur einen begrenzten Ausschnitt.

Jetzt zu meiner Frage:

Wie erstellt man die Map am besten? Wir haben es bereits auf verschiedenen Wegen versucht, sind aber immer noch nicht zufrieden.

Unser erster Versuch war den Ausschnitt für den User (25 x 25) einzeln zusammensetzen zu lassen (also Feld für Feld). Dies war relativ langsam, da jede Grafik einzeln geladen werden musste und trotz der relativ kleinen Größe, es ja viele Grafiken sind, die geladen werden müssen.

Der zweite Versuch ist nun die Karte per PHP als eine Grafik auseben zu lassen, also die einzelnen Bestandteile der Map mittels PHP Grafikfunktionen zu einer Grafik zu vereinen und diese dann auszugeben. Dies ist von der Performance bereits deutlich schneller, jedoch ist die erzeugte Grafik über 600 kb groß und daher braucht es ca. 1-2 Sekunden die Grafik zu laden (im Internet - lokal ist die Grafik natürlich sofort da). Auch nicht wirklich performant, um über eine Map zu navigieren.

Gibt es noch andere Möglichkeiten? Hat jemand vielleicht noch ein paar Tipps? Das Ganze wird mit PHP / Javascript realisiert, also bitte keine Diskussion um die Bordmittel. Danke.

eine grafik mit allen feldern und per css-tiling auf die map bringen schonmal probiert?

sollte imo das beste ergebnis liefern, ist aber auch nicht so einfach. CSS-tiling zickt manchmal ..

genau so machen wirs auch.

normalerweise müsste es ausreichend flott sein, wenn nicht jedes der 400*400 tiles eine komplett neue grafik ist, sondern sich bestimmte felder wiederholen? Wir arbeiten zb. insgesamt mit ca. 100 tiles (wiesen, wälder, berge, blumenfelder etc pp. zusammen gefügt zu handlichen sprites) mit denen wir die "welten" mit einem bestimmten algo erstellen. Zum Beispiel tauchen bestimmte Ressourcen nur einmal pro Insel auf, wieder andere in einer geringeren Häufigkeit als bspw. die wiesen  wobei auf alles im Admintool Einfluß genommen werden kann, so zb auch auf die Größe und die ungefähre Anzahl der Inseln.

Die bisher größte getestete Welt bestand dabei aus aktuell 5000*5000 tiles. wobei von der Geschwindigkeit spürbar kein Einbruch zu erkennen ist, im vergleich zu einer vergleichbar kleinen testwelt (500*500). Der User sieht dabei natürlich wie üblich immer nur einen Ausschnitt der Karte (in unserem fall bedingt durch die größe der tiles, 9*9 felder.

JavaScript-ImageObjekte ?

wald = new Image();

wald.src = "wald.jpg";

Die Objekte werden beim ersten Laden der Seite erzeugt, danach sind die Grafiken im Cache vorhanden.

Dann könnte z.B. aus einem Gamedataframe jederzeit eine schnelle Änderung der angezeigten Grafiken per JavaScript-Bildwechsel erfolgen.

HTML: (img  src="wiese.jpg" name="feld0_0")

function bildwechsel(bildname,aktivbild)
{
document.images[bildname].src = eval(aktivbild+".src");
}

bildwechsel("feld0_0","wald");

So mache ich es zumindest.

Spiriter1982, ich weiß nicht ob Drezils Beitrag richtig rüber gekommen ist.

Beim css-tiling wird einfach ein großes Bild mit allen möglichen verschiedenen Felder-Grafiken geladen, bei dem dann per css bei jedem Feld bestimmt wird, welchen Ausschnitt dieser Mega-Grafik man anzeigt.

Dann habt ihr kein Problem mehr damit, dass viele Grafiken heruntergeladen werden, sondern nur noch eine große (was i.A. schneller geht). Bei einer so großen Anzahl verschiedener Felder-Grafiken bringt es vllt. auch noch diese statt in einer großen in mehrere kleinere aufzuteilen (am besten thematisch getrennt... was weiß ich: alle Wassergrafiken in eine Datei, dann wird wenn man das Wasser sieht evt. nur diese eine kleinere geladen)...das müsste man aber ausprobieren, obs wirklich ein Vorteil ist...

doch das kam rüber :-) zumindestens bei mir, das meinte ich mit "sprites" so machen wirs nämlich auch. wenn man die tiles alle einzelnd abspeichern würde, verbrauchen diese zusammengenommen viel mehr platz als ein großes sprite auf dem sich alle tiles befinden. Wir haben unsere Tiles für die Karte auf 2 sprites verteilt, weil nicht beide immer sofort geladen werden müssen um die karte darzustellen (z.b. nebel/kein nebel). das ist natürlich abhänig vom Spiel.

Ein Sprite sieht bei uns in der Regel so aus:

nur etwas strukturierter und mit transparentem hintergrund

die technik/verfahren lohnt sich im übrigen nicht nur bei kleinen oder großen karten/tiles, sondern können auch oftmals bei dem GUI, der webseite von nutzen sein. Abgesehen davon, dass sich sprites auch wesentlich leichter im cash ablegen lassen sind sie zumindestens für uns eine große Hilfe :-)

edit: noch ein kleiner tip beim strukturieren eines sprites ist es ganz hilfreich, die abstände - vorallem bei dingen bei denen es sich anbietet, in unserem fall die tiles - möglichst in gleichen größen anzulegen... damit beim ausstanzen der tiles aus dem sprite immer mit dem selben Wert/größe gearbeitet werden kann und nur um den Faktor x oder Y das ganze verschoben werden muss. Auch wenn dadurch das sprite minimal größer wird und es einem Platz-spar-fanatiker wie mir (kommt vom UV-Layouten, 3D Artists unter euch können das evtl. nachvollziehen) schwer fällt darüber hinwegzusehen :-)

Ok, danke für Eure Tipps. Werde mich daran mal versuchen.

Interessante Beiträge.

Im Moment wird bei uns auch die Grafik der Karte im JavaCode komplett zusammengebaut (zu einem Image). Das war erstmal das einfachste. Aber es wird, wie schon gesagt, bei jedem scrollen das komplette Image neu geladen. Das klappt dank DoubleBuffering zwar sehr geschmeidig... aber ich fürchte auch, das es nicht die beste Variante ist...

Sobald wir mal die Karten übearbeiten werde ich auf den Thread hier zurück kommen. :-)

Gruß

Santo.

Hallo leute,

also ziemlich interressant diese lösungsvorschläge, ich habe mich auch mal dran versucht, jedoch bin ich gescheitert.

Ich habe mir die einzelnen tiles in ein Image reingepackt, jedoch wollte ich das ganze aufteilen in WorldMap, Dungeon1,Dungeon2,Mystic Forest usw. halt je nach karte sollte ein anderes image verwendet werden. im Css sieht das ganze dann so aus:

mapTiles.css

CSS:

.worldMap{
    background:url(../../../img/matiles/worldmap.gif) no-repeat;
}
.worldMap.gras{
    background-position:0px 0px;
    height:77px;
    width:127px;
    float:left;
    text-align:center;
}
.worldMap.forest{
    background-position:-128px 0px;
    height:77px;
    width:127px;
    float:left;
    text-align:center;
}
.worldMap.city1{
    background-position:-256px 0px;
    height:77px;
    width:127px;
    float:left;
    text-align:center;
}

 und die Position der einzelnen divs, setze ich mit margin werten im HTML code. etwa so:

HTML:

 funktioniert auch und zeigt mir das gewünschte ergebnis an, jedoch muss ich ja eine Karte aus einer php datei auslesen , welche mit dem mapmaker generiert werden soll. und ich habe mir zunächst einfach mal gedacht, so eine "3d" karte ist ja im grunde das gleich wie 2d nur um 45 grad gedreht, leider ist es nicht der fall, ich weis echt nicht von wohin bis wohin meine schleifen laufen sollen. bei einer nicht gedrehten karte würde ich ja 2 schleifen bauen für x und y seite. und die würden von startposition gehen bis startposition + kartenhohe bzw breite. wenn ich das gleiche an der 3d karte versuche, ist bei mir alles verschoben, vllt hättet ihr da ein tipp wie ich das ganze umsetzen kann

MFG

Was du meinst ist keine 3D-Karte. Bei drei Dimensionen brauchst du noch irgendwo eine Höhe. Merkse wat?

Google mal nach Isometrische Ansicht/Karte/foobar. Es gibt Formeln wie du aus den Koordinaten die Pixelposition bestimmen kannst. Im Zweifel schaffst du das auch mit etwas Mathe selbst.

naja 3d karte meinte ich dass es drei dimensional aussieht aber im grunde ja nicht 3d ist. also mit den wiki bildern und isometrische ansicht, ist es eigentlich genau das was ich meine, kannte halt das fremdwort nicht. Der spiriter hat ja bereits ein screenshot davon, nur möchte ich zusätzlich dass es wie ein rechteck aussieht(also link/rechts oben/unten müssten da auch noch bilder sein)

ich werde mal googeln vllt finde ich irgendwelche mathe formeln

MFG

EDIT:

hm... habe gegoogelt und fand heraus dass mein problem nicht die umwandlung von Koordianten in pixel sind,sondern eher ein einfaches Array zusammen zubauen.

aktuell sieht mein array so aus

PHP:

$map['worldMap']= array(
array('posY'=>0,'posX'=>0,'tile'=>'gras'),
array('posY'=>1,'posX'=>0,'tile'=>'gras'),
array('posY'=>0,'posX'=>1,'tile'=>'forest'),
array('posY'=>1,'posX'=>1,'tile'=>'forest'),
//usw...
);

 irgendwie ist dieser aufbau nicht besonders schlau, eventuell habt ihr eine bessere möglichkeit für so ein array.

MFG

EDIT: hat sich erledigt musste nur so ein array aufbauen:

$map['worldMap'][0][0]='forest';

usw.

Mal eine weitere Frage zu dem Thema an die jenigen, die schon Tiles einsetzen. Habt ihr Erfahrungswerte bzgl. der Dateigröße von Tiles? Wie groß dürfen diese werden, um sich bei normalen Breitband-Internetverbindungen nicht negativ bemerkbar zu machen?

HiHo...

Ich bin davon abgekommen meine Karten aus einzelnen Tiles zusammenzustellen und berechne diese komplett vor (zum Vergrössern klicken):

Diese Karten sind dann je nach Grösse 300kb-1mb gross.

Auf die vorberechneten Karten werden dann nurnoch die dynamischen Tiles raufgesetzt...also alle Spielfiguren etc. Diese sind bei einer Tilegrösse von 40x40px um die 4kB gross. Ich war bisher allerdings zu faul diese in einem grossen Sprite zusammenzufassen.

Die Frage der Grösse der Dateien ist in meinen Augen eher vernachlässigbar (bzw. hat man einfach nicht so viele Möglichkeiten). Wenn deine Seite schnell laden soll, dann solltest du vor allem die Anzahl der einzeln geladenen Bilder, wie weiter oben bereits vorgeschlagen, duch die Verwendung von CSS Sprites reduzieren (was auch automatisch das Gesamtvolumen an Daten, die übertragen werden verringert). Tilebasierte Karten eignen sich hierfür excellent.

So long...

Maxx

Habe mich auch mal mit dem Thema Karte beschäftigt, und vom Backend läuft es Prima... Mapclicks, Einheiten auswählen, Aktionen starten etc.

Allerdings habe ich mit dem Frontend ein Problem... mein CSS ist nämlich alles andere als toll.

Habe bis jetzt die einzelnen Tiles in DIV-Container gepackt. Jede Reihe meiner Teiles hat pro Tile 3 DIVs von dem jeder einen z-index mehr hat. Das dient mir dazu, mehrere Layer anzuzeigen (Bodentextur, Objekt, Selectgrafik des Feldes). Die DIVs haben position: absolute;

CSS:

<div style='position:absolute; top:50px; left:100px; z-index:0; border:0px;' onclick='test(0,0);'><img id='layer1_0_0' src='images/map/gras.png'>

Mein Problem ist jetzt nur, dass ich die Map nicht am Design ausrichten kann, da "absolute" halt wirklich absolute ist und die Seite immer zentriert. Somit ist die Map bei versch. AUfläsung an unterschieldichen Stellen.

(static und relativ funzen mit dem z-index nicht richtig)

Vielleicht hat ja jemand ne gute Idee, wie man es löst, oder gar besser machen kann. Wichtig ist mir nur die Layer eingeschaft, da es im Spiel sehr viele versch. Bodentexturen und Objekte und beliebige kombinationen gibt. Für jedes ein einzelnes Spriteset wäre sehr viel zusätzliche arbeit. Auch später bei eventuellen erweiterungen.

absolute ist absolut zu dem Elternelement, welchen nicht die standardeigenschaft (static?) hat. Wenn es keins gibt, dann ist es absolut zum body-element.

versuch mal

'position:absolute; top:50px; left:100px; z-index:0; border:0px;' onclick='test(0,0);'><img id='layer1_0_0' src='images/map/gras.png'>

so verhält sich das innere div immer relativ zum äußeren

Original von mar1us

Mal eine weitere Frage zu dem Thema an die jenigen, die schon Tiles einsetzen. Habt ihr Erfahrungswerte bzgl. der Dateigröße von Tiles? Wie groß dürfen diese werden, um sich bei normalen Breitband-Internetverbindungen nicht negativ bemerkbar zu machen?

also wir kommen aktuell mit einer 150kb großen spritemap aus, wenn später noch die ganzen gebäude mit drin sind, kommen wir großzügig geschätzt auf 500kb. das ist wenn man bedenkt was viele spiele alleine für die frontpage an kbs verballern, lächerlich. Es fällt nicht groß ins gewicht. zudem, wenn man die sache geschickt löst, läd man es einmal und hat dann seine ruhe.

ich würd mal grob sagen alles unter 1MB ist kein problem, mehr kann sich bei großer userzahl evtl. af die ladezeiten und den server auswirken (ist ja nicht das einzige was gealden wird)

Aber wenn man ca 100 tiles auf ein ca 200kb großes sprite bekommt, dann müsste man slebst bei einer recht abwechslungsreicher map mit verschiedenen sprites innerhalb der 500kb bleiben, wobei das natürlich auch abhänig von der größe der tiles ist. da muss man dann natürlich abwägen.

wenn du willst geb ich dir mal einen demo-account zu unserem aktuellen spiel, dann kannst du dir die karte anschauen. und die ladegeschwindigkeit selbst überprüfen.

gruß

Spiriter

Original von MrMaxx

HiHo...

Ich bin davon abgekommen meine Karten aus einzelnen Tiles zusammenzustellen und berechne diese komplett vor (zum Vergrössern klicken):

Diese Karten sind dann je nach Grösse 300kb-1mb gross.

Auf die vorberechneten Karten werden dann nurnoch die dynamischen Tiles raufgesetzt...also alle Spielfiguren etc. Diese sind bei einer Tilegrösse von 40x40px um die 4kB gross. Ich war bisher allerdings zu faul diese in einem grossen Sprite zusammenzufassen.

Die Frage der Grösse der Dateien ist in meinen Augen eher vernachlässigbar (bzw. hat man einfach nicht so viele Möglichkeiten). Wenn deine Seite schnell laden soll, dann solltest du vor allem die Anzahl der einzeln geladenen Bilder, wie weiter oben bereits vorgeschlagen, duch die Verwendung von CSS Sprites reduzieren (was auch automatisch das Gesamtvolumen an Daten, die übertragen werden verringert). Tilebasierte Karten eignen sich hierfür excellent.

So long...

Maxx

Ich habe letzte Woche Overwatch (das Spiel aus obigem Screenshot) über UMTS gespielt. Ging auch ausreichend schnell. Also sind die von maxx verwendeten Dateigrößen schon ganz in Ordnung.

Edit: Einzig vorladen könnte man die ganzen Tiles.

ich habe meine TileBased Map auch mit CSS Sprites realisiert. Funktioniert auch alles ganz wunderbar nur im IE (getestet mit Version 8 ) kommt es beim verändern der background-position zu einem unschönen flackern. Ist wirklich nur der Bruchteil einer Sekunde. Also es ist ganz kurz weg und dann werden die Tiles angezeigt. Wie gesagt, tritt es nur im IE auf. Das komische ist, dass es ab und an nicht auftritt und es funktioniert. Ich würde sagen bei 10 Kartenbewegungen taucht es ca. 7-8 mal auf. Es liegt nicht daran, dass die Grafik jedes mal neu geladen wird, dass hab ich schon kontrolliert.

Kennt jemand dieses Phänomen und weiss vielleicht sogar wie man das abstellen kann ?

wie sieht denn dein CSS style aus? also ich habe das ganze so eingebaut und es funktioniert ohne flackern

.bildKlasse{

background-image:url(tiles.jpg);

.bildKlasse .unterklasse{

background-position:-10px -10px;

width:20px;

height:20px;

und dann das div

ist bei mir ähnlich aufgebaut

CSS:

.tileset_1 { position: absolute; width: 128px; height: 64px; background-image: url(../images/tiles/tileset_1.gif); background-repeat: no-repeat; };.tile_0 { top: 0px; left: 0px; }
.tile_1 { top: 32px; margin-left: -64px; left: 0px; }
.tile_2 { top: 64px; margin-left: -128px; left: 0px; }
.tile_3 { top: 96px; margin-left: -192px; left: 0px; }
.tile_4 { top: 128px; margin-left: -256px; left: 0px; }

.tile_5 { top: 32px; margin-left: -64px; left: 128px; }
.tile_6 { top: 64px; margin-left: -128px; left: 128px; } 
.tile_7 { top: 96px; margin-left: -192px; left: 128px; }
.tile_8 { top: 128px; margin-left: -256px; left: 128px; }
.tile_9 { top: 160px; margin-left: -384px; left: 192px; }

.tile_10 { top: 64px; margin-left: -64px; left: 192px; }
.tile_11 { top: 96px; margin-left: -128px; left: 192px; }
.tile_12 { top: 128px; margin-left: -192px; left: 192px; }
.tile_13 { top: 160px; margin-left: -256px; left: 192px; }
.tile_14 { top: 192px; margin-left: -384px; left: 256px; }

.tile_15 { top: 96px; margin-left: -64px; left: 256px; }
.tile_16 { top: 128px; margin-left: -128px; left: 256px; }
.tile_17 { top: 160px; margin-left: -192px; left: 256px; }
.tile_18 { top: 192px; margin-left: -256px; left: 256px; }
.tile_19 { top: 224px; margin-left: -384px; left: 320px; }

.tile_20 { top: 128px; margin-left: -64px; left: 320px; }
.tile_21 { top: 160px; margin-left: -128px; left: 320px; }
.tile_22 { top: 192px; margin-left: -192px; left: 320px; }
.tile_23 { top: 224px; margin-left: -256px; left: 320px; }
  .tile_24 { top: 256px; left: 0px; } 

 Karte wird über ein Ajax.Update abgefragt und dann wie folgt dargestellt.

PHP:

for ($i = 0; $i < 25; $i++) 
{

    echo "

";
}

Die Koordinaten wo das Tile in der Grafik zu finden ist, wird aus der DB abgefragt.  Liegt wohl doch irgendwie mit an dem Ajax.Update. Habe es für die Hover Effekte der Buttons eigentlich genauso und da gibt es auch kein flackern. Seltsam ist auch, dass es in einer früheren Version, in der alle Grafiken einzeln geladen wurden, auch im IE nicht zu diesem flackern kam.

wieso ersetzt du nicht einfach die background? weil aktuell erstellst du ja quasi jedesmal neue divs.

ich habe das so gemacht, dass ich die tile namen über ajax hole und die namen in ein div reinschreibe. etwa so:

var loadMapTiles = function(y,x){
    $.ajax({
        type: "GET",
        url: "ajax/ajaxMap.php",
        data: "y="+y+"&x="+x,
        success: function (responseText){
            $('div#mapTiles').html(responseText);
        }
    })
};

damit habe ich dann folgende ausgabe in ajaxMap.php:

echo 'var mapTiles = '.json_encode($bildernamen).';';

danach habe ich eine funktion an den ajax request drangehängt, die habe ich displayTiles() gennant

var loadMapTiles = function(y,x){
    $.ajax({
        type: "GET",
        url: "ajax/ajaxMap.php",
        data: "y="+y+"&x="+x,
        success: function (responseText){
            $('div#mapTiles').html(responseText);
            displayTiles();
        }
    })
};

und die displayTiles funktion sieht so aus:

var displayTiles = function(){
    var cssName = "";
    var tile;
    for(tile in mapTiles){
        cssName = mapName+" "+mapTiles[tile];
        $('div#mapScreen div').eq(tile).attr('class',cssName);
    }
};

somit ersetze ich bei jedem ajax request nur den klassen namen, jedoch erzeuge nicht die divs neu

So ähnlich habe ich es bei meinen ersten Mapgehversuchen auch gemacht. Allerdings der einfachheit halber über einen im statt ändern einer CSS Klasse, wobei das ja vom Mechanismus her egal ist (außer das es nicht mit Sprites geht).

Vllt mag IE ja das neu erstellen der DIVs nicht... bzw verzögert es. Soetwas ähnliches beobachte ich beim Aufbau meiner Map, die Tiles laden mit einewm Bruchteil einer Sekunde nacheinander. Liegt also vielleicht an den DIVs und net am laden der Bilder.

Original von NeoArmageddon

Liegt also vielleicht an den DIVs und net am laden der Bilder.

vermute ich auch;)

Hm, die DIVs wurden auch schon in der früheren Version immer neu erstellt und das ohne flackern. Allerdings wurden da alle Grafiken einzeln geladen. Naja ich prüfe mal ob eine Umstellung nach BlackScorp's Art abhilfe schafft und ob sich der Aufwand für mich dann noch einigermassen in Grenzen hält.

Das meine jetzige Lösung nicht optimal ist, habe ich gewusst, aber ich wollte das evtl. später mal angehen. Aber wenn jetzt der IE zickt muss ich vielleicht doch jetzt schon ran  . Erst mal danke für die Hinweise und Anregungen

Original von Isogames

Aber wenn jetzt der IE zickt muss ich vielleicht doch jetzt schon ran  .

Der IE zickt immer :-) sogesehen biste da sowieso im Dauereinsatz, wenn man nicht gerade ausschließlich für den IE prgrammiert :-)

Original von Spiriter1982

Original von Isogames

Aber wenn jetzt der IE zickt muss ich vielleicht doch jetzt schon ran  .

Der IE zickt immer :-) sogesehen biste da sowieso im Dauereinsatz, wenn man nicht gerade ausschließlich für den IE prgrammiert :-)

naja solange man nur für IE7 und 8 alles anspasst, hält sich das ganze noch in grenzen, finde ich. IE6 wird ganz böse, aber ich persönlich ignoriere den:D

naja solange man nur für IE7 und 8 alles anspasst, hält sich das ganze noch in grenzen, finde ich. IE6 wird ganz böse, aber ich persönlich ignoriere den:D

Den IE6 sollte man sowieso gesammelt boykottieren, damit alle Benutzer gezwungen werden sich einen vernünftigen Browser zu installieren ;)

Original von Murmeli

naja solange man nur für IE7 und 8 alles anspasst, hält sich das ganze noch in grenzen, finde ich. IE6 wird ganz böse, aber ich persönlich ignoriere den:D

Den IE6 sollte man sowieso gesammelt boykottieren, damit alle Benutzer gezwungen werden sich einen vernünftigen Browser zu installieren ;)

nicht man man denkt ich würde diesen Teil verteidigen aber es gibt Situationen wo man den User zum IE6 zwingt...

naja solange man nur für IE7 und 8 alles anspasst, hält sich das ganze noch in grenzen, finde ich. IE6 wird ganz böse, aber ich persönlich ignoriere den:D

Der ie6 bekommt von mir noch ne ie8.js datei mitgeschickt, ansonsten ignorier ich den auch. Funktioniert aber relativ gut damit - ist halt einfach noch langsamer, aber das sind sich ie6 nutzer ja gewohnt.

http://code.google.com/p/ie7-js/

Ach ja, ich habe mal für ein browserspiel, dessen entwicklung eingestellt wurde, versucht eine isometrische Karte zu erstellen, die sich ähndlich wie Google maps über drag&drop verschieben lässt und die neuen bereiche automatisch nachlädt. Ich habe keine verwendung mehr dafür. Daher, falls jemand interesse hat, kann er sich melden.

http://grooohm.org/isoAjaxMap/

Original von Nerosmeel

nicht man man denkt ich würde diesen Teil verteidigen aber es gibt Situationen wo man den User zum IE6 zwingt...

Das sind in meinen Augen auch genau die Situationen, in denen Nutzer keine Browsergames beziehungsweise Spiele generell spielen sollten. ;-)

Um mal wieder vom IE auf das Topic zu kommen:

Ich bastel nun eine Map und bin bereits dabei, die Verwaltung von Objekten zu machen. Die einfachste möglichkeit ist, das es einfach für verschiedene Objekte verschiedene Tabellen gibt, die jeweils eine Koordinaten Eintrag haben. Also eine Tabelle mit den Spielerfiguren, eine für Bäume, Steine und Co, eine für NPC Gegner, eine für Städte etc... dann rufe ich beim Map aufbau einfach die Tabellen ab und generiere die Objekte auf der Map.

Die 2. Möglichkeit, die ich mir überlegt habe und die ich eleganter und besser finde: Es gibt die Oben genannten Einträge in der Datenbank, allerdings ohne Mapspezifische Informationen wie Koordinaten. Dazu gibt es noch eine weitere Tabelle wie b.z.w. map_objects. Darin enthalten ist dann eine Referenz auf eine der obigen Spalte (also ein Typ-Wert und ein Identitätswert) und andere Informationen wie die Koordinaten. Dann brauche ich für den Aufbau der Karte nur nach einer Tabelle nach Objekten suchen und baue die dann nach Bedarf nach ihren angegeben Typ zusammen und kann so auch je nach Typ andere Methoden für die Interaktion basteln.

Da shat auch den Vorteil, das man exisiterende Objekte, die zwar existieren aber nicht auf der Map erscheinen sollen (Spieler im Gasthaus) einfach aus der map_objects nehmen kann, Speicher spart und bei Querys die durchsuchten Indices verringern kann.

Wie würdet ihr die Objectverwaltung umsetzten? Gibs noch bessere Ideen zur Struktur?

Huhu,

wo wir hier schon beim Thema sind, würd mich interessieren wie ihr die Isometrischen Objekte erstellt.
Sprich macht ihr die alle in 3D und rendert die dann einzeln in einer art "Isocam" perspektive ab oder wie sollte man am besten Isometrische Objekte gestalten?

Ich frag nur, weil ich gerad angefangen hab mein ersters richtiges Browsergame zu entwickeln, welches halt echtzeit ablaufen soll (richtig halt mit bewegbaren figuren etc. ), und mich schon interessiert wie ihr das so isometrisch macht.

Btw. ich werde flash/flex/as3 benuten (bin die letzten wochen intensiv am lernen und will jetzt mal nen protyp basteln), daher hab ich mir vorgenommen die nächsten 4 Wochen erstmal auf Flash zu "probieren" (AMFPHP , ggf. schreib ich für den chat noch nen chatserver auf socket basis).

Falls es in den 4 Wochen nicht klappt, oder es wirklich so mies ist, dass es nicht brauchbar ist , versuch ich es auf die "travianer" art :) (Also XAJAX/JS ;))...mir wärs aber auf Flash Basis lieber, gerade weil ich da nicht mit den macken eines Browsers kämpfen muss zwingend, die ja bei JS/AJAX nicht ausbleiben werden.

Die Karte die ich mal gebastelt habe setzt sich aus 3 Layern pro Kästchen zusammen: Ein Bodentextur-Layer mit dem eigendlichen "Tile", ein Objekt was drüber gelegt wird (Figur, Haus, Bäume) und einen Layer für Markierungen und/oder Effekte wie Feuer.

Man kann natürlich auch alles in einem "Layer"/Bild machen, allerdings wäre es dann nicht so leicht, bzw die gleichen Häuser auf verschiedenem Untergrund zu packen, dafür bräuchte man halt mehr einzel Grafiken. Und meinen 3. Layer wirst du sicher auch net brauchen.

Das ganze ist in JS... weiß nicht ob das mit Flash auch so gut um zusetzten ist (hab davon nämlich 0 Ahnung).