src/chart/Highlight.js

   1 /*
   2
   3 This file is part of Ext JS 4
   4
   5 Copyright (c) 2011 Sencha Inc
   6
   7 Contact:  http://www.sencha.com/contact
   8
   9 GNU General Public License Usage
  10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file.  Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
  11
  12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
  13
  14 */
  15 /**
  16  * @class Ext.chart.Highlight
  17  * A mixin providing highlight functionality for Ext.chart.series.Series.
  18  */
  19 Ext.define('Ext.chart.Highlight', {
  20
  21     /* Begin Definitions */
  22
  23     requires: ['Ext.fx.Anim'],
  24
  25     /* End Definitions */
  26
  27     /**
  28      * Highlight the given series item.
  29      * @param {Boolean/Object} Default's false. Can also be an object width style properties (i.e fill, stroke, radius)
  30      * or just use default styles per series by setting highlight = true.
  31      */
  32     highlight: false,
  33
  34     highlightCfg : null,
  35
  36     constructor: function(config) {
  37         if (config.highlight) {
  38             if (config.highlight !== true) { //is an object
  39                 this.highlightCfg = Ext.apply({}, config.highlight);
  40             }
  41             else {
  42                 this.highlightCfg = {
  43                     fill: '#fdd',
  44                     radius: 20,
  45                     lineWidth: 5,
  46                     stroke: '#f55'
  47                 };
  48             }
  49         }
  50     },
  51
  52     /**
  53      * Highlight the given series item.
  54      * @param {Object} item Info about the item; same format as returned by #getItemForPoint.
  55      */
  56     highlightItem: function(item) {
  57         if (!item) {
  58             return;
  59         }
  60
  61         var me = this,
  62             sprite = item.sprite,
  63             opts = me.highlightCfg,
  64             surface = me.chart.surface,
  65             animate = me.chart.animate,
  66             p, from, to, pi;
  67
  68         if (!me.highlight || !sprite || sprite._highlighted) {
  69             return;
  70         }
  71         if (sprite._anim) {
  72             sprite._anim.paused = true;
  73         }
  74         sprite._highlighted = true;
  75         if (!sprite._defaults) {
  76             sprite._defaults = Ext.apply({}, sprite.attr);
  77             from = {};
  78             to = {};
  79             for (p in opts) {
  80                 if (! (p in sprite._defaults)) {
  81                     sprite._defaults[p] = surface.availableAttrs[p];
  82                 }
  83                 from[p] = sprite._defaults[p];
  84                 to[p] = opts[p];
  85                 if (Ext.isObject(opts[p])) {
  86                     from[p] = {};
  87                     to[p] = {};
  88                     Ext.apply(sprite._defaults[p], sprite.attr[p]);
  89                     Ext.apply(from[p], sprite._defaults[p]);
  90                     for (pi in sprite._defaults[p]) {
  91                         if (! (pi in opts[p])) {
  92                             to[p][pi] = from[p][pi];
  93                         } else {
  94                             to[p][pi] = opts[p][pi];
  95                         }
  96                     }
  97                     for (pi in opts[p]) {
  98                         if (! (pi in to[p])) {
  99                             to[p][pi] = opts[p][pi];
 100                         }
 101                     }
 102                 }
 103             }
 104             sprite._from = from;
 105             sprite._to = to;
 106             sprite._endStyle = to;
 107         }
 108         if (animate) {
 109             sprite._anim = Ext.create('Ext.fx.Anim', {
 110                 target: sprite,
 111                 from: sprite._from,
 112                 to: sprite._to,
 113                 duration: 150
 114             });
 115         } else {
 116             sprite.setAttributes(sprite._to, true);
 117         }
 118     },
 119
 120     /**
 121      * Un-highlight any existing highlights
 122      */
 123     unHighlightItem: function() {
 124         if (!this.highlight || !this.items) {
 125             return;
 126         }
 127
 128         var me = this,
 129             items = me.items,
 130             len = items.length,
 131             opts = me.highlightCfg,
 132             animate = me.chart.animate,
 133             i = 0,
 134             obj, p, sprite;
 135
 136         for (; i < len; i++) {
 137             if (!items[i]) {
 138                 continue;
 139             }
 140             sprite = items[i].sprite;
 141             if (sprite && sprite._highlighted) {
 142                 if (sprite._anim) {
 143                     sprite._anim.paused = true;
 144                 }
 145                 obj = {};
 146                 for (p in opts) {
 147                     if (Ext.isObject(sprite._defaults[p])) {
 148                         obj[p] = {};
 149                         Ext.apply(obj[p], sprite._defaults[p]);
 150                     }
 151                     else {
 152                         obj[p] = sprite._defaults[p];
 153                     }
 154                 }
 155                 if (animate) {
 156                     //sprite._to = obj;
 157                     sprite._endStyle = obj;
 158                     sprite._anim = Ext.create('Ext.fx.Anim', {
 159                         target: sprite,
 160                         to: obj,
 161                         duration: 150
 162                     });
 163                 }
 164                 else {
 165                     sprite.setAttributes(obj, true);
 166                 }
 167                 delete sprite._highlighted;
 168                 //delete sprite._defaults;
 169             }
 170         }
 171     },
 172
 173     cleanHighlights: function() {
 174         if (!this.highlight) {
 175             return;
 176         }
 177
 178         var group = this.group,
 179             markerGroup = this.markerGroup,
 180             i = 0,
 181             l;
 182         for (l = group.getCount(); i < l; i++) {
 183             delete group.getAt(i)._defaults;
 184         }
 185         if (markerGroup) {
 186             for (l = markerGroup.getCount(); i < l; i++) {
 187                 delete markerGroup.getAt(i)._defaults;
 188             }
 189         }
 190     }
 191 });