echarts 3.6.1 → 3.7.2

package/lib/chart/treemap/treemapLayout.js

@@ -13,6 +13,11 @@
     var retrieveValue = zrUtil.retrieve;
     var each = zrUtil.each;
 
+    var PATH_BORDER_WIDTH = ['itemStyle', 'normal', 'borderWidth'];
+    var PATH_GAP_WIDTH = ['itemStyle', 'normal', 'gapWidth'];
+    var PATH_UPPER_LABEL_SHOW = ['upperLabel', 'normal', 'show'];
+    var PATH_UPPER_LABEL_HEIGHT = ['upperLabel', 'normal', 'height'];
+
     /**
      * @public
      */
@@ -92,7 +97,7 @@
                 each(viewAbovePath, function (node, index) {
                     var childValue = (viewAbovePath[index + 1] || viewRoot).getValue();
                     node.setLayout(zrUtil.extend(
-                        {dataExtent: [childValue, childValue], borderWidth: 0},
+                        {dataExtent: [childValue, childValue], borderWidth: 0, upperHeight: 0},
                         viewRootLayout
                     ));
                 });
@@ -146,16 +151,23 @@
         height = thisLayout.height;
 
         // Considering border and gap
-        var itemStyleModel = node.getModel('itemStyle.normal');
-        var borderWidth = itemStyleModel.get('borderWidth');
-        var halfGapWidth = itemStyleModel.get('gapWidth') / 2;
+        var nodeModel = node.getModel();
+        var borderWidth = nodeModel.get(PATH_BORDER_WIDTH);
+        var halfGapWidth = nodeModel.get(PATH_GAP_WIDTH) / 2;
+        var upperLabelHeight = getUpperLabelHeight(nodeModel);
+        var upperHeight = Math.max(borderWidth, upperLabelHeight);
         var layoutOffset = borderWidth - halfGapWidth;
+        var layoutOffsetUpper = upperHeight - halfGapWidth;
         var nodeModel = node.getModel();
 
-        node.setLayout({borderWidth: borderWidth}, true);
+        node.setLayout({
+            borderWidth: borderWidth,
+            upperHeight: upperHeight,
+            upperLabelHeight: upperLabelHeight
+        }, true);
 
         width = mathMax(width - 2 * layoutOffset, 0);
-        height = mathMax(height - 2 * layoutOffset, 0);
+        height = mathMax(height - layoutOffset - layoutOffsetUpper, 0);
 
         var totalArea = width * height;
         var viewChildren = initChildren(
@@ -166,7 +178,7 @@
             return;
         }
 
-        var rect = {x: layoutOffset, y: layoutOffset, width: width, height: height};
+        var rect = {x: layoutOffset, y: layoutOffsetUpper, width: width, height: height};
         var rowFixedLength = mathMin(width, height);
         var best = Infinity; // the best row score so far
         var row = [];
@@ -459,12 +471,12 @@
             }
             area *= sum / currNodeValue;
 
-            var borderWidth = parent.getModel('itemStyle.normal').get('borderWidth');
-
-            if (isFinite(borderWidth)) {
-                // Considering border, suppose aspect ratio is 1.
-                area += 4 * borderWidth * borderWidth + 4 * borderWidth * Math.pow(area, 0.5);
-            }
+            // Considering border, suppose aspect ratio is 1.
+            var parentModel = parent.getModel();
+            var borderWidth = parentModel.get(PATH_BORDER_WIDTH);
+            var upperHeight = Math.max(borderWidth, getUpperLabelHeight(parentModel, borderWidth));
+            area += 4 * borderWidth * borderWidth
+                + (3 * borderWidth + upperHeight) * Math.pow(area, 0.5);
 
             area > numberUtil.MAX_SAFE_INTEGER && (area = numberUtil.MAX_SAFE_INTEGER);
 
@@ -551,4 +563,8 @@
         });
     }
 
+    function getUpperLabelHeight(model) {
+        return model.get(PATH_UPPER_LABEL_SHOW) ? model.get(PATH_UPPER_LABEL_HEIGHT) : 0;
+    }
+
     module.exports = update;

package/lib/component/axis/AngleAxisView.js

@@ -105,8 +105,6 @@
             var categoryData = angleAxisModel.get('data');
 
             var labelModel = angleAxisModel.getModel('axisLabel');
