Roo/bootstrap/Graph.js

diff --git a/Roo/bootstrap/Graph.js b/Roo/bootstrap/Graph.js
index a2c213c..fdf39e2 100644 (file)
--- a/Roo/bootstrap/Graph.js
+++ b/Roo/bootstrap/Graph.js
@@ -19,6 +19,10 @@
  @cfg {number} g_r radius (pie)
  @cfg {number} g_height height of the chart (respected by all elements in the set)
  @cfg {number} g_width width of the chart (respected by all elements in the set)
+ @cfg {String} title The title of this graph
+ @cfg {number} t_x postition x of title (default 150)
+ @cfg {number} t_y postition y of title (default 50)
+    
  -{Array}  values
  -opts (object) options for the chart 
      o {
@@ -66,12 +70,15 @@ Roo.extend(Roo.bootstrap.Graph, Roo.bootstrap.Component,  {
     g_x: 50,
     g_y: 50,
     g_r: 30,
+    t_x : 150,
+    t_y : 50,
     opts:{
         //g_colors: this.colors,
         g_type: 'soft',
         g_gutter: '20%'
 
     },
+    title : '',
 
     getAutoCreate : function(){
         
@@ -129,33 +136,38 @@ Roo.extend(Roo.bootstrap.Graph, Roo.bootstrap.Component,  {
         if(!opts){
             opts = this.opts;
         }
-        var chart_title = '',
-                    r = this.raphael,
-                    fin = function () {
-                        this.flag = r.popup(this.bar.x, this.bar.y, this.bar.value || "0").insertBefore(this);
-                    },
-                    fout = function () {
-                        this.flag.animate({opacity: 0}, 300, function () {this.remove();});
-                    };
+        var r = this.raphael,
+            fin = function () {
+                this.flag = r.popup(this.bar.x, this.bar.y, this.bar.value || "0").insertBefore(this);
+            },
+            fout = function () {
+                this.flag.animate({opacity: 0}, 300, function () {this.remove();});
+            };
 
         switch(graphtype){
             case 'bar':
                 this.raphael.barchart(this.g_x,this.g_y,this.g_width,this.g_height,xdata,opts).hover(fin,fout);
-                chart_title = 'This is Vertical Barchart';
+                this.title = this.title || 'This is Vertical Barchart';
                 break;
             case 'hbar':
                 this.raphael.hbarchart(this.g_x,this.g_y,this.g_width,this.g_height,xdata,opts).hover(fin,fout);
-                chart_title = 'This is Horizontal Barchart';
+                this.title = this.title || 'This is Horizontal Barchart';
                 break;
             case 'pie':
                 opts = { legend: ["%% - Enterprise Users", "% - ddd","Chrome Users"], legendpos: "west", 
                 href: ["http://raphaeljs.com", "http://g.raphaeljs.com"]};
-                    this.raphael.piechart(this.g_x,this.g_y,this.g_r,xdata,opts);
-                chart_title = 'This is Piechart';
+            
+                this.raphael.piechart(this.g_x,this.g_y,this.g_r,xdata,opts);
+                
+                this.title = this.title || 'This is Piechart';
                 break;
 
         }
-        this.raphael.text(150,50,chart_title).attr({ font: "20px 'Fontin Sans', Fontin-Sans, sans-serif" });
+        this.raphael.text(this.t_x, this.t_y, this.title).attr({ font: "20px 'Fontin Sans', Fontin-Sans, sans-serif" });
+    },
+    
+    setTitle: function(str) {
+        this.title = str;
     },
     
     initEvents: function() {