Utilisations pour toile | Exemples pratiques

Question

J'essaie de comprendre ce que les gens utilisent la toile?

Je le vois sur les offres d'emploi que j'ai lu à ce sujet dans JavaScript définitif, mais je ne comprends pas très bien à quoi il sert.

Je comprends que vous pouvez dessiner des objets 2d ou 3d (généralement 2d) mais pourquoi ne pas simplement utiliser Gimp ou Photoshop et télécharger l'image.

Est-il possible de créer des images dynamiques basées sur des données spécifiques à l'utilisateur, par exemple?

Qu'est-ce qu'un exemple pratique ou peut-être un lien vers une mise en œuvre professionnelle de la toile (Définir des éléments de base JavaScript comme des cercles de dessin).

MDN Tutorial

Answer 1

J'ai utilisé une toile pour dessiner un graphique, et il retombe à demander une image générée par PHP, si le navigateur ne supporte pas <canvas>. C'est toujours une bonne idée de déléguer le traitement du serveur au client, car cela place moins de charge sur le serveur. En d'autres termes, au lieu d'utiliser le serveur "voici les choses", c'est plutôt "voici les données et les instructions pour le montrer".

Une autre utilisation que j'ai vue est de mettre en évidence les zones d'une imagemap lorsqu'elle est survolée.

<canvas> est un élément central du développement de jeux HTML5, puisqu'il est utilisé pour dessiner l'ensemble de la fenêtre de jeu. Sans cela, il n'y a pas de jeu.

Answer 2

est-il si vous pouvez créer des images dynamiques basées sur des données dites ... spécifiques à l'utilisateur?

Oui

Answer 3

Nous avons utilisé < canvas> pour construire éditeur de design interactif pour les vêtements dans notre boutique e-commerce - http://printio.ru/tees/new

Le genre d'interactivité que nous offrons est seulement possible avec Flash jusqu'à récemment.

Même sur l'arrière-plan, nous utilisons Node.js et < canvas> traitement d'image basé sur toile> pour prendre des données à partir de l'éditeur en ligne et créer des conceptions qui sont utilisées dans store. Ces conceptions générées par toile sont finalement imprimées sur des T-shirts, des tasses, des casquettes, des sacs, et ainsi de suite.

Je pense que c'est un exemple assez pratique :)

Cela se fait par l'intermédiaire Fabric.js canvas library (développé par nous aussi).

Answer 4

<canvas> est utilisé pour de meilleures performances. <canvas> est beaucoup plus rapide et dynamique que jpeg ou toute autre chose. Exemple: http://www.profistart.com/internetseiten.html ici était <canvas> utilisé pour l'arrière-plan.