-            var axisTextStyleModel = labelModel.getModel('textStyle');
-
             var labels = angleAxisModel.getFormattedLabels();
 
             var labelMargin = labelModel.get('margin');
@@ -121,27 +119,23 @@
 
                 var labelTextAlign = Math.abs(p[0] - cx) / r < 0.3
                     ? 'center' : (p[0] > cx ? 'left' : 'right');
-                var labelTextBaseline = Math.abs(p[1] - cy) / r < 0.3
+                var labelTextVerticalAlign = Math.abs(p[1] - cy) / r < 0.3
                     ? 'middle' : (p[1] > cy ? 'top' : 'bottom');
 
-                var textStyleModel = axisTextStyleModel;
                 if (categoryData && categoryData[i] && categoryData[i].textStyle) {
-                    textStyleModel = new Model(
-                        categoryData[i].textStyle, axisTextStyleModel
-                    );
+                    labelModel = new Model(categoryData[i].textStyle, labelModel, labelModel.ecModel);
                 }
-                this.group.add(new graphic.Text({
-                    style: {
-                        x: p[0],
-                        y: p[1],
-                        fill: textStyleModel.getTextColor() || angleAxisModel.get('axisLine.lineStyle.color'),
-                        text: labels[i],
-                        textAlign: labelTextAlign,
-                        textVerticalAlign: labelTextBaseline,
-                        textFont: textStyleModel.getFont()
-                    },
-                    silent: true
-                }));
+
+                var textEl = new graphic.Text({silent: true});
+                this.group.add(textEl);
+                graphic.setTextStyle(textEl.style, labelModel, {
+                    x: p[0],
+                    y: p[1],
+                    textFill: labelModel.getTextColor() || angleAxisModel.get('axisLine.lineStyle.color'),
+                    text: labels[i],
+                    textAlign: labelTextAlign,
+                    textVerticalAlign: labelTextVerticalAlign
+                });
             }
         },
 

package/lib/component/axis/AxisBuilder.js

@@ -49,7 +49,7 @@
      * @param {Object} opt Standard axis parameters.
      * @param {Array.<number>} opt.position [x, y]
      * @param {number} opt.rotation by radian
-     * @param {number} [opt.nameDirection=1] 1 or -1 Used when nameLocation is 'middle'.
+     * @param {number} [opt.nameDirection=1] 1 or -1 Used when nameLocation is 'middle' or 'center'.
      * @param {number} [opt.tickDirection=1] 1 or -1
      * @param {number} [opt.labelDirection=1] 1 or -1
      * @param {number} [opt.labelOffset=0] Usefull when onZero.
@@ -171,172 +171,14 @@
         /**
          * @private
          */
