docs/api/Ext.chart.Label.html

   1 <!DOCTYPE html><html><head><title>Ext.chart.Label | 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.Label',
  13         docClass: 'Ext.chart.Label',
  14         docReq: 'Ext.chart.Label',
  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 = 'Label2.html#Ext-chart.Label';
  33     clsInfo = {"methods":[],"cfgs":["color","display","field","font","minMargin","orientation","renderer"],"properties":[],"events":[],"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/Label2.html#Ext-chart.Label" target="_blank">Ext.chart.Label</a></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><p>Labels is a mixin whose methods are appended onto the Series class. Labels is an interface with methods implemented
  38 in each of the Series (Pie, Bar, etc) for label creation and label placement.</p>
  39
  40 <p>The methods implemented by the Series are:</p>
  41
  42 <ul>
  43 <li><p><strong><code>onCreateLabel(storeItem, item, i, display)</code></strong> Called each time a new label is created.
  44 The arguments of the method are:</p>
  45
  46 <ul>
  47 <li><em><code>storeItem</code></em> The element of the store that is related to the label sprite.</li>
  48 <li><em><code>item</code></em> The item related to the label sprite. An item is an object containing the position of the shape
  49 used to describe the visualization and also pointing to the actual shape (circle, rectangle, path, etc).</li>
  50 <li><em><code>i</code></em> The index of the element created (i.e the first created label, second created label, etc)</li>
  51 <li><em><code>display</code></em> The display type. May be <b>false</b> if the label is hidden</li>
  52 </ul>
  53 </li>
  54 <li><p><strong><code>onPlaceLabel(label, storeItem, item, i, display, animate)</code></strong> Called for updating the position of the label.
  55 The arguments of the method are:</p>
  56
  57 <ul>
  58 <li><em><code>label</code></em> The sprite label.</li></li>
  59 <li><em><code>storeItem</code></em> The element of the store that is related to the label sprite</li></li>
  60 <li><em><code>item</code></em> The item related to the label sprite. An item is an object containing the position of the shape
  61 used to describe the visualization and also pointing to the actual shape (circle, rectangle, path, etc).</li>
  62 <li><em><code>i</code></em> The index of the element to be updated (i.e. whether it is the first, second, third from the labelGroup)</li>
  63 <li><em><code>display</code></em> The display type. May be <b>false</b> if the label is hidden.</li>
  64 <li><em><code>animate</code></em> A boolean value to set or unset animations for the labels.</li>
  65 </ul>
  66 </li>
  67 </ul>
  68
  69 <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 ni"><a href="Ext.chart.Label.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.Label.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.
  70 Default value: '#000' (black).</p>
  71 </div><div class="long"><p>The color of the label text.
  72 Default value: '#000' (black).</p>
  73 </div></div></div><div id="config-display" class="member ni"><a href="Ext.chart.Label.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.Label.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",
  74 "insideEn...</div><div class="long"><p>Specifies the presence and position of labels for each pie slice. Either "rotate", "middle", "insideStart",
  75 "insideEnd", "outside", "over", "under", or "none" to prevent label rendering.
  76 Default value: 'none'.</p>
  77 </div></div></div><div id="config-field" class="member ni"><a href="Ext.chart.Label.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.Label.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.
  78 Default value: 'name'.</p>
  79 </div><div class="long"><p>The name of the field to be displayed in the label.
  80 Default value: 'name'.</p>
  81 </div></div></div><div id="config-font" class="member ni"><a href="Ext.chart.Label.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.Label.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.
  82 Defautl value: "11px Helvetica, sans-serif".</p>
  83 </div><div class="long"><p>The font used for the labels.
  84 Defautl value: "11px Helvetica, sans-serif".</p>
  85 </div></div></div><div id="config-minMargin" class="member ni"><a href="Ext.chart.Label.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.Label.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.
  86 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.
  87 This parameter is useful when using PieSeries width variable pie slice lengths.
  88 Default value: 50.</p>
  89 </div></div></div><div id="config-orientation" class="member ni"><a href="Ext.chart.Label.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.Label.html#" rel="config-orientation" class="cls expand">orientation</a><span> : String</span></div><div class="description"><div class="short"><p>Either "horizontal" or "vertical".
  90 Dafault value: "horizontal".</p>
  91 </div><div class="long"><p>Either "horizontal" or "vertical".
  92 Dafault value: "horizontal".</p>
  93 </div></div></div><div id="config-renderer" class="member ni"><a href="Ext.chart.Label.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.Label.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.
  94 Default value: function(v) { return v; }</p>
  95 </div><div class="long"><p>Optional function for formatting the label into a displayable value.
  96 Default value: function(v) { return v; }</p>
  97 </div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>