Spel: Maps als grid
momenteel ben ik bezig met een eigen spel, hiervoor heb ik al een kleine basis gemaakt voor het hoofdzakelijke (hou het zo strak mogelijk voor performance). Nu loop ik echter tegen een probleem aan van 2 keuzes die ik kan nemen.
Ik zal even uitleggen wat ik met de titel bedoel. Ik heb een Map die uiteindelijk als een grid zal werken. Dus overal voorgedefinieerde blokken met coordinaten. Zie onderstaande poging:
[ ][ ][ ]
[ ][ ][ ]
[ ][ ][ ]
Dit is heel basis, maar ook het belangrijkste van mijn toekomstige level designs.
De grid genereren lukt al (een array maken met coordinaten), alleen het struikelblok is dit.
Voor het voorbeeld hierboven is 1 achtergrond plaatje voldoende om alles te overdekken, maar zodra levels groter worden zal dit niet meer werken. Om niet alles in 1 keer te hoeven laden zal ik delen van een map cachen voordat iemand het ziet (wat logisch is aangezien je geen lag wilt) en als een map meebeweegt worden er nieuwe grids geladen. Voorbeeld: X ziet gebruiker niet en zal worden gecached. Y ziet de gebruiker wel. Buiten de x's om kan ook nog veel meer zijn, maar dat wordt dan gecached zodra de gebruiker die kant op gaat.
[x][x][x][x][x][x][x][x][x]
[x][x][x][x][x][x][x][x][x]
[x][x][y][y][y][y][y][x][x]
[x][x][y][y][y][y][y][x][x]
[x][x][y][y][y][y][y][x][x]
[x][x][y][y][y][y][y][x][x]
[x][x][y][y][y][y][y][x][x]
[x][x][x][x][x][x][x][x][x]
[x][x][x][x][x][x][x][x][x]
Mijn vraag is na heel dit verhaal: Is het mogelijk van 1 groot plaatje en bepaalde sectie op te roepen zonder het helemaal te hoeven laden? Sommige mappen zullen zeker enkele MB's groot worden.
Mijn 2de oplossing hiervoor was per grid een texture invoegen. Dit zou ook kunnen, maar de vraag is dan: Als je veel verschillende textures inlaadt is het dan niet onwijs traag?
Mochten jullie een beter idee hebben dan deze 2 laat het dan ook weten :)
Groeten Michael
php.net: GD functies
als voorbeeld (weet niet zeker of hij ook echt werkt):
Code (php)
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
<?php
function getmappart($x, $y, $width, $height, $newwidth, $newheight, $source){
$im = imagecreatetruecolor($newwidth, $newheight);
$img = imagecreatefromjpeg($source);
imagecopyresized($im, $img, 0, 0, $x, $y, $newwidth, $newheight, $width, $height);
header('Content-type: image/jpeg');
imagejpeg($im);
}
?>
function getmappart($x, $y, $width, $height, $newwidth, $newheight, $source){
$im = imagecreatetruecolor($newwidth, $newheight);
$img = imagecreatefromjpeg($source);
imagecopyresized($im, $img, 0, 0, $x, $y, $newwidth, $newheight, $width, $height);
header('Content-type: image/jpeg');
imagejpeg($im);
}
?>
van oplossing 2 heb ik niet veel verstand ;)
Als die laatste stap niet met native JS lukt, kan je iets als Raphaël proberen.
Deze manier is waarschijnlijk het beste voor de performance, omdat je dan zo min mogelijk delen nodig hebt, en ook alleen dat downloadt, wat je nog niet hebt. Ik geloof dat Google Maps ook iets vergelijkbaars doet.
Als je dan server load op wil offeren voor meer snelheid, kan je natuurlijk ook de omliggende blokken alvast cachen.
En wanneer je het dan echt goed wil doen, moet je de blokgrootte optimaliseren: grotere blokking zorgt voor minder request overhead, maar meer onnodig gedownload.