-        axisTick: function () {
+        axisTickLabel: function () {
             var axisModel = this.axisModel;
-            var axis = axisModel.axis;
-
-            if (!axisModel.get('axisTick.show') || axis.scale.isBlank()) {
-                return;
-            }
-
-            var tickModel = axisModel.getModel('axisTick');
-            var opt = this.opt;
-
-            var lineStyleModel = tickModel.getModel('lineStyle');
-            var tickLen = tickModel.get('length');
-
-            var tickInterval = getInterval(tickModel, opt.labelInterval);
-            var ticksCoords = axis.getTicksCoords(tickModel.get('alignWithLabel'));
-            var ticks = axis.scale.getTicks();
-
-            var pt1 = [];
-            var pt2 = [];
-            var matrix = this._transform;
-
-            for (var i = 0; i < ticksCoords.length; i++) {
-                // Only ordinal scale support tick interval
-                if (ifIgnoreOnTick(axis, i, tickInterval)) {
-                     continue;
-                }
-
-                var tickCoord = ticksCoords[i];
-
-                pt1[0] = tickCoord;
-                pt1[1] = 0;
-                pt2[0] = tickCoord;
-                pt2[1] = opt.tickDirection * tickLen;
-
-                if (matrix) {
-                    v2ApplyTransform(pt1, pt1, matrix);
-                    v2ApplyTransform(pt2, pt2, matrix);
-                }
-                // Tick line, Not use group transform to have better line draw
-                this.group.add(new graphic.Line(graphic.subPixelOptimizeLine({
-
-                    // Id for animation
-                    anid: 'tick_' + ticks[i],
-
-                    shape: {
-                        x1: pt1[0],
-                        y1: pt1[1],
-                        x2: pt2[0],
-                        y2: pt2[1]
-                    },
-                    style: zrUtil.defaults(
-                        lineStyleModel.getLineStyle(),
-                        {
-                            stroke: axisModel.get('axisLine.lineStyle.color')
-                        }
-                    ),
-                    z2: 2,
-                    silent: true
-                })));
-            }
-        },
-
-        /**
-         * @param {module:echarts/coord/cartesian/AxisModel} axisModel
-         * @param {module:echarts/coord/cartesian/GridModel} gridModel
-         * @private
-         */
-        axisLabel: function () {
             var opt = this.opt;
-            var axisModel = this.axisModel;
-            var axis = axisModel.axis;
-            var show = retrieve(opt.axisLabelShow, axisModel.get('axisLabel.show'));
-
-            if (!show || axis.scale.isBlank()) {
-                return;
-            }
-
-            var labelModel = axisModel.getModel('axisLabel');
-            var textStyleModel = labelModel.getModel('textStyle');
-            var labelMargin = labelModel.get('margin');
-            var ticks = axis.scale.getTicks();
-            var labels = axisModel.getFormattedLabels();
-
-            // Special label rotate.
-            var labelRotation = (
-                retrieve(opt.labelRotate, labelModel.get('rotate')) || 0
-            ) * PI / 180;
-
-            var labelLayout = innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
-            var categoryData = axisModel.get('data');
-
-            var textEls = [];
-            var silent = isSilent(axisModel);
-            var triggerEvent = axisModel.get('triggerEvent');
-
-            zrUtil.each(ticks, function (tickVal, index) {
-                if (ifIgnoreOnTick(axis, index, opt.labelInterval)) {
-                     return;
-                }
-
-                var itemTextStyleModel = textStyleModel;
-                if (categoryData && categoryData[tickVal] && categoryData[tickVal].textStyle) {
-                    itemTextStyleModel = new Model(
-                        categoryData[tickVal].textStyle, textStyleModel, axisModel.ecModel
-                    );
-                }
-                var textColor = itemTextStyleModel.getTextColor()
-                    || axisModel.get('axisLine.lineStyle.color');
-
-                var tickCoord = axis.dataToCoord(tickVal);
-                var pos = [
-                    tickCoord,
-                    opt.labelOffset + opt.labelDirection * labelMargin
-                ];
-                var labelStr = axis.scale.getLabel(tickVal);
-
-                var textEl = new graphic.Text({
-
-                    // Id for animation
-                    anid: 'label_' + tickVal,
-
-                    style: {
-                        text: labels[index],
-                        textAlign: itemTextStyleModel.get('align', true) || labelLayout.textAlign,
-                        textVerticalAlign: itemTextStyleModel.get('baseline', true) || labelLayout.textVerticalAlign,
-                        textFont: itemTextStyleModel.getFont(),
-                        fill: typeof textColor === 'function'
-                            ? textColor(
-                                // (1) In category axis with data zoom, tick is not the original
-                                // index of axis.data. So tick should not be exposed to user
-                                // in category axis.
-                                // (2) Compatible with previous version, which always returns labelStr.
-                                // But in interval scale labelStr is like '223,445', which maked
-                                // user repalce ','. So we modify it to return original val but remain
-                                // it as 'string' to avoid error in replacing.
-                                axis.type === 'category' ? labelStr : axis.type === 'value' ? tickVal + '' : tickVal,
-                                index
-                            )
-                            : textColor
-                    },
-                    position: pos,
-                    rotation: labelLayout.rotation,
-                    silent: silent,
-                    z2: 10
-                });
-
-                // Pack data for mouse event
-                if (triggerEvent) {
-                    textEl.eventData = makeAxisEventDataBase(axisModel);
-                    textEl.eventData.targetType = 'axisLabel';
-                    textEl.eventData.value = labelStr;
-                }
-
-                // FIXME
-                this._dumbGroup.add(textEl);
-                textEl.updateTransform();
-
-                textEls.push(textEl);
-                this.group.add(textEl);
 
-                textEl.decomposeTransform();
+            var tickEls = buildAxisTick(this, axisModel, opt);
+            var labelEls = buildAxisLabel(this, axisModel, opt);
 
-            }, this);
-
-            fixMinMaxLabelShow(axisModel, textEls);
+            fixMinMaxLabelShow(axisModel, labelEls, tickEls);
         },
 
         /**
@@ -365,7 +207,7 @@
                     ? extent[1] + gapSignal * gap
                     : (extent[0] + extent[1]) / 2, // 'middle'
                 // Reuse labelOffset.
-                nameLocation === 'middle' ? opt.labelOffset + nameDirection * gap : 0
+                isNameLocationCenter(nameLocation) ? opt.labelOffset + nameDirection * gap : 0
             ];
 
             var labelLayout;
@@ -377,7 +219,7 @@
 
             var axisNameAvailableWidth;
 
-            if (nameLocation === 'middle') {
+            if (isNameLocationCenter(nameLocation)) {
                 labelLayout = innerTextLayout(
                     opt.rotation,
                     nameRotation != null ? nameRotation : opt.rotation, // Adapt to axis.
@@ -405,6 +247,8 @@
             var maxWidth = retrieve(
                 opt.nameTruncateMaxWidth, truncateOpt.maxWidth, axisNameAvailableWidth
             );
+            // FIXME
+            // truncate rich text? (consider performance)
             var truncatedText = (ellipsis != null && maxWidth != null)
                 ? formatUtil.truncateText(
                     name, maxWidth, textFont, ellipsis,
@@ -423,21 +267,12 @@
             formatterParams[mainType + 'Index'] = axisModel.componentIndex;
 
             var textEl = new graphic.Text({
-
                 // Id for animation
                 anid: 'name',
 
                 __fullText: name,
                 __truncatedText: truncatedText,
 
-                style: {
-                    text: truncatedText,
-                    textFont: textFont,
-                    fill: textStyleModel.getTextColor()
-                        || axisModel.get('axisLine.lineStyle.color'),
-                    textAlign: labelLayout.textAlign,
-                    textVerticalAlign: labelLayout.textVerticalAlign
-                },
                 position: pos,
                 rotation: labelLayout.rotation,
                 silent: isSilent(axisModel),
@@ -453,6 +288,15 @@
                     : null
             });
 
+            graphic.setTextStyle(textEl.style, textStyleModel, {
+                text: truncatedText,
+                textFont: textFont,
+                textFill: textStyleModel.getTextColor()
+                    || axisModel.get('axisLine.lineStyle.color'),
+                textAlign: labelLayout.textAlign,
+                textVerticalAlign: labelLayout.textVerticalAlign
+            });
+
             if (axisModel.get('triggerEvent')) {
                 textEl.eventData = makeAxisEventDataBase(axisModel);
                 textEl.eventData.targetType = 'axisName';
@@ -556,32 +400,64 @@
             );
     }
 
-    function fixMinMaxLabelShow(axisModel, textEls) {
+    function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
         // If min or max are user set, we need to check
         // If the tick on min(max) are overlap on their neighbour tick
         // If they are overlapped, we need to hide the min(max) tick label
         var showMinLabel = axisModel.get('axisLabel.showMinLabel');
         var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');
-        var firstLabel = textEls[0];
-        var nextLabel = textEls[1];
-        var lastLabel = textEls[textEls.length - 1];
-        var prevLabel = textEls[textEls.length - 2];
+
+        // FIXME
+        // Have not consider onBand yet, where tick els is more than label els.
+
+        labelEls = labelEls || [];
+        tickEls = tickEls || [];
+
+        var firstLabel = labelEls[0];
+        var nextLabel = labelEls[1];
+        var lastLabel = labelEls[labelEls.length - 1];
+        var prevLabel = labelEls[labelEls.length - 2];
+
+        var firstTick = tickEls[0];
+        var nextTick = tickEls[1];
+        var lastTick = tickEls[tickEls.length - 1];
+        var prevTick = tickEls[tickEls.length - 2];
 
         if (showMinLabel === false) {
-            firstLabel.ignore = true;
+            ignoreEl(firstLabel);
+            ignoreEl(firstTick);
         }
-        else if (axisModel.getMin() != null && isTwoLabelOverlapped(firstLabel, nextLabel)) {
-            showMinLabel ? (nextLabel.ignore = true) : (firstLabel.ignore = true);
+        else if (isTwoLabelOverlapped(firstLabel, nextLabel)) {
+            if (showMinLabel) {
+                ignoreEl(nextLabel);
+                ignoreEl(nextTick);
+            }
+            else {
+                ignoreEl(firstLabel);
+                ignoreEl(firstTick);
+            }
         }
 
         if (showMaxLabel === false) {
-            lastLabel.ignore = true;
+            ignoreEl(lastLabel);
+            ignoreEl(lastTick);
         }
-        else if (axisModel.getMax() != null && isTwoLabelOverlapped(prevLabel, lastLabel)) {
-            showMaxLabel ? (prevLabel.ignore = true) : (lastLabel.ignore = true);
+        else if (isTwoLabelOverlapped(prevLabel, lastLabel)) {
+            if (showMaxLabel) {
+                ignoreEl(prevLabel);
+                ignoreEl(prevTick);
+            }
+            else {
+                ignoreEl(lastLabel);
+                ignoreEl(lastTick);
+            }
         }
     }
 
+    function ignoreEl(el) {
+        el && (el.ignore = true);
+    }
+
     function isTwoLabelOverlapped(current, next, labelLayout) {
         // current and next has the same rotation.
         var firstRect = current && current.getBoundingRect().clone();
@@ -602,11 +478,28 @@
         return firstRect.intersect(nextRect);
     }
 
+    function isNameLocationCenter(nameLocation) {
+        return nameLocation === 'middle' || nameLocation === 'center';
+    }
 
     /**
      * @static
      */
-    var ifIgnoreOnTick = AxisBuilder.ifIgnoreOnTick = function (axis, i, interval) {
+    var ifIgnoreOnTick = AxisBuilder.ifIgnoreOnTick = function (
+        axis,
+        i,
+        interval,
+        ticksCnt,
+        showMinLabel,
+        showMaxLabel
+    ) {
+        if (i === 0 && showMinLabel || i === ticksCnt - 1 && showMaxLabel) {
+            return false;
+        }
+
+        // FIXME
+        // Have not consider label overlap (if label is too long) yet.
+
         var rawTick;
         var scale = axis.scale;
         return scale.type === 'ordinal'
@@ -631,5 +524,186 @@
         return interval;
     };
 
+    function buildAxisTick(axisBuilder, axisModel, opt) {
+        var axis = axisModel.axis;
+
+        if (!axisModel.get('axisTick.show') || axis.scale.isBlank()) {
+            return;
+        }
+
+        var tickModel = axisModel.getModel('axisTick');
+
+        var lineStyleModel = tickModel.getModel('lineStyle');
+        var tickLen = tickModel.get('length');
+
+        var tickInterval = getInterval(tickModel, opt.labelInterval);
+        var ticksCoords = axis.getTicksCoords(tickModel.get('alignWithLabel'));
+        // FIXME
+        // Corresponds to ticksCoords ?
+        var ticks = axis.scale.getTicks();
+
+        var showMinLabel = axisModel.get('axisLabel.showMinLabel');
+        var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');
+
+        var pt1 = [];
+        var pt2 = [];
+        var matrix = axisBuilder._transform;
+
+        var tickEls = [];
+
+        var ticksCnt = ticksCoords.length;
+        for (var i = 0; i < ticksCnt; i++) {
+            // Only ordinal scale support tick interval
+            if (ifIgnoreOnTick(
+                axis, i, tickInterval, ticksCnt,
+                showMinLabel, showMaxLabel
+            )) {
+                continue;
+            }
+
+            var tickCoord = ticksCoords[i];
+
+            pt1[0] = tickCoord;
+            pt1[1] = 0;
+            pt2[0] = tickCoord;
+            pt2[1] = opt.tickDirection * tickLen;
+
+            if (matrix) {
+                v2ApplyTransform(pt1, pt1, matrix);
+                v2ApplyTransform(pt2, pt2, matrix);
+            }
+            // Tick line, Not use group transform to have better line draw
+            var tickEl = new graphic.Line(graphic.subPixelOptimizeLine({
+                // Id for animation
+                anid: 'tick_' + ticks[i],
+
+                shape: {
+                    x1: pt1[0],
+                    y1: pt1[1],
+                    x2: pt2[0],
+                    y2: pt2[1]
+                },
+                style: zrUtil.defaults(
+                    lineStyleModel.getLineStyle(),
+                    {
+                        stroke: axisModel.get('axisLine.lineStyle.color')
+                    }
+                ),
+                z2: 2,
+                silent: true
+            }));
+            axisBuilder.group.add(tickEl);
+            tickEls.push(tickEl);
+        }
+
+        return tickEls;
+    }
+
+    function buildAxisLabel(axisBuilder, axisModel, opt) {
+        var axis = axisModel.axis;
+        var show = retrieve(opt.axisLabelShow, axisModel.get('axisLabel.show'));
+
+        if (!show || axis.scale.isBlank()) {
+            return;
+        }
+
+        var labelModel = axisModel.getModel('axisLabel');
+        var labelMargin = labelModel.get('margin');
+        var ticks = axis.scale.getTicks();
+        var labels = axisModel.getFormattedLabels();
+
+        // Special label rotate.
+        var labelRotation = (
+            retrieve(opt.labelRotate, labelModel.get('rotate')) || 0
+        ) * PI / 180;
+
+        var labelLayout = innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
+        var categoryData = axisModel.get('data');
+
+        var labelEls = [];
+        var silent = isSilent(axisModel);
+        var triggerEvent = axisModel.get('triggerEvent');
+
+        var showMinLabel = axisModel.get('axisLabel.showMinLabel');
+        var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');
+
+        zrUtil.each(ticks, function (tickVal, index) {
+            if (ifIgnoreOnTick(
+                axis, index, opt.labelInterval, ticks.length,
+                showMinLabel, showMaxLabel
+            )) {
+                    return;
+            }
+
+            var itemLabelModel = labelModel;
+            if (categoryData && categoryData[tickVal] && categoryData[tickVal].textStyle) {
+                itemLabelModel = new Model(
+                    categoryData[tickVal].textStyle, labelModel, axisModel.ecModel
+                );
+            }
+
+            var textColor = itemLabelModel.getTextColor()
+                || axisModel.get('axisLine.lineStyle.color');
+
+            var tickCoord = axis.dataToCoord(tickVal);
+            var pos = [
+                tickCoord,
+                opt.labelOffset + opt.labelDirection * labelMargin
+            ];
+            var labelStr = axis.scale.getLabel(tickVal);
+
+            var textEl = new graphic.Text({
+                // Id for animation
+                anid: 'label_' + tickVal,
+                position: pos,
+                rotation: labelLayout.rotation,
+                silent: silent,
+                z2: 10
+            });
+
+            graphic.setTextStyle(textEl.style, itemLabelModel, {
+                text: labels[index],
+                textAlign: itemLabelModel.getShallow('align', true)
+                    || labelLayout.textAlign,
+                textVerticalAlign: itemLabelModel.getShallow('verticalAlign', true)
+                    || itemLabelModel.getShallow('baseline', true)
+                    || labelLayout.textVerticalAlign,
+                textFill: typeof textColor === 'function'
+                    ? textColor(
+                        // (1) In category axis with data zoom, tick is not the original
+                        // index of axis.data. So tick should not be exposed to user
+                        // in category axis.
+                        // (2) Compatible with previous version, which always returns labelStr.
+                        // But in interval scale labelStr is like '223,445', which maked
+                        // user repalce ','. So we modify it to return original val but remain
+                        // it as 'string' to avoid error in replacing.
+                        axis.type === 'category' ? labelStr : axis.type === 'value' ? tickVal + '' : tickVal,
+                        index
+                    )
+                    : textColor
+            });
+
+            // Pack data for mouse event
+            if (triggerEvent) {
+                textEl.eventData = makeAxisEventDataBase(axisModel);
+                textEl.eventData.targetType = 'axisLabel';
+                textEl.eventData.value = labelStr;
+            }
+
+            // FIXME
+            axisBuilder._dumbGroup.add(textEl);
+            textEl.updateTransform();
+
+            labelEls.push(textEl);
+            axisBuilder.group.add(textEl);
+
+            textEl.decomposeTransform();
+
+        });
+
+        return labelEls;
+    }
+
+
     module.exports = AxisBuilder;