123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261 |
- <!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-Label'>/**
- </span> * @class Ext.chart.Label
- *
- * Labels is a mixin to the Series class. Labels methods are implemented
- * in each of the Series (Pie, Bar, etc) for label creation and placement.
- *
- * The methods implemented by the Series are:
- *
- * - **`onCreateLabel(storeItem, item, i, display)`** Called each time a new label is created.
- * The arguments of the method are:
- * - *`storeItem`* The element of the store that is related to the label sprite.
- * - *`item`* The item related to the label sprite. An item is an object containing the position of the shape
- * used to describe the visualization and also pointing to the actual shape (circle, rectangle, path, etc).
- * - *`i`* The index of the element created (i.e the first created label, second created label, etc)
- * - *`display`* The display type. May be <b>false</b> if the label is hidden
- *
- * - **`onPlaceLabel(label, storeItem, item, i, display, animate)`** Called for updating the position of the label.
- * The arguments of the method are:
- * - *`label`* The sprite label.</li>
- * - *`storeItem`* The element of the store that is related to the label sprite</li>
- * - *`item`* The item related to the label sprite. An item is an object containing the position of the shape
- * used to describe the visualization and also pointing to the actual shape (circle, rectangle, path, etc).
- * - *`i`* The index of the element to be updated (i.e. whether it is the first, second, third from the labelGroup)
- * - *`display`* The display type. May be <b>false</b> if the label is hidden.
- * - *`animate`* A boolean value to set or unset animations for the labels.
- */
- Ext.define('Ext.chart.Label', {
- /* Begin Definitions */
- requires: ['Ext.draw.Color'],
- /* End Definitions */
- <span id='Ext-chart-Label-cfg-label'> /**
- </span> * @cfg {Object} label
- * Object with the following properties:
- *
- * - **display** : String
- *
- * Specifies the presence and position of labels for each pie slice. Either "rotate", "middle", "insideStart",
- * "insideEnd", "outside", "over", "under", or "none" to prevent label rendering.
- * Default value: 'none'.
- *
- * - **color** : String
- *
- * The color of the label text.
- * Default value: '#000' (black).
- *
- * - **contrast** : Boolean
- *
- * True to render the label in contrasting color with the backround.
- * Default value: false.
- *
- * - **field** : String
- *
- * The name of the field to be displayed in the label.
- * Default value: 'name'.
- *
- * - **minMargin** : Number
- *
- * Specifies the minimum distance from a label to the origin of the visualization.
- * This parameter is useful when using PieSeries width variable pie slice lengths.
- * Default value: 50.
- *
- * - **font** : String
- *
- * The font used for the labels.
- * Default value: "11px Helvetica, sans-serif".
- *
- * - **orientation** : String
- *
- * Either "horizontal" or "vertical".
- * Dafault value: "horizontal".
- *
- * - **renderer** : Function
- *
- * Optional function for formatting the label into a displayable value.
- * Default value: function(v) { return v; }
- */
- // @private a regex to parse url type colors.
- colorStringRe: /url\s*\(\s*#([^\/)]+)\s*\)/,
- // @private the mixin constructor. Used internally by Series.
- constructor: function(config) {
- var me = this;
- me.label = Ext.applyIf(me.label || {},
- {
- display: "none",
- color: "#000",
- field: "name",
- minMargin: 50,
- font: "11px Helvetica, sans-serif",
- orientation: "horizontal",
- renderer: function(v) {
- return v;
- }
- });
- if (me.label.display !== 'none') {
- me.labelsGroup = me.chart.surface.getGroup(me.seriesId + '-labels');
- }
- },
- // @private a method to render all labels in the labelGroup
- renderLabels: function() {
- var me = this,
- chart = me.chart,
- gradients = chart.gradients,
- items = me.items,
- animate = chart.animate,
- config = me.label,
- display = config.display,
- color = config.color,
- field = [].concat(config.field),
- group = me.labelsGroup,
- groupLength = (group || 0) && group.length,
- store = me.chart.getChartStore(),
- len = store.getCount(),
- itemLength = (items || 0) && items.length,
- ratio = itemLength / len,
- gradientsCount = (gradients || 0) && gradients.length,
- Color = Ext.draw.Color,
- hides = [],
- gradient, i, count, groupIndex, index, j, k, colorStopTotal, colorStopIndex, colorStop, item, label,
- storeItem, sprite, spriteColor, spriteBrightness, labelColor, colorString;
- if (display == 'none') {
- return;
- }
- // no items displayed, hide all labels
- if(itemLength == 0){
- while(groupLength--) {
- hides.push(groupLength);
- }
- } else {
- for (i = 0, count = 0, groupIndex = 0; i < len; i++) {
- index = 0;
- for (j = 0; j < ratio; j++) {
- item = items[count];
- label = group.getAt(groupIndex);
- storeItem = store.getAt(i);
- //check the excludes
- while(this.__excludes && this.__excludes[index]) {
- index++;
- }
- if (!item && label) {
- label.hide(true);
- groupIndex++;
- }
- if (item && field[j]) {
- if (!label) {
- label = me.onCreateLabel(storeItem, item, i, display, j, index);
- }
- me.onPlaceLabel(label, storeItem, item, i, display, animate, j, index);
- groupIndex++;
- //set contrast
- if (config.contrast && item.sprite) {
- sprite = item.sprite;
- //set the color string to the color to be set.
- if (sprite._endStyle) {
- colorString = sprite._endStyle.fill;
- }
- else if (sprite._to) {
- colorString = sprite._to.fill;
- }
- else {
- colorString = sprite.attr.fill;
- }
- colorString = colorString || sprite.attr.fill;
- spriteColor = Color.fromString(colorString);
- //color wasn't parsed property maybe because it's a gradient id
- if (colorString && !spriteColor) {
- colorString = colorString.match(me.colorStringRe)[1];
- for (k = 0; k < gradientsCount; k++) {
- gradient = gradients[k];
- if (gradient.id == colorString) {
- //avg color stops
- colorStop = 0; colorStopTotal = 0;
- for (colorStopIndex in gradient.stops) {
- colorStop++;
- colorStopTotal += Color.fromString(gradient.stops[colorStopIndex].color).getGrayscale();
- }
- spriteBrightness = (colorStopTotal / colorStop) / 255;
- break;
- }
- }
- }
- else {
- spriteBrightness = spriteColor.getGrayscale() / 255;
- }
- if (label.isOutside) {
- spriteBrightness = 1;
- }
- labelColor = Color.fromString(label.attr.color || label.attr.fill).getHSL();
- labelColor[2] = spriteBrightness > 0.5 ? 0.2 : 0.8;
- label.setAttributes({
- fill: String(Color.fromHSL.apply({}, labelColor))
- }, true);
- }
- }
- count++;
- index++;
- }
- }
- groupLength = group.length;
-
- while(groupLength > groupIndex){
- hides.push(groupIndex);
- groupIndex++;
- }
- }
- me.hideLabels(hides);
- },
- hideLabels: function(hides){
- var labelsGroup = this.labelsGroup,
- hlen = !!hides && hides.length;
- if (!labelsGroup) {
- return;
- }
- if (hlen === false) {
- hlen = labelsGroup.getCount();
- while (hlen--) {
- labelsGroup.getAt(hlen).hide(true);
- }
- } else {
- while(hlen--) {
- labelsGroup.getAt(hides[hlen]).hide(true);
- }
- }
- }
- });
- </pre>
- </body>
- </html>
|