projects / roojs1 / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Fix #5654 - roojspacker - get it working as a doc tool...
[roojs1] / docs.old / symbols / src / Roo_bootstrap_Graph.js.html
diff --git a/docs.old/symbols/src/Roo_bootstrap_Graph.js.html b/docs.old/symbols/src/Roo_bootstrap_Graph.js.html
new file mode 100644 (file)
index 0000000..9a5f1c0
--- /dev/null
+++ b/docs.old/symbols/src/Roo_bootstrap_Graph.js.html
@@ -0,0 +1,214 @@
+<html><head><title>../roojs1/Roo/bootstrap/Graph.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">    <span class="jsdoc-comment">/*
+ * - LGPL
+ *
+ * Graph
+ * 
+ */
+
+
+/**
+ * @class Roo.bootstrap.Graph
+ * @extends Roo.bootstrap.Component
+ * Bootstrap Graph class
+&gt; Prameters
+ -sm {number} sm 4
+ -md {number} md 5
+ @cfg {String} graphtype  bar | vbar | pie
+ @cfg {number} g_x coodinator | centre x (pie)
+ @cfg {number} g_y coodinator | centre y (pie)
+ @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 {Object} title The title of the chart
+    
+ -{Array}  values
+ -opts (object) options for the chart 
+     o {
+     o type (string) type of endings of the bar. Default: 'square'. Other options are: 'round', 'sharp', 'soft'.
+     o gutter (number)(string) default '20%' (WHAT DOES IT DO?)
+     o vgutter (number)
+     o colors (array) colors be used repeatedly to plot the bars. If multicolumn bar is used each sequence of bars with use a different color.
+     o stacked (boolean) whether or not to tread values as in a stacked bar chart
+     o to
+     o stretch (boolean)
+     o }
+ -opts (object) options for the pie
+     o{
+     o cut
+     o startAngle (number)
+     o endAngle (number)
+     } 
+ *
+ * @constructor
+ * Create a new Input
+ * @param {Object} config The config object
+ */
+
+</span><span class="jsdoc-var">Roo.bootstrap.Graph </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
+    </span><span class="jsdoc-var">Roo.bootstrap.Graph.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
+    
+    </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
+        </span><span class="jsdoc-comment">// img events
+        /**
+         * @event click
+         * The img click event for the img.
+         * @param {Roo.EventObject} e
+         */
+        </span><span class="jsdoc-string">&quot;click&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
+    </span><span class="jsdoc-syntax">});
+};
+
+</span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Graph</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
+    
+    </span><span class="jsdoc-var">sm</span><span class="jsdoc-syntax">: 4,
+    </span><span class="jsdoc-var">md</span><span class="jsdoc-syntax">: 5,
+    </span><span class="jsdoc-var">graphtype</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'bar'</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-var">g_height</span><span class="jsdoc-syntax">: 250,
+    </span><span class="jsdoc-var">g_width</span><span class="jsdoc-syntax">: 400,
+    </span><span class="jsdoc-var">g_x</span><span class="jsdoc-syntax">: 50,
+    </span><span class="jsdoc-var">g_y</span><span class="jsdoc-syntax">: 50,
+    </span><span class="jsdoc-var">g_r</span><span class="jsdoc-syntax">: 30,
+    </span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">:{
+        </span><span class="jsdoc-comment">//g_colors: this.colors,
+        </span><span class="jsdoc-var">g_type</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'soft'</span><span class="jsdoc-syntax">,
+        </span><span class="jsdoc-var">g_gutter</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'20%'
+
+    </span><span class="jsdoc-syntax">},
+    </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
+
+    </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
+            </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null
+        </span><span class="jsdoc-syntax">};
+        
+        
+        </span><span class="jsdoc-keyword">return  </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">){
+        
+        
+        </span><span class="jsdoc-var">Roo.bootstrap.Graph.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Raphael</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-var">Roo.bootstrap.MessageBox.alert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;Error&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;Raphael is not availabe&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+        }
+        
+        </span><span class="jsdoc-var">this.raphael </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Raphael</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">);
+        
+                    </span><span class="jsdoc-comment">// data1 = [[55, 20, 13, 32, 5, 1, 2, 10], [10, 2, 1, 5, 32, 13, 20, 55], [12, 20, 30]],
+                    // data2 = [[55, 20, 13, 32, 5, 1, 2, 10], [10, 2, 1, 5, 32, 13, 20, 55], [12, 20, 30]],
+                    // data3 = [[55, 20, 13, 32, 5, 1, 2, 10], [10, 2, 1, 5, 32, 13, 20, 55], [12, 20, 30]],
+                    // txtattr = { font: &quot;12px 'Fontin Sans', Fontin-Sans, sans-serif&quot; };
+                /*
+                r.text(160, 10, &quot;Single Series Chart&quot;).attr(txtattr);
+                r.text(480, 10, &quot;Multiline Series Chart&quot;).attr(txtattr);
+                r.text(160, 250, &quot;Multiple Series Stacked Chart&quot;).attr(txtattr);
+                r.text(480, 250, 'Multiline Series Stacked Vertical Chart. Type &quot;round&quot;').attr(txtattr);
+                
+                r.barchart(10, 10, 300, 220, [[55, 20, 13, 32, 5, 1, 2, 10]], 0, {type: &quot;sharp&quot;});
+                r.barchart(330, 10, 300, 220, data1);
+                r.barchart(10, 250, 300, 220, data2, {stacked: true});
+                r.barchart(330, 250, 300, 220, data3, {stacked: true, type: &quot;round&quot;});
+                */
+                
+                // var xdata = [55, 20, 13, 32, 5, 1, 2, 10,5 , 10];
+                // r.barchart(30, 30, 560, 250,  xdata, {
+                //    labels : [55, 20, 13, 32, 5, 1, 2, 10,5 , 10],
+                //     axis : &quot;0 0 1 1&quot;,
+                //     axisxlabels :  xdata
+                //     //yvalues : cols,
+                   
+                // });
+//        var xdata = [55, 20, 13, 32, 5, 1, 2, 10,5 , 10];
+//        
+//        this.load(null,xdata,{
+//                axis : &quot;0 0 1 1&quot;,
+//                axisxlabels :  xdata
+//                });
+
+    </span><span class="jsdoc-syntax">},
+
+    </span><span class="jsdoc-var">load </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">graphtype</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">xdata</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-var">this.raphael.clear</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">graphtype</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-var">graphtype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.graphtype</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">opts </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.opts</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.raphael</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">fin </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
+                </span><span class="jsdoc-var">this.flag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r.popup</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bar.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.bar.y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.bar.value </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">&quot;0&quot;</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+            },
+            </span><span class="jsdoc-var">fout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {
+                </span><span class="jsdoc-var">this.flag.animate</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">: 0}, 300, </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">() {</span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">();});
+            },
+            </span><span class="jsdoc-var">pfin </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
+                </span><span class="jsdoc-var">this.sector.stop</span><span class="jsdoc-syntax">();
+                </span><span class="jsdoc-var">this.sector.scale</span><span class="jsdoc-syntax">(1.1, 1.1, </span><span class="jsdoc-var">this.cx</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cy</span><span class="jsdoc-syntax">);
+
+                </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">) {
+                    </span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.stop</span><span class="jsdoc-syntax">();
+                    </span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">: 7.5 });
+                    </span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-string">&quot;font-weight&quot;</span><span class="jsdoc-syntax">: 800 });
+                }
+            },
+            </span><span class="jsdoc-var">pfout </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
+                </span><span class="jsdoc-var">this.sector.animate</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">transform</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'s1 1 ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.cx </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.cy </span><span class="jsdoc-syntax">}, 500, </span><span class="jsdoc-string">&quot;bounce&quot;</span><span class="jsdoc-syntax">);
+
+                </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">) {
+                    </span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.animate</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">: 5 }, 500, </span><span class="jsdoc-string">&quot;bounce&quot;</span><span class="jsdoc-syntax">);
+                    </span><span class="jsdoc-var">this.label</span><span class="jsdoc-syntax">[1]</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-string">&quot;font-weight&quot;</span><span class="jsdoc-syntax">: 400 });
+                }
+            };
+
+        </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">graphtype</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'bar'</span><span class="jsdoc-syntax">:
+                </span><span class="jsdoc-var">this.raphael.barchart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.g_x</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_y</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_width</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_height</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">xdata</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hover</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fin</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">fout</span><span class="jsdoc-syntax">);
+                </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'hbar'</span><span class="jsdoc-syntax">:
+                </span><span class="jsdoc-var">this.raphael.hbarchart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.g_x</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_y</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_width</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_height</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">xdata</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hover</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fin</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">fout</span><span class="jsdoc-syntax">);
+                </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'pie'</span><span class="jsdoc-syntax">:
+</span><span class="jsdoc-comment">//                opts = { legend: [&quot;%% - Enterprise Users&quot;, &quot;% - ddd&quot;,&quot;Chrome Users&quot;], legendpos: &quot;west&quot;, 
+//                href: [&quot;http://raphaeljs.com&quot;, &quot;http://g.raphaeljs.com&quot;]};
+//            
+                </span><span class="jsdoc-var">this.raphael.piechart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.g_x</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_y</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">this.g_r</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">xdata</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">opts</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hover</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pfin</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pfout</span><span class="jsdoc-syntax">);
+                
+                </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
+
+        }
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.title</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.raphael.text</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.title.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.title.y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.title.text</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.title.attr</span><span class="jsdoc-syntax">);
+        }
+        
+    },
+    
+    </span><span class="jsdoc-var">setTitle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-var">this.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">;
+    },
+    
+    </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.href</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        }
+    },
+    
+    </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'img onclick'</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
+    }
+   
+});
+
+ 
+</span></code></body></html>
\ No newline at end of file
RooJS - Version 1