| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160 | <!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-Callout'>/**</span> * @class Ext.chart.Callout * A mixin providing callout functionality for Ext.chart.series.Series. */Ext.define('Ext.chart.Callout', {    /* Begin Definitions */    /* End Definitions */    constructor: function(config) {        if (config.callouts) {            config.callouts.styles = Ext.applyIf(config.callouts.styles || {}, {                color: "#000",                font: "11px Helvetica, sans-serif"            });            this.callouts = Ext.apply(this.callouts || {}, config.callouts);            this.calloutsArray = [];        }    },    renderCallouts: function() {        if (!this.callouts) {            return;        }        var me = this,            items = me.items,            animate = me.chart.animate,            config = me.callouts,            styles = config.styles,            group = me.calloutsArray,            store = me.chart.store,            len = store.getCount(),            ratio = items.length / len,            previouslyPlacedCallouts = [],            i,            count,            j,            p,            item,            label,            storeItem,            display;                    for (i = 0, count = 0; i < len; i++) {            for (j = 0; j < ratio; j++) {                item = items[count];                label = group[count];                storeItem = store.getAt(i);                                display = config.filter(storeItem);                                if (!display && !label) {                    count++;                    continue;                               }                                if (!label) {                    group[count] = label = me.onCreateCallout(storeItem, item, i, display, j, count);                }                for (p in label) {                    if (label[p] && label[p].setAttributes) {                        label[p].setAttributes(styles, true);                    }                }                if (!display) {                    for (p in label) {                        if (label[p]) {                            if (label[p].setAttributes) {                                label[p].setAttributes({                                    hidden: true                                }, true);                            } else if(label[p].setVisible) {                                label[p].setVisible(false);                            }                        }                    }                }                config.renderer(label, storeItem);                me.onPlaceCallout(label, storeItem, item, i, display, animate,                                  j, count, previouslyPlacedCallouts);                previouslyPlacedCallouts.push(label);                count++;            }        }        this.hideCallouts(count);    },    onCreateCallout: function(storeItem, item, i, display) {        var me = this,            group = me.calloutsGroup,            config = me.callouts,            styles = config.styles,            width = styles.width,            height = styles.height,            chart = me.chart,            surface = chart.surface,            calloutObj = {                //label: false,                //box: false,                lines: false            };        calloutObj.lines = surface.add(Ext.apply({},        {            type: 'path',            path: 'M0,0',            stroke: me.getLegendColor() || '#555'        },        styles));        if (config.items) {            calloutObj.panel = new Ext.Panel({                style: "position: absolute;",                    width: width,                height: height,                items: config.items,                renderTo: chart.el            });        }        return calloutObj;    },    hideCallouts: function(index) {        var calloutsArray = this.calloutsArray,            len = calloutsArray.length,            co,            p;        while (len-->index) {            co = calloutsArray[len];            for (p in co) {                if (co[p]) {                    co[p].hide(true);                }            }        }    }});</pre></body></html>
 |