FINÁLNÍ VÝPRODEJ KREDITŮ na ITnetwork je tady. Využij poslední šanci a získej až 80 % extra kreditů ZDARMA na náš interaktivní e-learning. Zjisti více:
NOVINKA: Kurz kybernetické bezpečnosti s akreditací MŠMT, nyní již od 0 Kč. Staň se žádaným profesionálem. Zjisti více:
Avatar
matesax
Tvůrce
Avatar
matesax:1.12.2012 15:34

Dobrý den,
nejsem si jist, zda je problém v JS, nebo v samotném Canvas, každopádně:

http://tsnake.lusorion.com/

Do Canvas vykresluji české znaky. Rád bych měl kódování UTF-8 - deklaroval jsem jej v hlavičce HTTP a v parametru tagu script. Co mám ještě udělat? Děkuji.

 
Odpovědět
1.12.2012 15:34
Avatar
Drahomír Hanák
Tvůrce
Avatar
Odpovídá na matesax
Drahomír Hanák:1.12.2012 16:22

S vykreslovaným textem na canvas jsou celkem problémy. Pokud by to příliš nevadilo, asi bych ho umístil absolutně nad canvas.

Sám jsem to řešil pomocí sprite fontů. Měl jsem prostě vygenerované znaky v obsázku a vykresloval je. Podobně jako v XNA (ale tam to za tebe řeši framework :) ).

 
Nahoru Odpovědět
1.12.2012 16:22
Avatar
matesax
Tvůrce
Avatar
Odpovídá na Drahomír Hanák
matesax:1.12.2012 16:26

Tak to vezmu Anglicky... :)

Editováno
 
Nahoru Odpovědět
1.12.2012 16:26
Avatar
Kit
Tvůrce
Avatar
Odpovídá na matesax
Kit:1.12.2012 16:38

Něco je na té stránce špatně. Jakmile se načetla, stoupla mi zátěž procesoru na 100 % a nepřestalo to, dokud jsem tu stránku neopustil.

Nahoru Odpovědět
1.12.2012 16:38
Vlastnosti objektů by neměly být veřejné. A to ani prostřednictvím getterů/setterů.
Avatar
matesax
Tvůrce
Avatar
Odpovídá na Kit
matesax:1.12.2012 16:40

Mám tam timer - 180 ms a v něm jediný cyklus na stránce. Jak jinak to mám dělat? (Vykreslování hada.)

Nechápu, proč se nějomu nelíbí, že to napíši Anglicky - když chci aby to byla hra pro více států. (Takový malý projekt nemohu řešit nijak zvlášť dlouho - mám KOS...)

Editováno
 
Nahoru Odpovědět
1.12.2012 16:40
Avatar
Kit
Tvůrce
Avatar
Odpovídá na matesax
Kit:1.12.2012 16:43

Zřejmě každých 180 ms překresluješ celý obrázek. To není dobrý nápad. Ani se mi to nespustilo.

Nahoru Odpovědět
1.12.2012 16:43
Vlastnosti objektů by neměly být veřejné. A to ani prostřednictvím getterů/setterů.
Avatar
matesax
Tvůrce
Avatar
Odpovídá na Kit
matesax:1.12.2012 16:44

Vykresluji jen hada a jídlo. (Pozadí je v CSS...) Jediné co mě napadá:

function drawFood() {

    graphics.save();

    gradient = graphics.createRadialGradient(tileSize / 2, tileSize / 2, 0, tileSize / 2, tileSize / 2, tileSize / 2);
    gradient.addColorStop(0, 'rgb(47,60,255)');
    gradient.addColorStop(0.8, 'rgb(27,20,225)');
    gradient.addColorStop(0.99, 'rgba(4, 4, 4, 0.8)');
    gradient.addColorStop(1, 'rgba(0, 0, 0, 0)');

    graphics.translate(foodPosition[0], foodPosition[1]);

    graphics.fillStyle = gradient;
    graphics.arc(tileSize / 2, tileSize / 2, tileSize / 2, 0, 2 * Math.PI);
    graphics.fill();

    graphics.restore();
}

To jídlo si uchovává poslední barevnou stopu a tu přenáší do všech svých pozic. (po snězení je přesunuto) Dočasně jsem tedy jako poslední stopu dal průhlednou barvu, ale hodlám se toho zbavit skutečně.

Editováno
 
Nahoru Odpovědět
1.12.2012 16:44
Avatar
Kit
Tvůrce
Avatar
Kit:1.12.2012 16:59

Jen tak pro zajímavost: Proč v JS nemáš české fonty, ale nějaký Times?

Koukám, že v každém cyklu překresluješ celý Canvas.

Nahoru Odpovědět
1.12.2012 16:59
Vlastnosti objektů by neměly být veřejné. A to ani prostřednictvím getterů/setterů.
Avatar
Drahomír Hanák
Tvůrce
Avatar
Odpovídá na matesax
Drahomír Hanák:1.12.2012 17:00

V HTML5 máš možnost requestAnimati­onFrame. Animace se spustí samostatně a není ovlivněna stránkou. Pokud uživatel zrovna není na dané stránce, animace se stopne. Pokud ale budeš chtít i nějaký fyzikální model hry, asi nevyhneš se kombinaci setTimeout a requestAnimati­onFrame.

Co se týče výkonu, vykreslovat základní objekty canvasu jako je obdélník, kruh, ale i cesta je velmi náročné na výkon. Musí se totiž při každém překreslení načíst znovu. Mnohem lepší je, udělat si obrázek, načíst si ho někam, odkud si ho můžeš při dalším vykreslení vzít, a vykreslovat jen ten načtený obrázek. Prohlížeč si totiž vytvoří cache. Zároveň je dobré co nejvíc slučovat (ideálně mít vše v jednom velkém spritu, pak stačí jedno načtení obrázku a vykreslení je relativně dost rychlé). To samé u zvuků (vytvářet sound sprity). Tak dosáhneš skvělého výkonu, i kdybys měl kreslit nějaké extra velké obrázky.

Pokud by ani to nestačilo, můžeš použít víc pláten. Při překreslení pak opravdu překreslíš jen věci, které potřebuješ a nemusíš zatěžovat prohlížeč s překreslením celé hry. Můžeš se trochu inspirovat u mě, ale vývoji se už nevěnuji a kód taky není nic extra https://github.com/…/scripts/dge

 
Nahoru Odpovědět
1.12.2012 17:00
Avatar
matesax
Tvůrce
Avatar
Odpovídá na Drahomír Hanák
matesax:1.12.2012 17:33

Tím pro mne jen lépe... (Předěláno.)

 
Nahoru Odpovědět
1.12.2012 17:33
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 10.