Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / docs / api / Ext.chart.series.Scatter.html
1 <!DOCTYPE html><html><head><title>Ext.chart.series.Scatter | Ext JS 4.0 Documentation</title><script type="text/javascript" src="../ext-all.js"></script><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../scrollbars.css" type="text/css"><link rel="stylesheet" href="../docs.css" type="text/css"><link id="styleCss" rel="stylesheet" href="../style.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script><link rel="stylesheet" href="../prettify.css" type="text/css"><!-- link(rel: 'stylesheet', href: req.baseURL + '/css/ext4.css', type: 'text/css')--><link rel="shortcut icon" type="image/ico" href="../favicon.ico"><!--[if IE]>
2 <style type="text/css">.head-band { display: none; }
3 .header { border: 0; top: 0; left: 0px; background: url(../header.gif) repeat-x; }
4 .doc-tab .members .member a.more { background-color: #efefef; }
5 </style><link rel="stylesheet" href="/new/css/ie.css" type="text/css"><![endif]-->
6 </head><body id="ext-body" class="iScroll"><div id="notice" class="notice">For up to date documentation and features, visit 
7 <a href="http://docs.sencha.com/ext-js/4-0">http://docs.sencha.com/ext-js/4-0</a></div><div class="wrapper"><div class="head-band"></div><div class="header"><h2><a href="../index.html">Sencha Documentation</a></h2></div><div id="search"><form><input type="text" placeholder="Search" id="search-field" autocomplete="off" name="q"></form><div id="search-box"></div></div><div id="treePanel"></div><div id="container"><script type="text/javascript">
8
9     req = {
10         liveURL: '.',
11         standAloneMode: true,
12         origDocClass: 'Ext.chart.series.Scatter',
13         docClass: 'Ext.chart.series.Scatter',
14         docReq: 'Ext.chart.series.Scatter',
15         version: '4.0',
16         baseURL: '.',
17         baseDocURL: '.',
18         baseProdURL: '.'
19     };
20
21     clsInfo = {};
22
23
24
25 </script>
26
27 <script type="text/javascript" src="../search.js"></script>
28 <!--script type="text/javascript" src="/new/javascripts/app/examples.js"></script-->
29 <script type="text/javascript" src="../class_tree.js"></script>
30 <script type="text/javascript" src="../class_doc.js"></script>
31 <script type="text/javascript">
32     req.source = 'Scatter.html#Ext-chart.series.Scatter';
33     clsInfo = {"methods":["Scatter","addEvents","addListener","addManagedListener","capture","clearListeners","clearManagedListeners","drawSeries","enableBubble","fireEvent","getItemForPoint","getLegendColor","hasListener","hideAll","highlightItem","observe","on","relayEvents","releaseCapture","removeListener","removeManagedListener","resumeEvents","setTitle","showAll","suspendEvents","un","unHighlightItem"],"cfgs":["color","display","field","font","highlight","listeners","markerConfig","minMargin","orientation","renderer","shadowAttributes","showInLegend","style","tips","title","type"],"properties":["axis","highlight","xField","yField"],"events":["titlechange"],"subclasses":[]};
34     Ext.onReady(function() {
35         Ext.create('Docs.classPanel');
36     });
37 </script><div id="top-block" class="top-block"><h1 id="clsTitle" class="cls"><a href="../source/Scatter.html#Ext-chart.series.Scatter" target="_blank">Ext.chart.series.Scatter</a><span>xtype: scatter</span></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><pre class="subclasses"><h4>Hierarchy</h4><div class="subclass f"><a href="Ext.chart.series.Series.html" rel="Ext.chart.series.Series" class="cls docClass">Ext.chart.series.Series</a><div class="subclass"><a href="Ext.chart.series.Cartesian.html" rel="Ext.chart.series.Cartesian" class="cls docClass">Ext.chart.series.Cartesian</a><div class="subclass"><strong>Ext.chart.series.Scatter</strong></div></div></div><h4>Mixins</h4><div class="mixin"><a href="Ext.util.Observable.html" rel="Ext.util.Observable" class="cls docClass">Ext.util.Observable</a></div><div class="mixin"><a href="Ext.chart.Label.html" rel="Ext.chart.Label" class="cls docClass">Ext.chart.Label</a></div><div class="mixin"><a href="Ext.chart.Highlight.html" rel="Ext.chart.Highlight" class="cls docClass">Ext.chart.Highlight</a></div><div class="mixin"><a href="Ext.chart.Tip.html" rel="Ext.chart.Tip" class="cls docClass">Ext.chart.Tip</a></div><div class="mixin"><a href="Ext.chart.Callout.html" rel="Ext.chart.Callout" class="cls docClass">Ext.chart.Callout</a></div></pre><p>Creates a Scatter Chart. The scatter plot is useful when trying to display more than two variables in the same visualization.
38 These variables can be mapped into x, y coordinates and also to an element's radius/size, color, etc.
39 As with all other series, the Scatter Series must be appended in the <em>series</em> Chart array configuration. See the Chart
40 documentation for more information on creating charts. A typical configuration object for the scatter could be:</p>
41
42 <p><img class="screenshot" src="../Ext.chart.series.Scatter.png" alt="Ext.chart.series.Scatter chart series" /></p>
43
44 <pre class="prettyprint"><code>var store = Ext.create('Ext.data.JsonStore', {
45     fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
46     data: [
47         {'name':'metric one', 'data1':10, 'data2':12, 'data3':14, 'data4':8, 'data5':13},
48         {'name':'metric two', 'data1':7, 'data2':8, 'data3':16, 'data4':10, 'data5':3},
49         {'name':'metric three', 'data1':5, 'data2':2, 'data3':14, 'data4':12, 'data5':7},
50         {'name':'metric four', 'data1':2, 'data2':14, 'data3':6, 'data4':1, 'data5':23},
51         {'name':'metric five', 'data1':27, 'data2':38, 'data3':36, 'data4':13, 'data5':33}                                                
52     ]
53 });
54
55 Ext.create('Ext.chart.Chart', {
56     renderTo: Ext.getBody(),
57     width: 500,
58     height: 300,
59     animate: true,
60     theme:'Category2',
61     store: store,
62     axes: [{
63         type: 'Numeric',
64         position: 'bottom',
65         fields: ['data1', 'data2', 'data3'],
66         title: 'Sample Values',
67         grid: true,
68         minimum: 0
69     }, {
70         type: 'Category',
71         position: 'left',
72         fields: ['name'],
73         title: 'Sample Metrics'
74     }],
75     series: [{
76         type: 'scatter',
77         markerConfig: {
78             radius: 5,
79             size: 5
80         },
81         axis: 'left',
82         xField: 'name',
83         yField: 'data2'
84     }, {
85         type: 'scatter',
86         markerConfig: {
87             radius: 5,
88             size: 5
89         },
90         axis: 'left',
91         xField: 'name',
92         yField: 'data3'
93     }]   
94 });
95 </code></pre>
96
97 <p>In this configuration we add three different categories of scatter series. Each of them is bound to a different field of the same data store,
98 <code>data1</code>, <code>data2</code> and <code>data3</code> respectively. All x-fields for the series must be the same field, in this case <code>name</code>.
99 Each scatter series has a different styling configuration for markers, specified by the <code>markerConfig</code> object. Finally we set the left axis as
100 axis to show the current values of the elements.</p>
101 <div class="members"><div class="m-cfgs"><div class="definedBy">Defined By</div><a name="configs"></a><h3 class="cfg p">Config Options</h3><h4 class="cfgGroup">Other Configs</h4><div id="config-color" class="member f inherited"><a href="Ext.chart.series.Scatter.html#config-color" rel="config-color" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-color" class="viewSource">view source</a></div><a name="color"></a><a name="config-color"></a><a href="Ext.chart.series.Scatter.html#" rel="config-color" class="cls expand">color</a><span> : String</span></div><div class="description"><div class="short"><p>The color of the label text.
102 Default value: '#000' (black).</p>
103 </div><div class="long"><p>The color of the label text.
104 Default value: '#000' (black).</p>
105 </div></div></div><div id="config-display" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-display" rel="config-display" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-display" class="viewSource">view source</a></div><a name="display"></a><a name="config-display"></a><a href="Ext.chart.series.Scatter.html#" rel="config-display" class="cls expand">display</a><span> : String</span></div><div class="description"><div class="short">Specifies the presence and position of labels for each pie slice. Either "rotate", "middle", "insideStart",
106 "insideEn...</div><div class="long"><p>Specifies the presence and position of labels for each pie slice. Either "rotate", "middle", "insideStart",
107 "insideEnd", "outside", "over", "under", or "none" to prevent label rendering.
108 Default value: 'none'.</p>
109 </div></div></div><div id="config-field" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-field" rel="config-field" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-field" class="viewSource">view source</a></div><a name="field"></a><a name="config-field"></a><a href="Ext.chart.series.Scatter.html#" rel="config-field" class="cls expand">field</a><span> : String</span></div><div class="description"><div class="short"><p>The name of the field to be displayed in the label.
110 Default value: 'name'.</p>
111 </div><div class="long"><p>The name of the field to be displayed in the label.
112 Default value: 'name'.</p>
113 </div></div></div><div id="config-font" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-font" rel="config-font" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-font" class="viewSource">view source</a></div><a name="font"></a><a name="config-font"></a><a href="Ext.chart.series.Scatter.html#" rel="config-font" class="cls expand">font</a><span> : String</span></div><div class="description"><div class="short"><p>The font used for the labels.
114 Defautl value: "11px Helvetica, sans-serif".</p>
115 </div><div class="long"><p>The font used for the labels.
116 Defautl value: "11px Helvetica, sans-serif".</p>
117 </div></div></div><div id="config-highlight" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-highlight" rel="config-highlight" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-highlight" class="viewSource">view source</a></div><a name="highlight"></a><a name="config-highlight"></a><a href="Ext.chart.series.Scatter.html#" rel="config-highlight" class="cls expand">highlight</a><span> : Boolean|Object</span></div><div class="description"><div class="short">If set to true it will highlight the markers or the series when hovering
118 with the mouse. This parameter can also be a...</div><div class="long"><p>If set to <code>true</code> it will highlight the markers or the series when hovering
119 with the mouse. This parameter can also be an object with the same style
120 properties you would apply to a <a href="Ext.draw.Sprite.html" rel="Ext.draw.Sprite" class="docClass">Ext.draw.Sprite</a> to apply custom
121 styles to markers and series.</p>
122 </div></div></div><div id="config-listeners" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-listeners" rel="config-listeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-cfg-listeners" class="viewSource">view source</a></div><a name="listeners"></a><a name="config-listeners"></a><a href="Ext.chart.series.Scatter.html#" rel="config-listeners" class="cls expand">listeners</a><span> : Object</span></div><div class="description"><div class="short">(optional) A config object containing one or more event handlers to be added to this
123 object during initialization.  T...</div><div class="long"><p>(optional) <p>A config object containing one or more event handlers to be added to this
124 object during initialization.  This should be a valid listeners config object as specified in the
125 <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a> example for attaching multiple handlers at once.</p></p>
126
127 <br><p><b><u>DOM events from ExtJs <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a></u></b></p>
128
129
130 <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
131
132
133 <p>is usually only done when extra value can be added. For example the <a href="Ext.view.View.html" rel="Ext.view.View" class="docClass">DataView</a>'s
134 <b><code><a href="Ext.view.View.html#click" rel="Ext.view.View#click" class="docClass">click</a></code></b> event passing the node clicked on. To access DOM
135 events directly from a child element of a Component, we need to specify the <code>element</code> option to
136 identify the Component property to add a DOM listener to:</p>
137
138 <pre><code>new Ext.panel.Panel({
139     width: 400,
140     height: 200,
141     dockedItems: [{
142         xtype: 'toolbar'
143     }],
144     listeners: {
145         click: {
146             element: 'el', //bind to the underlying el property on the panel
147             fn: function(){ console.log('click el'); }
148         },
149         dblclick: {
150             element: 'body', //bind to the underlying body property on the panel
151             fn: function(){ console.log('dblclick body'); }
152         }
153     }
154 });
155 </code></pre>
156
157
158 <p></p></p>
159 </div></div></div><div id="config-markerConfig" class="member ni"><a href="Ext.chart.series.Scatter.html#config-markerConfig" rel="config-markerConfig" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Scatter.html" class="definedIn docClass">Ext.chart.series.Scatter</a><br/><a href="../source/Scatter.html#Ext-chart.series.Scatter-cfg-markerConfig" class="viewSource">view source</a></div><a name="markerConfig"></a><a name="config-markerConfig"></a><a href="Ext.chart.series.Scatter.html#" rel="config-markerConfig" class="cls expand">markerConfig</a><span> : Object</span></div><div class="description"><div class="short"><p>The display style for the scatter series markers.</p>
160 </div><div class="long"><p>The display style for the scatter series markers.</p>
161 </div></div></div><div id="config-minMargin" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-minMargin" rel="config-minMargin" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-minMargin" class="viewSource">view source</a></div><a name="minMargin"></a><a name="config-minMargin"></a><a href="Ext.chart.series.Scatter.html#" rel="config-minMargin" class="cls expand">minMargin</a><span> : Number</span></div><div class="description"><div class="short">Specifies the minimum distance from a label to the origin of the visualization.
162 This parameter is useful when using P...</div><div class="long"><p>Specifies the minimum distance from a label to the origin of the visualization.
163 This parameter is useful when using PieSeries width variable pie slice lengths.
164 Default value: 50.</p>
165 </div></div></div><div id="config-orientation" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-orientation" rel="config-orientation" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-orientation" class="viewSource">view source</a></div><a name="orientation"></a><a name="config-orientation"></a><a href="Ext.chart.series.Scatter.html#" rel="config-orientation" class="cls expand">orientation</a><span> : String</span></div><div class="description"><div class="short"><p>Either "horizontal" or "vertical".
166 Dafault value: "horizontal".</p>
167 </div><div class="long"><p>Either "horizontal" or "vertical".
168 Dafault value: "horizontal".</p>
169 </div></div></div><div id="config-renderer" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-renderer" rel="config-renderer" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Label.html" class="definedIn docClass">Ext.chart.Label</a><br/><a href="../source/Label2.html#Ext-chart.Label-cfg-renderer" class="viewSource">view source</a></div><a name="renderer"></a><a name="config-renderer"></a><a href="Ext.chart.series.Scatter.html#" rel="config-renderer" class="cls expand">renderer</a><span> : Function</span></div><div class="description"><div class="short"><p>Optional function for formatting the label into a displayable value.
170 Default value: function(v) { return v; }</p>
171 </div><div class="long"><p>Optional function for formatting the label into a displayable value.
172 Default value: function(v) { return v; }</p>
173 </div></div></div><div id="config-shadowAttributes" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-shadowAttributes" rel="config-shadowAttributes" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-shadowAttributes" class="viewSource">view source</a></div><a name="shadowAttributes"></a><a name="config-shadowAttributes"></a><a href="Ext.chart.series.Scatter.html#" rel="config-shadowAttributes" class="cls expand">shadowAttributes</a><span> : Array</span></div><div class="description"><div class="short"><p>An array with shadow attributes</p>
174 </div><div class="long"><p>An array with shadow attributes</p>
175 </div></div></div><div id="config-showInLegend" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-showInLegend" rel="config-showInLegend" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-showInLegend" class="viewSource">view source</a></div><a name="showInLegend"></a><a name="config-showInLegend"></a><a href="Ext.chart.series.Scatter.html#" rel="config-showInLegend" class="cls expand">showInLegend</a><span> : Boolean</span></div><div class="description"><div class="short"><p>Whether to show this series in the legend.</p>
176 </div><div class="long"><p>Whether to show this series in the legend.</p>
177 </div></div></div><div id="config-style" class="member ni"><a href="Ext.chart.series.Scatter.html#config-style" rel="config-style" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Scatter.html" class="definedIn docClass">Ext.chart.series.Scatter</a><br/><a href="../source/Scatter.html#Ext-chart.series.Scatter-cfg-style" class="viewSource">view source</a></div><a name="style"></a><a name="config-style"></a><a href="Ext.chart.series.Scatter.html#" rel="config-style" class="cls expand">style</a><span> : Object</span></div><div class="description"><div class="short"><p>Append styling properties to this object for it to override theme properties.</p>
178 </div><div class="long"><p>Append styling properties to this object for it to override theme properties.</p>
179 </div></div></div><div id="config-tips" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-tips" rel="config-tips" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-tips" class="viewSource">view source</a></div><a name="tips"></a><a name="config-tips"></a><a href="Ext.chart.series.Scatter.html#" rel="config-tips" class="cls expand">tips</a><span> : Object</span></div><div class="description"><div class="short">Add tooltips to the visualization's markers. The options for the tips are the
180 same configuration used with Ext.tip.To...</div><div class="long"><p>Add tooltips to the visualization's markers. The options for the tips are the
181 same configuration used with <a href="Ext.tip.ToolTip.html" rel="Ext.tip.ToolTip" class="docClass">Ext.tip.ToolTip</a>. For example:</p>
182
183 <pre><code>tips: {
184   trackMouse: true,
185   width: 140,
186   height: 28,
187   renderer: function(storeItem, item) {
188     this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + ' views');
189   }
190 },
191 </code></pre>
192 </div></div></div><div id="config-title" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-title" rel="config-title" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-title" class="viewSource">view source</a></div><a name="title"></a><a name="config-title"></a><a href="Ext.chart.series.Scatter.html#" rel="config-title" class="cls expand">title</a><span> : String</span></div><div class="description"><div class="short"><p>The human-readable name of the series.</p>
193 </div><div class="long"><p>The human-readable name of the series.</p>
194 </div></div></div><div id="config-type" class="member inherited"><a href="Ext.chart.series.Scatter.html#config-type" rel="config-type" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-cfg-type" class="viewSource">view source</a></div><a name="type"></a><a name="config-type"></a><a href="Ext.chart.series.Scatter.html#" rel="config-type" class="cls expand">type</a><span> : String</span></div><div class="description"><div class="short"><p>The type of series. Set in subclasses.</p>
195 </div><div class="long"><p>The type of series. Set in subclasses.</p>
196 </div></div></div></div><div class="m-properties"><a name="properties"></a><div class="definedBy">Defined By</div><h3 class="prp p">Properties</h3><div id="property-axis" class="member f inherited"><a href="Ext.chart.series.Scatter.html#property-axis" rel="property-axis" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Cartesian.html" class="definedIn docClass">Ext.chart.series.Cartesian</a><br/><a href="../source/Cartesian.html#Ext-chart.series.Cartesian-property-axis" class="viewSource">view source</a></div><a name="axis"></a><a name="property-axis"></a><a href="Ext.chart.series.Scatter.html#" rel="property-axis" class="cls expand">axis</a><span> : String</span></div><div class="description"><div class="short"><p>Indicates which axis the series will bind to</p>
197 </div><div class="long"><p>Indicates which axis the series will bind to</p>
198 </div></div></div><div id="property-highlight" class="member inherited"><a href="Ext.chart.series.Scatter.html#property-highlight" rel="property-highlight" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Highlight.html" class="definedIn docClass">Ext.chart.Highlight</a><br/><a href="../source/Highlight.html#Ext-chart.Highlight-property-highlight" class="viewSource">view source</a></div><a name="highlight"></a><a name="property-highlight"></a><a href="Ext.chart.series.Scatter.html#" rel="property-highlight" class="cls expand">highlight</a><span> : Boolean</span></div><div class="description"><div class="short"><p>Highlight the given series item.</p>
199 </div><div class="long"><p>Highlight the given series item.</p>
200 </div></div></div><div id="property-xField" class="member inherited"><a href="Ext.chart.series.Scatter.html#property-xField" rel="property-xField" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Cartesian.html" class="definedIn docClass">Ext.chart.series.Cartesian</a><br/><a href="../source/Cartesian.html#Ext-chart.series.Cartesian-property-xField" class="viewSource">view source</a></div><a name="xField"></a><a name="property-xField"></a><a href="Ext.chart.series.Scatter.html#" rel="property-xField" class="cls expand">xField</a><span> : String</span></div><div class="description"><div class="short"><p>The field used to access the x axis value from the items from the data
201 source.</p>
202 </div><div class="long"><p>The field used to access the x axis value from the items from the data
203 source.</p>
204 </div></div></div><div id="property-yField" class="member inherited"><a href="Ext.chart.series.Scatter.html#property-yField" rel="property-yField" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Cartesian.html" class="definedIn docClass">Ext.chart.series.Cartesian</a><br/><a href="../source/Cartesian.html#Ext-chart.series.Cartesian-property-yField" class="viewSource">view source</a></div><a name="yField"></a><a name="property-yField"></a><a href="Ext.chart.series.Scatter.html#" rel="property-yField" class="cls expand">yField</a><span> : String</span></div><div class="description"><div class="short"><p>The field used to access the y-axis value from the items from the data
205 source.</p>
206 </div><div class="long"><p>The field used to access the y-axis value from the items from the data
207 source.</p>
208 </div></div></div></div><div class="m-methods"><a name="methods"></a><div class="definedBy">Defined By</div><h3 class="mth p">Methods</h3><div id="method-Scatter" class="member f inherited"><a href="Ext.chart.series.Scatter.html#method-Scatter" rel="method-Scatter" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Cartesian.html" class="definedIn docClass">Ext.chart.series.Cartesian</a><br/><a href="../source/Cartesian.html#Ext-chart.series.Cartesian-method-constructor" class="viewSource">view source</a></div><a name="Scatter"></a><a name="method-Scatter"></a><a href="Ext.chart.series.Scatter.html#" rel="method-Scatter" class="cls expand">Scatter</a> : void</div><div class="description"><div class="short"><p>&nbsp;</p></div><div class="long">
209 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
210 </li></ul></div></div></div><div id="method-addEvents" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-addEvents" rel="method-addEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addEvents" class="viewSource">view source</a></div><a name="addEvents"></a><a name="method-addEvents"></a><a href="Ext.chart.series.Scatter.html#" rel="method-addEvents" class="cls expand">addEvents</a>(
211 <span class="pre">Object/String o, String </span>)
212  : void</div><div class="description"><div class="short"><p>Adds the specified events to the list of events which this Observable may fire.</p>
213 </div><div class="long"><p>Adds the specified events to the list of events which this Observable may fire.</p>
214 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Object/String<div class="sub-desc"><p>Either an object with event names as properties with a value of <code>true</code>
215 or the first event name string if multiple event names are being passed as separate parameters.</p>
216 </div></li><li><span class="pre"></span> : String<div class="sub-desc"><p>[additional] Optional additional event names if multiple event names are being passed as separate parameters.
217 Usage:</p>
218
219 <pre><code>this.addEvents('storeloaded', 'storecleared');
220 </code></pre>
221
222 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
223 </li></ul></div></div></div><div id="method-addListener" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-addListener" rel="method-addListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addListener" class="viewSource">view source</a></div><a name="addListener"></a><a name="method-addListener"></a><a href="Ext.chart.series.Scatter.html#" rel="method-addListener" class="cls expand">addListener</a>(
224 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
225  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object.</p>
226 </div><div class="long"><p>Appends an event handler to this object.</p>
227 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to listen for. May also be an object who's property names are event names. See</p>
228 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes.</p>
229 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
230 <b>If omitted, defaults to the object which fired the event.</b></p>
231 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.
232 properties. This may contain any of the following properties:<ul>
233 <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
234 <b>If omitted, defaults to the object which fired the event.</b></div></li>
235 <li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
236 <li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
237 <li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an <a href="Ext.util.DelayedTask.html" rel="Ext.util.DelayedTask" class="docClass">Ext.util.DelayedTask</a> delayed
238 by the specified number of milliseconds. If the event fires again within that time, the original
239 handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
240 <li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
241 if the event was bubbled up from a child Observable.</div></li>
242 <li><b>element</b> : String<div class="sub-desc"><b>This option is only valid for listeners bound to <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a>.</b>
243 The name of a Component property which references an element to add a listener to.</p>
244
245 <p>This option is useful during Component construction to add DOM event listeners to elements of <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Components</a> which
246 will exist only after the Component is rendered. For example, to add a click listener to a Panel's body:
247 <pre><code>new Ext.panel.Panel({
248     title: 'The title',
249     listeners: {
250         click: this.handlePanelClick,
251         element: 'body'
252     }
253 });
254 </code></pre></p>
255
256
257 <p>When added in this way, the options available are the options applicable to <a href="Ext.core.Element.html#addListener" rel="Ext.core.Element#addListener" class="docClass">Ext.core.Element.addListener</a></p>
258
259
260 <p></div></li>
261 </ul><br></p>
262
263 <p>
264 <b>Combining Options</b><br>
265 Using the options argument, it is possible to combine different types of listeners:<br>
266 <br>
267 A delayed, one-time listener.
268 <pre><code>myPanel.on('hide', this.handleClick, this, {
269 single: true,
270 delay: 100
271 });</code></pre>
272 <p>
273 <b>Attaching multiple handlers in 1 call</b><br>
274 The method also allows for a single argument to be passed which is a config object containing properties
275 which specify multiple events. For example:
276 <pre><code>myGridPanel.on({
277     cellClick: this.onCellClick,
278     mouseover: this.onMouseOver,
279     mouseout: this.onMouseOut,
280     scope: this // Important. Ensure "this" is correct during handler execution
281 });
282 </code></pre>.
283 <p>
284
285 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
286 </li></ul></div></div></div><div id="method-addManagedListener" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-addManagedListener" rel="method-addManagedListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-addManagedListener" class="viewSource">view source</a></div><a name="addManagedListener"></a><a name="method-addManagedListener"></a><a href="Ext.chart.series.Scatter.html#" rel="method-addManagedListener" class="cls expand">addManagedListener</a>(
287 <span class="pre">Observable/Element item, Object/String ename, Function fn, Object scope, Object opt</span>)
288  : void</div><div class="description"><div class="short"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
289 is destroyed.
290
291 </div><div class="long"><p>Adds listeners to any Observable object (or Element) which are automatically removed when this Component
292 is destroyed.
293
294 <h3 class="pa">Parameters</h3><ul><li><span class="pre">item</span> : Observable/Element<div class="sub-desc"><p>The item to which to add a listener/listeners.</p>
295 </div></li><li><span class="pre">ename</span> : Object/String<div class="sub-desc"><p>The event name, or an object containing event name properties.</p>
296 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
297 is the handler function.</p>
298 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
299 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
300 </div></li><li><span class="pre">opt</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
301 is the <a href="Ext.util.Observable.html#addListener" rel="Ext.util.Observable#addListener" class="docClass">addListener</a> options.</p>
302 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
303 </li></ul></div></div></div><div id="method-capture" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-capture" rel="method-capture" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-capture" class="viewSource">view source</a></div><a name="capture"></a><a name="method-capture"></a><a href="Ext.chart.series.Scatter.html#" rel="method-capture" class="cls expand">capture</a>(
304 <span class="pre">Observable o, Function fn, [Object scope]</span>)
305  : void</div><div class="description"><div class="short">Starts capture on the specified Observable. All events will be passed
306 to the supplied function with the event name + ...</div><div class="long"><p>Starts capture on the specified Observable. All events will be passed
307 to the supplied function with the event name + standard signature of the event
308 <b>before</b> the event is fired. If the supplied function returns false,
309 the event will not fire.</p>
310 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Observable<div class="sub-desc"><p>The Observable to capture events from.</p>
311 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>The function to call when an event is fired.</p>
312 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code>this</code> reference) in which the function is executed. Defaults to the Observable firing the event.</p>
313 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
314 </li></ul></div></div></div><div id="method-clearListeners" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-clearListeners" rel="method-clearListeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-clearListeners" class="viewSource">view source</a></div><a name="clearListeners"></a><a name="method-clearListeners"></a><a href="Ext.chart.series.Scatter.html#" rel="method-clearListeners" class="cls expand">clearListeners</a> : void</div><div class="description"><div class="short"><p>Removes all listeners for this object including the managed listeners</p>
315 </div><div class="long"><p>Removes all listeners for this object including the managed listeners</p>
316 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
317 </li></ul></div></div></div><div id="method-clearManagedListeners" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-clearManagedListeners" rel="method-clearManagedListeners" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-clearManagedListeners" class="viewSource">view source</a></div><a name="clearManagedListeners"></a><a name="method-clearManagedListeners"></a><a href="Ext.chart.series.Scatter.html#" rel="method-clearManagedListeners" class="cls expand">clearManagedListeners</a> : void</div><div class="description"><div class="short"><p>Removes all managed listeners for this object.</p>
318 </div><div class="long"><p>Removes all managed listeners for this object.</p>
319 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
320 </li></ul></div></div></div><div id="method-drawSeries" class="member ni"><a href="Ext.chart.series.Scatter.html#method-drawSeries" rel="method-drawSeries" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Scatter.html" class="definedIn docClass">Ext.chart.series.Scatter</a><br/><a href="../source/Scatter.html#Ext-chart.series.Scatter-method-drawSeries" class="viewSource">view source</a></div><a name="drawSeries"></a><a name="method-drawSeries"></a><a href="Ext.chart.series.Scatter.html#" rel="method-drawSeries" class="cls expand">drawSeries</a> : void</div><div class="description"><div class="short"><p>Draws the series for the current chart.</p>
321 </div><div class="long"><p>Draws the series for the current chart.</p>
322 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
323 </li></ul></div></div></div><div id="method-enableBubble" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-enableBubble" rel="method-enableBubble" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-enableBubble" class="viewSource">view source</a></div><a name="enableBubble"></a><a name="method-enableBubble"></a><a href="Ext.chart.series.Scatter.html#" rel="method-enableBubble" class="cls expand">enableBubble</a>(
324 <span class="pre">String/Array events</span>)
325  : void</div><div class="description"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling
326 this.getBubbleTarget() if present....</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
327 <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
328
329
330 <p>This is commonly used by Ext.Components to bubble events to owner Containers. See <a href="Ext.Component.html#getBubbleTarget" rel="Ext.Component#getBubbleTarget" class="docClass">Ext.Component.getBubbleTarget</a>. The default
331 implementation in <a href="Ext.Component.html" rel="Ext.Component" class="docClass">Ext.Component</a> returns the Component's immediate owner. But if a known target is required, this can be overridden to
332 access the required target more quickly.</p>
333
334
335 <p>Example:</p>
336
337
338 <pre><code>Ext.override(Ext.form.field.Base, {
339 //  Add functionality to Field&#39;s initComponent to enable the change event to bubble
340 initComponent : Ext.Function.createSequence(Ext.form.field.Base.prototype.initComponent, function() {
341     this.enableBubble('change');
342 }),
343
344 //  We know that we want Field&#39;s events to bubble directly to the FormPanel.
345 getBubbleTarget : function() {
346     if (!this.formPanel) {
347         this.formPanel = this.findParentByType('form');
348     }
349     return this.formPanel;
350 }
351 });
352
353 var myForm = new Ext.formPanel({
354 title: 'User Details',
355 items: [{
356     ...
357 }],
358 listeners: {
359     change: function() {
360         // Title goes red if form has been modified.
361         myForm.header.setStyle('color', 'red');
362     }
363 }
364 });
365 </code></pre>
366
367 <h3 class="pa">Parameters</h3><ul><li><span class="pre">events</span> : String/Array<div class="sub-desc"><p>The event name to bubble, or an Array of event names.</p>
368 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
369 </li></ul></div></div></div><div id="method-fireEvent" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-fireEvent" rel="method-fireEvent" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-fireEvent" class="viewSource">view source</a></div><a name="fireEvent"></a><a name="method-fireEvent"></a><a href="Ext.chart.series.Scatter.html#" rel="method-fireEvent" class="cls expand">fireEvent</a>(
370 <span class="pre">String eventName, Object... args</span>)
371  : Boolean</div><div class="description"><div class="short">Fires the specified event with the passed parameters (minus the event name).
372
373
374 An event may be set to bubble up an Ob...</div><div class="long"><p>Fires the specified event with the passed parameters (minus the event name).</p>
375
376
377 <p>An event may be set to bubble up an Observable parent hierarchy (See <a href="Ext.Component.html#getBubbleTarget" rel="Ext.Component#getBubbleTarget" class="docClass">Ext.Component.getBubbleTarget</a>)
378 by calling <a href="Ext.chart.series.Scatter.html#enableBubble" rel="Ext.chart.series.Scatter#enableBubble" class="docClass">enableBubble</a>.</p>
379
380 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to fire.</p>
381 </div></li><li><span class="pre">args</span> : Object...<div class="sub-desc"><p>Variable number of parameters are passed to handlers.</p>
382 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>returns false if any of the handlers return false otherwise it returns true.</p>
383 </li></ul></div></div></div><div id="method-getItemForPoint" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-getItemForPoint" rel="method-getItemForPoint" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-method-getItemForPoint" class="viewSource">view source</a></div><a name="getItemForPoint"></a><a name="method-getItemForPoint"></a><a href="Ext.chart.series.Scatter.html#" rel="method-getItemForPoint" class="cls expand">getItemForPoint</a>(
384 <span class="pre">Number x, Number y</span>)
385  : Object</div><div class="description"><div class="short"><p>For a given x/y point relative to the Surface, find a corresponding item from this
386 series, if any.</p>
387 </div><div class="long"><p>For a given x/y point relative to the Surface, find a corresponding item from this
388 series, if any.</p>
389 <h3 class="pa">Parameters</h3><ul><li><span class="pre">x</span> : Number<div class="sub-desc">
390 </div></li><li><span class="pre">y</span> : Number<div class="sub-desc">
391 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Object</span>&nbsp; &nbsp;<p>An object describing the item, or null if there is no matching item. The exact contents of</p>
392
393 <pre><code>             this object will vary by series type, but should always contain at least the following:
394              &lt;ul&gt;
395                &lt;li&gt;{Ext.chart.series.Series} series - the Series object to which the item belongs&lt;/li&gt;
396                &lt;li&gt;{Object} value - the value(s) of the item's data point&lt;/li&gt;
397                &lt;li&gt;{Array} point - the x/y coordinates relative to the chart box of a single point
398                    for this data item, which can be used as e.g. a tooltip anchor point.&lt;/li&gt;
399                &lt;li&gt;{Ext.draw.Sprite} sprite - the item's rendering Sprite.
400              &lt;/ul&gt;
401 </code></pre>
402 </li></ul></div></div></div><div id="method-getLegendColor" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-getLegendColor" rel="method-getLegendColor" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-method-getLegendColor" class="viewSource">view source</a></div><a name="getLegendColor"></a><a name="method-getLegendColor"></a><a href="Ext.chart.series.Scatter.html#" rel="method-getLegendColor" class="cls expand">getLegendColor</a>(
403 <span class="pre">Object index</span>)
404  : void</div><div class="description"><div class="short"><p>Returns a string with the color to be used for the series legend item.</p>
405 </div><div class="long"><p>Returns a string with the color to be used for the series legend item.</p>
406 <h3 class="pa">Parameters</h3><ul><li><span class="pre">index</span> : Object<div class="sub-desc">
407 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
408 </li></ul></div></div></div><div id="method-hasListener" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-hasListener" rel="method-hasListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-hasListener" class="viewSource">view source</a></div><a name="hasListener"></a><a name="method-hasListener"></a><a href="Ext.chart.series.Scatter.html#" rel="method-hasListener" class="cls expand">hasListener</a>(
409 <span class="pre">String eventName</span>)
410  : Boolean</div><div class="description"><div class="short"><p>Checks to see if this object has any listeners for a specified event</p>
411 </div><div class="long"><p>Checks to see if this object has any listeners for a specified event</p>
412 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The name of the event to check for</p>
413 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if the event is being listened for, else false</p>
414 </li></ul></div></div></div><div id="method-hideAll" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-hideAll" rel="method-hideAll" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-method-hideAll" class="viewSource">view source</a></div><a name="hideAll"></a><a name="method-hideAll"></a><a href="Ext.chart.series.Scatter.html#" rel="method-hideAll" class="cls expand">hideAll</a> : void</div><div class="description"><div class="short"><p>Hides all the elements in the series.</p>
415 </div><div class="long"><p>Hides all the elements in the series.</p>
416 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
417 </li></ul></div></div></div><div id="method-highlightItem" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-highlightItem" rel="method-highlightItem" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Highlight.html" class="definedIn docClass">Ext.chart.Highlight</a><br/><a href="../source/Highlight.html#Ext-chart.Highlight-method-highlightItem" class="viewSource">view source</a></div><a name="highlightItem"></a><a name="method-highlightItem"></a><a href="Ext.chart.series.Scatter.html#" rel="method-highlightItem" class="cls expand">highlightItem</a>(
418 <span class="pre">Object item</span>)
419  : void</div><div class="description"><div class="short"><p>Highlight the given series item.</p>
420 </div><div class="long"><p>Highlight the given series item.</p>
421 <h3 class="pa">Parameters</h3><ul><li><span class="pre">item</span> : Object<div class="sub-desc"><p>Info about the item; same format as returned by #getItemForPoint.</p>
422 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
423 </li></ul></div></div></div><div id="method-observe" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-observe" rel="method-observe" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-observe" class="viewSource">view source</a></div><a name="observe"></a><a name="method-observe"></a><a href="Ext.chart.series.Scatter.html#" rel="method-observe" class="cls expand">observe</a>(
424 <span class="pre">Function c, Object listeners</span>)
425  : void</div><div class="description"><div class="short">Sets observability on the passed class constructor.
426
427 This makes any event fired on any instance of the passed class a...</div><div class="long"><p>Sets observability on the passed class constructor.</p>
428
429 <p>This makes any event fired on any instance of the passed class also fire a single event through
430 the <strong>class</strong> allowing for central handling of events on many instances at once.</p>
431
432 <p>Usage:</p>
433
434 <pre><code>Ext.util.Observable.observe(Ext.data.Connection);
435 Ext.data.Connection.on('beforerequest', function(con, options) {
436     console.log('Ajax request made to ' + options.url);
437 });
438 </code></pre>
439 <h3 class="pa">Parameters</h3><ul><li><span class="pre">c</span> : Function<div class="sub-desc"><p>The class constructor to make observable.</p>
440 </div></li><li><span class="pre">listeners</span> : Object<div class="sub-desc"><p>An object containing a series of listeners to add. See <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a>.</p>
441 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
442 </li></ul></div></div></div><div id="method-on" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-on" rel="method-on" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-on" class="viewSource">view source</a></div><a name="on"></a><a name="method-on"></a><a href="Ext.chart.series.Scatter.html#" rel="method-on" class="cls expand">on</a>(
443 <span class="pre">String eventName, Function handler, [Object scope], [Object options]</span>)
444  : void</div><div class="description"><div class="short"><p>Appends an event handler to this object (shorthand for <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a>.)</p>
445 </div><div class="long"><p>Appends an event handler to this object (shorthand for <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a>.)</p>
446 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event to listen for</p>
447 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The method the event invokes</p>
448 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
449 <b>If omitted, defaults to the object which fired the event.</b></p>
450 </div></li><li><span class="pre">options</span> : Object<div class="sub-desc"><p>(optional) An object containing handler configuration.</p>
451 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
452 </li></ul></div></div></div><div id="method-relayEvents" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-relayEvents" rel="method-relayEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-relayEvents" class="viewSource">view source</a></div><a name="relayEvents"></a><a name="method-relayEvents"></a><a href="Ext.chart.series.Scatter.html#" rel="method-relayEvents" class="cls expand">relayEvents</a>(
453 <span class="pre">Object origin, Array events, Object prefix</span>)
454  : void</div><div class="description"><div class="short"><p>Relays selected events from the specified Observable as if the events were fired by <code><b>this</b></code>.</p>
455 </div><div class="long"><p>Relays selected events from the specified Observable as if the events were fired by <code><b>this</b></code>.</p>
456 <h3 class="pa">Parameters</h3><ul><li><span class="pre">origin</span> : Object<div class="sub-desc"><p>The Observable whose events this object is to relay.</p>
457 </div></li><li><span class="pre">events</span> : Array<div class="sub-desc"><p>Array of event names to relay.</p>
458 </div></li><li><span class="pre">prefix</span> : Object<div class="sub-desc">
459 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
460 </li></ul></div></div></div><div id="method-releaseCapture" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-releaseCapture" rel="method-releaseCapture" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-releaseCapture" class="viewSource">view source</a></div><a name="releaseCapture"></a><a name="method-releaseCapture"></a><a href="Ext.chart.series.Scatter.html#" rel="method-releaseCapture" class="cls expand">releaseCapture</a>(
461 <span class="pre">Observable o</span>)
462  : void</div><div class="description"><div class="short"><p>Removes <b>all</b> added captures from the Observable.</p>
463 </div><div class="long"><p>Removes <b>all</b> added captures from the Observable.</p>
464 <h3 class="pa">Parameters</h3><ul><li><span class="pre">o</span> : Observable<div class="sub-desc"><p>The Observable to release</p>
465 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
466 </li></ul></div></div></div><div id="method-removeListener" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-removeListener" rel="method-removeListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-removeListener" class="viewSource">view source</a></div><a name="removeListener"></a><a name="method-removeListener"></a><a href="Ext.chart.series.Scatter.html#" rel="method-removeListener" class="cls expand">removeListener</a>(
467 <span class="pre">String eventName, Function handler, [Object scope]</span>)
468  : void</div><div class="description"><div class="short"><p>Removes an event handler.</p>
469 </div><div class="long"><p>Removes an event handler.</p>
470 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event the handler was associated with.</p>
471 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The handler to remove. <b>This must be a reference to the function passed into the <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a> call.</b></p>
472 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</p>
473 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
474 </li></ul></div></div></div><div id="method-removeManagedListener" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-removeManagedListener" rel="method-removeManagedListener" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-removeManagedListener" class="viewSource">view source</a></div><a name="removeManagedListener"></a><a name="method-removeManagedListener"></a><a href="Ext.chart.series.Scatter.html#" rel="method-removeManagedListener" class="cls expand">removeManagedListener</a>(
475 <span class="pre">Observable|Element item, Object|String ename, Function fn, Object scope</span>)
476  : void</div><div class="description"><div class="short"><p>Removes listeners that were added by the <a href="Ext.chart.series.Scatter.html#mon" rel="Ext.chart.series.Scatter#mon" class="docClass">mon</a> method.</p>
477 </div><div class="long"><p>Removes listeners that were added by the <a href="Ext.chart.series.Scatter.html#mon" rel="Ext.chart.series.Scatter#mon" class="docClass">mon</a> method.</p>
478 <h3 class="pa">Parameters</h3><ul><li><span class="pre">item</span> : Observable|Element<div class="sub-desc"><p>The item from which to remove a listener/listeners.</p>
479 </div></li><li><span class="pre">ename</span> : Object|String<div class="sub-desc"><p>The event name, or an object containing event name properties.</p>
480 </div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
481 is the handler function.</p>
482 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>Optional. If the <code>ename</code> parameter was an event name, this
483 is the scope (<code>this</code> reference) in which the handler function is executed.</p>
484 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
485 </li></ul></div></div></div><div id="method-resumeEvents" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-resumeEvents" rel="method-resumeEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-resumeEvents" class="viewSource">view source</a></div><a name="resumeEvents"></a><a name="method-resumeEvents"></a><a href="Ext.chart.series.Scatter.html#" rel="method-resumeEvents" class="cls expand">resumeEvents</a> : void</div><div class="description"><div class="short">Resume firing events. (see suspendEvents)
486 If events were suspended using the queueSuspended parameter, then all
487 event...</div><div class="long"><p>Resume firing events. (see <a href="Ext.chart.series.Scatter.html#suspendEvents" rel="Ext.chart.series.Scatter#suspendEvents" class="docClass">suspendEvents</a>)
488 If events were suspended using the <code><b>queueSuspended</b></code> parameter, then all
489 events fired during event suspension will be sent to any listeners now.</p>
490 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
491 </li></ul></div></div></div><div id="method-setTitle" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-setTitle" rel="method-setTitle" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-method-setTitle" class="viewSource">view source</a></div><a name="setTitle"></a><a name="method-setTitle"></a><a href="Ext.chart.series.Scatter.html#" rel="method-setTitle" class="cls expand">setTitle</a>(
492 <span class="pre">Number index, String title</span>)
493  : void</div><div class="description"><div class="short">Changes the value of the title for the series.
494 Arguments can take two forms:
495
496
497 A single String value: this will be us...</div><div class="long"><p>Changes the value of the <a href="Ext.chart.series.Scatter.html#title" rel="Ext.chart.series.Scatter#title" class="docClass">title</a> for the series.
498 Arguments can take two forms:</p>
499
500 <ul>
501 <li>A single String value: this will be used as the new single title for the series (applies
502 to series with only one yField)</li>
503 <li>A numeric index and a String value: this will set the title for a single indexed yField.</li>
504 </ul>
505
506 <h3 class="pa">Parameters</h3><ul><li><span class="pre">index</span> : Number<div class="sub-desc">
507 </div></li><li><span class="pre">title</span> : String<div class="sub-desc">
508 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
509 </li></ul></div></div></div><div id="method-showAll" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-showAll" rel="method-showAll" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-method-showAll" class="viewSource">view source</a></div><a name="showAll"></a><a name="method-showAll"></a><a href="Ext.chart.series.Scatter.html#" rel="method-showAll" class="cls expand">showAll</a> : void</div><div class="description"><div class="short"><p>Shows all the elements in the series.</p>
510 </div><div class="long"><p>Shows all the elements in the series.</p>
511 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
512 </li></ul></div></div></div><div id="method-suspendEvents" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-suspendEvents" rel="method-suspendEvents" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-suspendEvents" class="viewSource">view source</a></div><a name="suspendEvents"></a><a name="method-suspendEvents"></a><a href="Ext.chart.series.Scatter.html#" rel="method-suspendEvents" class="cls expand">suspendEvents</a>(
513 <span class="pre">Boolean queueSuspended</span>)
514  : void</div><div class="description"><div class="short"><p>Suspend the firing of all events. (see <a href="Ext.chart.series.Scatter.html#resumeEvents" rel="Ext.chart.series.Scatter#resumeEvents" class="docClass">resumeEvents</a>)</p>
515 </div><div class="long"><p>Suspend the firing of all events. (see <a href="Ext.chart.series.Scatter.html#resumeEvents" rel="Ext.chart.series.Scatter#resumeEvents" class="docClass">resumeEvents</a>)</p>
516 <h3 class="pa">Parameters</h3><ul><li><span class="pre">queueSuspended</span> : Boolean<div class="sub-desc"><p>Pass as true to queue up suspended events to be fired
517 after the <a href="Ext.chart.series.Scatter.html#resumeEvents" rel="Ext.chart.series.Scatter#resumeEvents" class="docClass">resumeEvents</a> call instead of discarding all suspended events;</p>
518 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
519 </li></ul></div></div></div><div id="method-un" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-un" rel="method-un" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.util.Observable.html" class="definedIn docClass">Ext.util.Observable</a><br/><a href="../source/Observable.html#Ext-util.Observable-method-un" class="viewSource">view source</a></div><a name="un"></a><a name="method-un"></a><a href="Ext.chart.series.Scatter.html#" rel="method-un" class="cls expand">un</a>(
520 <span class="pre">String eventName, Function handler, [Object scope]</span>)
521  : void</div><div class="description"><div class="short"><p>Removes an event handler (shorthand for <a href="Ext.chart.series.Scatter.html#removeListener" rel="Ext.chart.series.Scatter#removeListener" class="docClass">removeListener</a>.)</p>
522 </div><div class="long"><p>Removes an event handler (shorthand for <a href="Ext.chart.series.Scatter.html#removeListener" rel="Ext.chart.series.Scatter#removeListener" class="docClass">removeListener</a>.)</p>
523 <h3 class="pa">Parameters</h3><ul><li><span class="pre">eventName</span> : String<div class="sub-desc"><p>The type of event the handler was associated with.</p>
524 </div></li><li><span class="pre">handler</span> : Function<div class="sub-desc"><p>The handler to remove. <b>This must be a reference to the function passed into the <a href="Ext.chart.series.Scatter.html#addListener" rel="Ext.chart.series.Scatter#addListener" class="docClass">addListener</a> call.</b></p>
525 </div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(optional) The scope originally specified for the handler.</p>
526 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
527 </li></ul></div></div></div><div id="method-unHighlightItem" class="member inherited"><a href="Ext.chart.series.Scatter.html#method-unHighlightItem" rel="method-unHighlightItem" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.Highlight.html" class="definedIn docClass">Ext.chart.Highlight</a><br/><a href="../source/Highlight.html#Ext-chart.Highlight-method-unHighlightItem" class="viewSource">view source</a></div><a name="unHighlightItem"></a><a name="method-unHighlightItem"></a><a href="Ext.chart.series.Scatter.html#" rel="method-unHighlightItem" class="cls expand">unHighlightItem</a> : void</div><div class="description"><div class="short"><p>Un-highlight any existing highlights</p>
528 </div><div class="long"><p>Un-highlight any existing highlights</p>
529 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
530 </li></ul></div></div></div></div><div class="m-events"><a name="events"></a><div class="definedBy">Defined By</div><h3 class="evt p">Events</h3><div id="event-titlechange" class="member f inherited"><a href="Ext.chart.series.Scatter.html#event-titlechange" rel="event-titlechange" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.chart.series.Series.html" class="definedIn docClass">Ext.chart.series.Series</a><br/><a href="../source/Series.html#Ext-chart.series.Series-event-titlechange" class="viewSource">view source</a></div><a name="titlechange"></a><a name="event-titlechange"></a><a href="Ext.chart.series.Scatter.html#" rel="event-titlechange" class="cls expand">titlechange</a>(
531 <span class="pre">String title, Number index</span>)
532 </div><div class="description"><div class="short"><p>Fires when the series title is changed via <a href="Ext.chart.series.Scatter.html#setTitle" rel="Ext.chart.series.Scatter#setTitle" class="docClass">setTitle</a>.</p>
533 </div><div class="long"><p>Fires when the series title is changed via <a href="Ext.chart.series.Scatter.html#setTitle" rel="Ext.chart.series.Scatter#setTitle" class="docClass">setTitle</a>.</p>
534 <h3 class="pa">Parameters</h3><ul><li><span class="pre">title</span> : String<div class="sub-desc"><p>The new title value</p>
535 </div></li><li><span class="pre">index</span> : Number<div class="sub-desc"><p>The index in the collection of titles</p>
536 </div></li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>