Ahojo
mám takový problém se kterým si nevím rady. Mám na stránce canvas.
<canvas id="springydemo" width="1200" height="1000" />
(ve Firefoxu vidím navíc 8px okraj).
Vykresluji tam ikony (ty se budou později zabalovat a rozbalovat podle toho na
kterou větev najedete). Potřeboval bych to udělat tak, že když změním velikost
okna, otevřu boční panel např. historii nebo vývojářské nástroje ve Firefoxu
a/nebo zazoomuju a přescroluju se abych získal správné souřadnice viditelné
oblasti. Jelikož to co je za hranicema oblasti na kterou se dívám je zbytečné
vykreslovat a ubírá to na výkonu, chci přidat podmínku, která přestane
vykreslovat to co je mimo obrazovku.
Adresa na zkoušku:
http://seznamka.moxo.cz/
Ve firefoxu jak otevřete konzolu vývojářských nástrojů tak se vám tam vypisuje
console.log toho co je mimo obrazovku.
Zkoušel jsem tento kód přidat do funkce na vykreslování ikon:
var left = document.body.scrollLeft || window.pageXOffset;
var top = document.body.scrollTop || window.pageYOffset;
var visibleArea = {
left: left,
right: screen.width + left,
top: top,
bottom: screen.height + top
}
if ( (s.x<visibleArea.left || s.x>visibleArea.right) &&
(s.y<visibleArea.top || s.y>visibleArea.bottom)
)
{
// console.log(node.data.label + " is off screen: " + s.x + "," +
s.y );
return false;
}
else
{
console.log(node.data.label + " is on screen: " + s.x + "," + s.y
);
}
No a je tam někde chyba protože to vypisuje i ty části které nejsou vidět nebo
naopak to přestane vykreslovat ikonu dříve ještě než zmizí ikona za horním
okrajem obrazovky.
Fotky které jsem udělal:
http://oi62.tinypic.com/qsa2qw.jpg
http://oi57.tinypic.com/2w6ykbl.jpg
s je objekt se souřadnicema, které se ale vztahují k tomu canvasu. Takže asi
bych ještě potřeboval odečíst margin u body. Ale to stále nestačí protože u
ikony Nudismus je právě ten problém, že na ose y zmizí asi o cca 50-80 px
dříve.
Když posunu obrazovku malinko dolů, tak Vegetariánství zmizí. Takže to není
úplně OK, protože zmizí předčasně.
Nudismus vpravo se mi neobjeví ve výpisu když stránku posunu až dolů a ikona
zmizí. Na druhou stranu začátek osy x se zdá být skoro vpořádku, protože když
posunu obrazovku trochu doleva, Nudismus se objeví ve výpisu. Ale když posunu
tuto ikonu až úplně nahoru a stránku posunu úplně dolů (posun trochu doleva) tak
se ikona nezobrazí ve výpisu. Tedy jako by byla stále vidět přitom je hodně
vysoko. Takže tam vidím hlavně problém s osou x. Nějaký nápad jak to opravit a
jak zjistit hodnotu okraje body?