+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique (/showthread.php?tid=6429)
[PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Argorate - 05-10-2012
Suite au travaux effectués ici : http://www.jeuweb.org/showthread.php?tid=8690 et notamment le passage jour nuit, je voulais savoir comment feriez vous pour créer un système de changement de luminosité de manière dynamique?
C'est a dire que là Cawrotte à utilisé une image "en dur" pour faire la gestion de la lumière, sa marche très bien, le problème comme Sephi me la fait remarqué (en privé), cela ne marche plus le jour où on veux par exemple faire une lanterne qui éclaire dynamiquement autour du perso, peut importe sa position...
(solution canevas interdite, ce n'est pas cette méthode qui est utilisé pour le reste du projet)
Donc comment gérer la luminosité dynamiquement dans un jeu par navigateur en php/js/css?
merci.
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Ter Rowan - 05-10-2012
jamais essayé en css mais déjà vu en silverlight (pour une appli business, pas jeu, donc pas vraiment effet nuit)
je superposerais une image noire, avec une transparence variant de 100% (jour) à 0% (nuit complète)
Pour les sources lumineuses ... peut être en découpant l'écran en zones, chaque zone ayant une puissance lumineuse calculée en fonction de la présence dans la zone ou ses voisines d'une source de lumière. Et après on en revient à l'image noire transparente (mais n fois)
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Xenos - 05-10-2012
Ce genre de site devrait pouvoir t'aider:
http://photon.attasi.com/
Je n'ai aucune idée du principe de fonctionnement, à toi de découvrir.
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Maks - 05-10-2012
Je créerais deux calques, un pour la map, un pour la nuit. Chaque sera décomposé selon les tiles (normal pour la map) mais aussi pour la nuit. Ainsi tu peux agir sur les coordonnées d'un tile du calques de la nuit afin de le rendre plus lumineux qu'un autre.
Niveau performance ça sera surement moins bon car ça va t'obliger à fade plusieurs div au lieu d'une seule globale. Mais bon je suis déjà surpris du rendu obtenu par Cawrotte sans canvas alors pourquoi pas. Les animations CSS3 peuvent aider plutôt que jQuery qui sera surement trop lent.
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Angelblade - 05-10-2012
Pour un effet de nuit, comme ça a été suggéré, tu peux utiliser div avec background noir par dessus ta map.
En faisant varier l'opacité de ta div tu passe du jour (opacité:0) à la nuit (opacité: 0.7 par exemple).
Avec CSS3 ou en JavaScript (Fx de MooTools ou l'équivalent jQuery) tu fait une transition de 0 à 0.7.
Pour des effets de lumière c'est plus complexe et sans canvas je sais pas trop. Peut être avec un box-shadow jaune?
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Argorate - 05-10-2012
C'est approche sont très mauvaise, puisque vous raisonnez en programmeur et donc en case... autrement dit vous aurez des lumière carré, ce qui est anti-graphique au possible...
Si on regarde ce qu'a fait Cawrotte, ce sont bien des dégrader en forme de cercle qui ont des tailles variantes et qui ne sont pas lié au cases.
Donc ce qu'il faudrait c'est un moyen pour faire ça mais jolie !
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Roworll - 05-10-2012
Filtres SVG ?
RE: [PHP/JS/CSS] Gestion luminosité de la map de manière dynamique - Sephi-Chan - 05-10-2012
(05-10-2012, 08:54 PM)Argorate a écrit : C'est approche sont très mauvaise, puisque vous raisonnez en programmeur et donc en case... autrement dit vous aurez des lumière carré, ce qui est anti-graphique au possible...
Tu peux avoir des cases et superposer des calques qui présentent des arrondis, je ne vois pas le problème.
On parle seulement de ça parce qu'on considère ton jeu, qui utilise… des cases.
Mais tous les développeurs ne raisonnent pas en cases…
(05-10-2012, 08:54 PM)Argorate a écrit : Si on regarde ce qu'a fait Cawrotte, ce sont bien des dégrader en forme de cercle qui ont des tailles variantes et qui ne sont pas lié au cases.
Donc ce qu'il faudrait c'est un moyen pour faire ça mais jolie !
On pourrait utiliser des calques semi transparents, mais ça va produire des résultats très laids quand ils vont se superposer (un effet rosace).
Je pense que la technologie la plus adaptée pour ça, c'est vraiment Canvas.
Exemple avec un plugin pour Impact. Maisl à c'est déjà très avancé comme technique.