Plot 3D chart

13/08/2010

J’avais déjà parlé de Raycast en Javascript et l’idée a pris un peu ses formes. Notamment l’utiilsation de la 3D pour faire des graphs.

Voici donc une petite présentation de ce que je suis en train de faire, http://www.metal3d.org/canvasplot3D/ C’est encore au stade de l’ébauche et je n’ai pas encore trouvé certaines méthode pour afficher des labels ou les axes mais je vais cherché.

Bref, n’hésitez pas à twitter, à en parler… de l’aide serait la bienvenue.

Pour le moment ça ne fonctionne pas sur IE (pas encore testé avec Google Excanvas mais je pense le faire dans les jours qui viennent). Je ne sais pas non plus pour Opera…

Bon pour la forme, voici un exemple… Il suffit de créer un nouvel objet en javascript “M3DPlot” puis de lui assigner des données et des couleurs:

`

//une couleur avec alpha var plotcolor = { r: 33, g: 98, b: 55, a: 0.88 }; var plot = new M3DPlot(); plot.datas = [ {value: 10, color: plotcolor}, {value: 12, color: plotcolor}, {value: 7, color: plotcolor}, {value: 9, color: plotcolor}, {value: 5, color: plotcolor}, {value: 10, color: plotcolor}, {value: 12, color: plotcolor}, {value: 7, color: plotcolor}, {value: 9, color: plotcolor}, {value: 5, color: plotcolor} ]; //puis on assigne un canvas à l’objet window.onload = function () { plot.init(“mon_canvas”); } `

Ce qui doit donner:

Normalement ça doit être ok sur Google Chrome et Firefox… Voilà :)

Ça peut vous intéresser aussi


Raycaster en Javascript

À l’époque où les cartes graphiques n’existaient pas,...


Minifier simplement vos CSS et Javascript

M’amusant un peu avec mon serveur pour corriger quelques ...


La voie du libre

Je m’amusais à développer une petite librairie permettant de ...


Namespace Javascript

Javascript a souffert pendant très longtemps d’une image de ...

Merci de m'aider à financer mes services

Si vous avez apprécié cet article, je vous serai reconnaissant de m'aider à me payer une petite bière :)

Si vous voulez en savoir plus sur l'utilisation de flattr sur mon blog, lisez cette page: Ayez pitié de moi

Commentaires

Ajouter un commentaire

evos - 15/08/2010

Ca marche sur Opera 10.60 :)

Maintenant, au dela de l’aspect technique, est-ce que cela aide vraiment à la lecture ?

Metal3d - 03/09/2010

Pour le moment non… mais quand j’aurais ajouté les abscisses et ordonnées ça peut aider.

C’est surtout pour que ce soit joli, pas forcément “utile” en soit.

L’intérêt est surtout en terme de standard. On peut aisément parser une table HTML qui laisse donc les données “textuelles” sur la page, et JS transforme ça en graph pour ceux qui n’ont pas besoin de l’accessibilité activée.

Bref, non, c’est pas forcément un truc utile, mais fonctionnel… selon moi :)

Ajouter un commentaire

(*) Votre e-mail ne sera ni revendu, ni rendu public, ni utilisé pour vous proposer des mails commerciaux. Il n'est utilisé que pour vous contacter en cas de souci avec le contenu du commentaire, ou pour vous prévenir d'un nouveau commentaire si vous avez coché la case prévue à cet effet.