Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / Series.html
index b896d8c..693109e 100644 (file)
@@ -1,8 +1,25 @@
-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-chart.series.Series'>/**
+<!DOCTYPE html>
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>The source code</title>
+  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+  <style type="text/css">
+    .highlight { display: block; background-color: #ddd; }
+  </style>
+  <script type="text/javascript">
+    function highlight() {
+      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+    }
+  </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+  <pre class="prettyprint lang-js"><span id='Ext-chart-series-Series'>/**
 </span> * @class Ext.chart.series.Series
- * 
- * Series is the abstract class containing the common logic to all chart series. Series includes 
- * methods from Labels, Highlights, Tips and Callouts mixins. This class implements the logic of handling 
+ *
+ * Series is the abstract class containing the common logic to all chart series. Series includes
+ * methods from Labels, Highlights, Tips and Callouts mixins. This class implements the logic of handling
  * mouse events, animating, hiding, showing all elements and returning the color of the series to be used as a legend item.
  *
  * ## Listeners
@@ -27,7 +44,6 @@
  *             xField: 'category',
  *             yField: 'data1'
  *     }]
- *     
  */
 Ext.define('Ext.chart.series.Series', {
 
@@ -43,15 +59,15 @@ Ext.define('Ext.chart.series.Series', {
 
     /* End Definitions */
 
-<span id='Ext-chart.series.Series-cfg-highlight'>    /**
-</span>     * @cfg {Boolean|Object} highlight
+<span id='Ext-chart-series-Series-cfg-highlight'>    /**
+</span>     * @cfg {Boolean/Object} highlight
      * If set to `true` it will highlight the markers or the series when hovering
      * with the mouse. This parameter can also be an object with the same style
      * properties you would apply to a {@link Ext.draw.Sprite} to apply custom
      * styles to markers and series.
      */
 
-<span id='Ext-chart.series.Series-cfg-tips'>    /**
+<span id='Ext-chart-series-Series-cfg-tips'>    /**
 </span>     * @cfg {Object} tips
      * Add tooltips to the visualization's markers. The options for the tips are the
      * same configuration used with {@link Ext.tip.ToolTip}. For example:
@@ -66,25 +82,25 @@ Ext.define('Ext.chart.series.Series', {
      *     },
      */
 
-<span id='Ext-chart.series.Series-cfg-type'>    /**
+<span id='Ext-chart-series-Series-cfg-type'>    /**
 </span>     * @cfg {String} type
      * The type of series. Set in subclasses.
      */
     type: null,
 
-<span id='Ext-chart.series.Series-cfg-title'>    /**
+<span id='Ext-chart-series-Series-cfg-title'>    /**
 </span>     * @cfg {String} title
      * The human-readable name of the series.
      */
     title: null,
 
-<span id='Ext-chart.series.Series-cfg-showInLegend'>    /**
+<span id='Ext-chart-series-Series-cfg-showInLegend'>    /**
 </span>     * @cfg {Boolean} showInLegend
      * Whether to show this series in the legend.
      */
     showInLegend: true,
 
-<span id='Ext-chart.series.Series-cfg-renderer'>    /**
+<span id='Ext-chart-series-Series-cfg-renderer'>    /**
 </span>     * @cfg {Function} renderer
      * A function that can be overridden to set custom styling properties to each rendered element.
      * Passes in (sprite, record, attributes, index, store) to the function.
@@ -93,35 +109,33 @@ Ext.define('Ext.chart.series.Series', {
         return attributes;
     },
 
-<span id='Ext-chart.series.Series-cfg-shadowAttributes'>    /**
+<span id='Ext-chart-series-Series-cfg-shadowAttributes'>    /**
 </span>     * @cfg {Array} shadowAttributes
      * An array with shadow attributes
      */
     shadowAttributes: null,
-    
+
     //@private triggerdrawlistener flag
     triggerAfterDraw: false,
 
-<span id='Ext-chart.series.Series-cfg-listeners'>    /**
-</span>     * @cfg {Object} listeners  
+<span id='Ext-chart-series-Series-cfg-listeners'>    /**
+</span>     * @cfg {Object} listeners
      * An (optional) object with event callbacks. All event callbacks get the target *item* as first parameter. The callback functions are:
-     *  
-     *  &lt;ul&gt;
-     *      &lt;li&gt;itemmouseover&lt;/li&gt;
-     *      &lt;li&gt;itemmouseout&lt;/li&gt;
-     *      &lt;li&gt;itemmousedown&lt;/li&gt;
-     *      &lt;li&gt;itemmouseup&lt;/li&gt;
-     *  &lt;/ul&gt;
+     *
+     *  - itemmouseover
+     *  - itemmouseout
+     *  - itemmousedown
+     *  - itemmouseup
      */
-    
+
     constructor: function(config) {
         var me = this;
         if (config) {
             Ext.apply(me, config);
         }
-        
+
         me.shadowGroups = [];
-        
+
         me.mixins.labels.constructor.call(me, config);
         me.mixins.highlights.constructor.call(me, config);
         me.mixins.tips.constructor.call(me, config);
@@ -136,7 +150,7 @@ Ext.define('Ext.chart.series.Series', {
             mouseleave: true,
             afterdraw: true,
 
-<span id='Ext-chart.series.Series-event-titlechange'>            /**
+<span id='Ext-chart-series-Series-event-titlechange'>            /**
 </span>             * @event titlechange
              * Fires when the series title is changed via {@link #setTitle}.
              * @param {String} title The new title value
@@ -154,6 +168,37 @@ Ext.define('Ext.chart.series.Series', {
             mouseleave: me.onMouseLeave
         });
     },
+    
+<span id='Ext-chart-series-Series-method-eachRecord'>    /**
+</span>     * Iterate over each of the records for this series. The default implementation simply iterates
+     * through the entire data store, but individual series implementations can override this to
+     * provide custom handling, e.g. adding/removing records.
+     * @param {Function} fn The function to execute for each record.
+     * @param {Object} scope Scope for the fn.
+     */
+    eachRecord: function(fn, scope) {
+        var chart = this.chart;
+        (chart.substore || chart.store).each(fn, scope);
+    },
+
+<span id='Ext-chart-series-Series-method-getRecordCount'>    /**
+</span>     * Return the number of records being displayed in this series. Defaults to the number of
+     * records in the store; individual series implementations can override to provide custom handling.
+     */
+    getRecordCount: function() {
+        var chart = this.chart,
+            store = chart.substore || chart.store;
+        return store ? store.getCount() : 0;
+    },
+
+<span id='Ext-chart-series-Series-method-isExcluded'>    /**
+</span>     * Determines whether the series item at the given index has been excluded, i.e. toggled off in the legend.
+     * @param index
+     */
+    isExcluded: function(index) {
+        var excludes = this.__excludes;
+        return !!(excludes &amp;&amp; excludes[index]);
+    },
 
     // @private set the bbox and clipBox for the series
     setBBox: function(noGutter) {
@@ -194,19 +239,19 @@ Ext.define('Ext.chart.series.Series', {
                     'afteranimate': function() {
                         me.triggerAfterDraw = false;
                         me.fireEvent('afterrender');
-                    }    
-                }    
+                    }
+                }
             }));
         }
     },
-    
+
     // @private return the gutter.
     getGutters: function() {
         return [0, 0];
     },
 
     // @private wrapper for the itemmouseover event.
-    onItemMouseOver: function(item) { 
+    onItemMouseOver: function(item) {
         var me = this;
         if (item.series === me) {
             if (me.highlight) {
@@ -238,20 +283,18 @@ Ext.define('Ext.chart.series.Series', {
         }
     },
 
-<span id='Ext-chart.series.Series-method-getItemForPoint'>    /**
+<span id='Ext-chart-series-Series-method-getItemForPoint'>    /**
 </span>     * For a given x/y point relative to the Surface, find a corresponding item from this
      * series, if any.
      * @param {Number} x
      * @param {Number} y
-     * @return {Object} An object describing the item, or null if there is no matching item. The exact contents of
-     *                  this object will vary by series type, but should always contain at least the following:
-     *                  &lt;ul&gt;
-     *                    &lt;li&gt;{Ext.chart.series.Series} series - the Series object to which the item belongs&lt;/li&gt;
-     *                    &lt;li&gt;{Object} value - the value(s) of the item's data point&lt;/li&gt;
-     *                    &lt;li&gt;{Array} point - the x/y coordinates relative to the chart box of a single point
-     *                        for this data item, which can be used as e.g. a tooltip anchor point.&lt;/li&gt;
-     *                    &lt;li&gt;{Ext.draw.Sprite} sprite - the item's rendering Sprite.
-     *                  &lt;/ul&gt;
+     * @return {Object} An object describing the item, or null if there is no matching item.
+     * The exact contents of this object will vary by series type, but should always contain the following:
+     * @return {Ext.chart.series.Series} return.series the Series object to which the item belongs
+     * @return {Object} return.value the value(s) of the item's data point
+     * @return {Array} return.point the x/y coordinates relative to the chart box of a single point
+     * for this data item, which can be used as e.g. a tooltip anchor point.
+     * @return {Ext.draw.Sprite} return.sprite the item's rendering Sprite.
      */
     getItemForPoint: function(x, y) {
         //if there are no items to query just return null.
@@ -271,21 +314,21 @@ Ext.define('Ext.chart.series.Series', {
                 return items[i];
             }
         }
-        
+
         return null;
     },
-    
+
     isItemInPoint: function(x, y, item, i) {
         return false;
     },
 
-<span id='Ext-chart.series.Series-method-hideAll'>    /**
+<span id='Ext-chart-series-Series-method-hideAll'>    /**
 </span>     * Hides all the elements in the series.
      */
     hideAll: function() {
         var me = this,
             items = me.items,
-            item, len, i, sprite;
+            item, len, i, j, l, sprite, shadows;
 
         me.seriesIsHidden = true;
         me._prevShowMarkers = me.showMarkers;
@@ -302,10 +345,19 @@ Ext.define('Ext.chart.series.Series', {
                     hidden: true
                 }, true);
             }
+
+            if (sprite &amp;&amp; sprite.shadows) {
+                shadows = sprite.shadows;
+                for (j = 0, l = shadows.length; j &lt; l; ++j) {
+                    shadows[j].setAttributes({
+                        hidden: true
+                    }, true);
+                }
+            }
         }
     },
 
-<span id='Ext-chart.series.Series-method-showAll'>    /**
+<span id='Ext-chart-series-Series-method-showAll'>    /**
 </span>     * Shows all the elements in the series.
      */
     showAll: function() {
@@ -317,9 +369,9 @@ Ext.define('Ext.chart.series.Series', {
         me.drawSeries();
         me.chart.animate = prevAnimate;
     },
-    
-<span id='Ext-chart.series.Series-method-getLegendColor'>    /**
-</span>     * Returns a string with the color to be used for the series legend item. 
+
+<span id='Ext-chart-series-Series-method-getLegendColor'>    /**
+</span>     * Returns a string with the color to be used for the series legend item.
      */
     getLegendColor: function(index) {
         var me = this, fill, stroke;
@@ -333,8 +385,8 @@ Ext.define('Ext.chart.series.Series', {
         }
         return '#000';
     },
-    
-<span id='Ext-chart.series.Series-method-visibleInLegend'>    /**
+
+<span id='Ext-chart-series-Series-method-visibleInLegend'>    /**
 </span>     * Checks whether the data field should be visible in the legend
      * @private
      * @param {Number} index The index of the current item
@@ -347,7 +399,7 @@ Ext.define('Ext.chart.series.Series', {
         return !this.seriesIsHidden;
     },
 
-<span id='Ext-chart.series.Series-method-setTitle'>    /**
+<span id='Ext-chart-series-Series-method-setTitle'>    /**
 </span>     * Changes the value of the {@link #title} for the series.
      * Arguments can take two forms:
      * &lt;ul&gt;
@@ -376,4 +428,6 @@ Ext.define('Ext.chart.series.Series', {
         me.fireEvent('titlechange', title, index);
     }
 });
-</pre></pre></body></html>
\ No newline at end of file
+</pre>
+</body>
+</html>