SVG

TwitterFacebook
Get flash to fully experience Pearltrees
SVGs are Scalable Vector Graphics. They are an increasing popular form of image, particular for use on the web. SVGs are called Vector graphics because they define graphics as a series of vectors, unlike raster graphics , which define graphics as a series of pixel colours. This means if an image contains a black line, rather than setting every pixel along that line to be black, a description of the line is stored. When you view an SVG, the program you're using to view it, for example your web browser, looks at the description and calculates the colour of each pixel.

SVG Tutorial | Peter's Website

http://www.petercollingridge.co.uk/svg-tutorial
Cette rubrique présente les techniques d’animation SVG de niveau intermédiaire et reprend là où la rubrique Animation SVG de base s’était arrêtée. Prévoyez de consacrer environ une heure pour comprendre parfaitement les concepts abordés dans cette rubrique. Remarque Pour afficher les exemples de la rubrique, vous devez utiliser un navigateur comme Windows Internet Explorer 9, qui prend en charge l’élément SVG . La rubrique Animation SVG de base traitait principalement de la rotation des objets. Nous allons aborder maintenant le mouvement de translation des objets dans l’espace, et sa conséquence la plus courante, la collision. http://msdn.microsoft.com/fr-fr/library/ie/gg193985(v=vs.85).aspx

Animation SVG de niveau intermédiaire (Windows)

En me baladant sur les réalisations de l'éminent Docteur Goulu , je suis tombé sur cette superbe montre de Pierre Kunz, nommée « Infinity Looping » (depuis renommée Insanity avec un changement de design qui ne lui réussit pas). Après avoir admiré le mécanisme extrêmement simple pour une montre de ce genre, j'avoue avoir été tenté par l'achat – mais bon, $20 000, voilà qui n'entre pas dans mon budget ! Tous mes remords de pauvre ont d'ailleurs disparu puisque la montre a été tirée en édition limitée, et n'est plus disponible. Le jour où je serai riche et célèbre, j'écumerai (enfin, je ferai écumer par une armée de secrétaires) le web à la recherche d'un ancien magnat du pétrole devenu pauvre qui revendra sa montre, que je rachèterai alors à quatre fois sa valeur pour le simple plaisir d'acquérir enfin ce joyau mécanique. http://blog.neamar.fr/accueil/15-as3/99-infinity-looping-pierre-kunz

Infinity Looping : reprogrammer une montre

http://blogs.msdn.com/b/davrous/archive/2011/05/20/introduction-aux-apis-graphiques-d-html5-svg-amp-canvas-2-4.aspx Nous allons voir ici les scénarios clés d’utilisation de canvas ou SVG après avoir vu les bases dans l’article précédent. Cet article fait donc parti de cette série : 1 – les bases de SVG et de Canvas 2 – les scénarios clés d’utilisation de ces 2 jeux d’APIs Le but du jeu étant de vous donner quelques éléments de réponse et des orientations d’usage pour vous aider à choisir le mode potentiellement le plus adapté à vos besoins. Tableau récapitulatif des grandes différences

Introduction aux APIs graphiques d’HTML5: SVG & Canvas (2/2) - David Rousset

Suite à l'annonce de la sortie officielle de Sozi sur le site LinuxFr.org, un utilisateur m'a fait part d'une demande de fonctionnalité : il s'agit de passer d'une vue à l'autre, non plus en ligne droite, mais en suivant un chemin. A priori, la tâche est difficile car il s'agit, à partir d'une liste de points définissant des segments de droites et des courbes, d'obtenir les coordonnées de n'importe quel point appartenant au chemin. En réalité, nous allons voir que l'API SVG fournit exactement les méthodes dont nous avons besoin. Un exemple Le document ci-dessous contient un chemin bleu et un cercle rouge centré sur l'une des extrémités du chemin.

Suivre un chemin dans un document SVG - (dés)assemblages de précision

http://senshu.baierouge.fr/blog/?post/2010/10/26/Suivre-un-chemin-dans-un-document-SVG
Un article de Wikipédia, l'encyclopédie libre. En théorie des graphes , l' algorithme de Dijkstra (prononcer [dɛjkstra]) sert à résoudre le problème du plus court chemin . Il permet, par exemple, de déterminer le plus court chemin pour se rendre d'une ville à une autre connaissant le réseau routier d'une région. Il s'applique à un graphe connexe dont le poids lié aux arêtes est un réel positif.

Algorithme de Dijkstra

http://fr.wikipedia.org/wiki/Algorithme_de_Dijkstra

Drawing Hilbert curves with SVG

By DesertDawg Hilbert curves are a type of space-filling curve that can be constructed with the SVG polyline element, using a basic design and then aggregating. I started by polylining one basic design into four sections of a graph, making the necessary adjustments to connect them up. http://dev.opera.com/articles/view/drawing-hilbert-curves-with-svg/
http://dev.opera.com/articles/view/how-to-do-photoshop-like-effects-in-svg/

How to do photoshop-like effects in SVG

By Erik Dahlström Introduction I came across this nice Photoshop tutorial the other day. Looking at this, and the other tutorials available there made me want to try to recreate the same effects, not using Photoshop however, just SVG. Read on for my take on the above tutorial.