--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/toolkit/exemples/treemap/script.js Thu Apr 10 14:20:23 2014 +0200
@@ -0,0 +1,68 @@
+
+// On cr�e l'objet relations qui va nous permettre d'ajouter des animations et des effets sur les cases de treemap
+var r = new Relations();
+
+var couleurs = new Couleurs(20);
+
+//*
+var parametresStreamgraphTimeline = {
+ name: "streamgraphTimeline",
+ selector: "#streamgraphTimeline",
+ activerSelection : true,
+ activerTimeline: true,
+ activerCurseur: true,
+ hauteur: 50,
+ largeur: 800,
+ relations: r,
+ couleurs: couleurs
+};
+
+var streamgraphTimeline = new Streamgraph(json.clusters, parametresStreamgraphTimeline);
+//*/
+
+//*
+var parametresTreemap = {
+ name: "treemap",
+ selector: "#treemap",
+ hauteur: 400,
+ largeur: 800,
+ relations: r,
+ template: {
+ selector: "#streamgraphTemplate",
+ directives: {
+ "img@src": "urlImage",
+ "img@title": "titreArticle",
+ "img@alt": "titreArticle",
+ "img@width": "widthImage",
+ "img@height": "heightImage",
+ "img@style+": "cssOffsetImage",
+ "p.title": "titreArticle",
+ "p.title@style+": "cssWidthArticle"
+ }
+ },
+ couleurs: couleurs
+};
+var treemap = new Treemap(json, parametresTreemap);
+//*/
+
+//*
+r.get("streamgraphTimeline").bind("selectionResize", "treemap",
+ function(objet, params) { objet.transition(params[0], params[1]); });
+
+function placerCurseur(cluster) {
+ streamgraphTimeline.placerCurseur(parseInt(cluster.attr("datetime")), 'index');
+ streamgraphTimeline.showCursor();
+}
+
+function cacherCurseur() {
+ streamgraphTimeline.hideCursor();
+}
+
+for (var i = 0; i<10; ++i) {
+ var cluster = r.get("treemap.cluster." + i);
+ cluster.mouseover(treemap.focus)
+ .mouseout(treemap.blur)
+ .mouseover(placerCurseur)
+ .mouseout(cacherCurseur);
+}
+//*/
\ No newline at end of file