evui 3.4.112 → 3.4.114

package/dist/evui.common.js

@@ -11164,7 +11164,7 @@ module.exports = exports;
 /***/ "9224":
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"a\":\"3.4.112\"}");
+module.exports = JSON.parse("{\"a\":\"3.4.114\"}");
 
 /***/ }),
 
@@ -38820,9 +38820,9 @@ var modules = {
 
             if (series && sData) {
               if (series.isExistGrp && series.stackIndex && !series.isOverlapping) {
-                series.data = _this.addSeriesStackDS(sData, label, series.bsIds, series.stackIndex, series.interpolation);
+                series.data = _this.addSeriesStackDS(sData, label, series.bsIds, series.stackIndex);
               } else {
-                series.data = _this.addSeriesDS(sData, label, series.isExistGrp, series.interpolation);
+                series.data = _this.addSeriesDS(sData, label, series.isExistGrp);
               }
 
               series.minMax = _this.getSeriesMinMax(series.data);
@@ -39209,17 +39209,13 @@ var modules = {
    * @param {object}  label   chart label
    * @param {array}   bsIds   stacked base data ID List
    * @param {number}  sIdx    series ordered index
-   * @param {import('./index').InterpolationType}  interpolation   interpolation type
    *
-   * @typedef {import('./index').ChartSeriesDataPoint} ChartSeriesDataPoint
-   *
-   * @returns {ChartSeriesDataPoint[]} data for each series
+   * @returns {array} data for each series
    */
   addSeriesStackDS: function addSeriesStackDS(data, label, bsIds) {
     var _this4 = this;
 
     var sIdx = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-    var interpolation = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'none';
     var isHorizontal = this.options.horizontal;
     var sdata = [];
 
@@ -39266,14 +39262,15 @@ var modules = {
           if (oData != null) {
             gdata = bdata + oData;
           } else {
-            gdata = odata;
+            gdata = null;
+            bdata = 0;
           }
         } else {
           bdata = 0;
           gdata = oData;
         }
 
-        sdata.push(_this4.addData(gdata, ldata, odata, bdata, interpolation));
+        sdata.push(_this4.addData(gdata, ldata, odata, bdata));
       }
     });
     return sdata;
@@ -39284,17 +39281,13 @@ var modules = {
    * @param {object}  data    chart series info
    * @param {object}  label   chart label
    * @param {boolean}  isBase   is Base(bottommost) series at stack chart
-   * @param {import('./index').InterpolationType}  interpolation   interpolation type
-   *
-   * @typedef {import('./index').ChartSeriesDataPoint} ChartSeriesDataPoint
    *
-   * @returns {ChartSeriesDataPoint[]} data for each series
+   * @returns {array} data for each series
    */
   addSeriesDS: function addSeriesDS(data, label, isBase) {
     var _this$seriesList$Obje,
         _this5 = this;
 
-    var interpolation = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'none';
     var isHorizontal = this.options.horizontal;
     var sdata = [];
     var passingValue = (_this$seriesList$Obje = this.seriesList[Object.keys(this.seriesList)[0]]) === null || _this$seriesList$Obje === void 0 ? void 0 : _this$seriesList$Obje.passingValue;
@@ -39309,7 +39302,7 @@ var modules = {
 
       if (ldata !== null) {
         var isPassingValueWithStack = isBase && !helpers_util.isNullOrUndefined(passingValue) && gdata === passingValue;
-        sdata.push(_this5.addData(isPassingValueWithStack ? 0 : gdata, ldata, gdata, null, interpolation));
+        sdata.push(_this5.addData(isPassingValueWithStack ? 0 : gdata, ldata, gdata));
       }
     });
     return sdata;
@@ -39366,18 +39359,13 @@ var modules = {
    * @param {object}  ldata    label data (x-axis value for vertical chart)
    * @param {object}  odata    original data (without stacked value)
    * @param {object}  bdata    base data (stacked value)
-   * @param {import('./index').InterpolationType}  interpolation   interpolation type
-   *
-   * @typedef {import('./index').ChartSeriesDataPoint} ChartSeriesDataPoint
-   *
-   * @returns {ChartSeriesDataPoint} data for each graph point
+    * @returns {object} data for each graph point
    */
   addData: function addData(gdata, ldata) {
     var _gdataColor;
 
     var odata = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
     var bdata = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
-    var interpolation = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'none';
     var data;
     var gdataValue = null;
     var odataValue = null;
@@ -39390,7 +39378,7 @@ var modules = {
       gdataColor = gdata.color;
       dataTextColor = gdata.textColor;
     } else {
-      gdataValue = interpolation === 'zero' && !gdata ? bdata !== null && bdata !== void 0 ? bdata : 0 : gdata !== null && gdata !== void 0 ? gdata : null;
+      gdataValue = gdata !== null && gdata !== void 0 ? gdata : null;
     }
 
     if (odata !== null && _typeof(odata) === 'object') {
@@ -39947,18 +39935,12 @@ var modules = {
     return result;
   },
 
-  /**
-   * @typedef {Object} LabelInfoResult
-   * @property {number} labelIndex - 선택된 라벨의 인덱스
-   * @property {object} hitInfo - 해당 위치에서의 히트 정보 (getItemByPosition 반환값)
-   */
-
   /**
    * Find label info by position x and y
    * @param {array}   offset          position x and y
    * @param {string | null}  targetAxis    target Axis Location ('xAxis', 'yAxis' , null)
    *
-   * @returns {LabelInfoResult} clicked label information
+   * @returns {object} clicked label information
    */
   getLabelInfoByPosition: function getLabelInfoByPosition(offset, targetAxis) {
     var _Object$values$sort$, _Object$values$sort$2, _scrollbarOpt, _scale, _scale$labels, _scale3, _scale3$labels;
@@ -40065,14 +40047,11 @@ var modules = {
 
   /**
    * Get current mouse target label value in label array or calculated using mouse position
-   *
-   * @typedef {import('./index').MouseLabelValue} MouseLabelValue
-   *
    * @param {string}   targetAxis          target Axis Location ('xAxis', 'yAxis')
    * @param {array}  offset    return value from getMousePosition()
    * @param {number}  labelIndex
    *
-   * @returns {MouseLabelValue} current mouse target label value
+   * @returns {object} current mouse target label value
    */
   getCurMouseLabelVal: function getCurMouseLabelVal(targetAxis, offset, labelIndex) {
     var _this9 = this;
@@ -41102,57 +41081,6 @@ var defaultsDeep = _baseRest(function(args) {
 
 /* harmony default export */ var lodash_es_defaultsDeep = (defaultsDeep);
 
-// CONCATENATED MODULE: ./node_modules/lodash-es/isUndefined.js
-/**
- * Checks if `value` is `undefined`.
- *
- * @static
- * @since 0.1.0
- * @memberOf _
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is `undefined`, else `false`.
- * @example
- *
- * _.isUndefined(void 0);
- * // => true
- *
- * _.isUndefined(null);
- * // => false
- */
-function isUndefined(value) {
-  return value === undefined;
-}
-
-/* harmony default export */ var lodash_es_isUndefined = (isUndefined);
-
-// CONCATENATED MODULE: ./node_modules/lodash-es/isNil.js
-/**
- * Checks if `value` is `null` or `undefined`.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is nullish, else `false`.
- * @example
- *
- * _.isNil(null);
- * // => true
- *
- * _.isNil(void 0);
- * // => true
- *
- * _.isNil(NaN);
- * // => false
- */
-function isNil(value) {
-  return value == null;
-}
-
-/* harmony default export */ var lodash_es_isNil = (isNil);
-
 // CONCATENATED MODULE: ./src/components/chart/helpers/helpers.constant.js
 var AXIS_UNITS = {
   x: {
@@ -41200,8 +41128,7 @@ var LINE_OPTION = {
   fill: false,
   fillOpacity: 0.4,
   showLegend: true,
-  passingValue: null,
-  interpolation: 'none'
+  passingValue: null
 };
 var BAR_OPTION = {
   show: true,
@@ -41388,13 +41315,13 @@ var TIME_INTERVALS = {
 /* harmony default export */ var helpers_canvas = ({
   /**
    * Calculate X position
-   * @param {number|null|undefined}    value         graph value
+   * @param {any}    value         graph value
    * @param {number} min           min value
    * @param {number} max           max value
    * @param {number} area          height for axis
    * @param {number} startPoint    startPoint
    *
-   * @returns {number|null} position
+   * @returns {any} position
    */
   calculateX: function calculateX(value, min, max, area) {
     var startPoint = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
@@ -41434,13 +41361,13 @@ var TIME_INTERVALS = {
 
   /**
    * Calculate Y position
-   * @param {number|null|undefined}    value         graph value
+   * @param {any}    value         graph value
    * @param {number} min           min value
    * @param {number} max           max value
    * @param {number} area          height for axis
    * @param {number} startPoint    startPoint
    *
-   * @returns {number|null} position
+   * @returns {any} position
    */
   calculateY: function calculateY(value, min, max, area) {
     var startPoint = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
@@ -41688,6 +41615,7 @@ var TIME_INTERVALS = {
 
 
 
+
 var element_line_Line = /*#__PURE__*/function () {
   function Line(sId, opt, sIdx) {
     var _this = this;
@@ -41724,8 +41652,6 @@ var element_line_Line = /*#__PURE__*/function () {
         lineWidth: 2
       }
     };
-    /** @type {import('../model/index').ChartSeriesDataPoint[]} */
-
     this.data = [];
     this.beforeMouseXp = 0;
     this.beforeMouseYp = 0;
@@ -41733,23 +41659,11 @@ var element_line_Line = /*#__PURE__*/function () {
     this.size = {
       comboOffset: 0
     };
-    this.usePassingValue = !lodash_es_isUndefined(this.passingValue) && this.interpolation === 'linear';
+    this.usePassingValue = !!this.passingValue;
   }
-  /**
-   * @typedef {Object} LineDrawParam
-   * @property {CanvasRenderingContext2D} ctx - 캔버스 렌더링 컨텍스트
-   * @property {object} chartRect - 차트 영역 정보
-   * @property {object} labelOffset - 라벨 오프셋 정보
-   * @property {object} axesSteps - 축 스텝 정보
-   * @property {object} [selectLabel] - 선택된 라벨 정보
-   * @property {object} [selectSeries] - 선택된 시리즈 정보
-   * @property {object} [legendHitInfo] - 범례 히트 정보
-   * @property {boolean} [isBrush] - 브러시 사용 여부
-   */
-
   /**
    * Draw series data
-   * @param {LineDrawParam} param     object for drawing series data
+   * @param {object} param     object for drawing series data
    *
    * @returns {undefined}
    */
@@ -41818,6 +41732,8 @@ var element_line_Line = /*#__PURE__*/function () {
       }
 
       var endPoint = chartRect.y2 - labelOffset.bottom;
+      var x;
+      var y;
       var barAreaByCombo = 0;
       var minmaxX = axesSteps.x[this.xAxisIndex];
       var minmaxY = axesSteps.y[this.yAxisIndex];
@@ -41842,40 +41758,51 @@ var element_line_Line = /*#__PURE__*/function () {
       }; // draw line
 
 
-      var prevValid;
-      this.data.forEach(function (curr) {
-        var _prevValid, _prevValid2, _prevValid3;
-
-        var x = getXPos(curr.x);
-        var y = getYPos(curr.y);
-
-        if (_this2.isExistGrp && _this2.usePassingValue && curr.o === _this2.passingValue) {
-          var _curr$b;
-
-          y = getYPos((_curr$b = curr.b) !== null && _curr$b !== void 0 ? _curr$b : 0);
-        }
+      var needCutoff = false;
+      this.data.reduce(function (prev, curr) {
+        x = getXPos(curr.x);
+        y = getYPos(curr.y);
 
         if (x !== null) {
           x += helpers_util.aliasPixel(x);
         }
 
-        curr.xp = x;
-        curr.yp = y;
+        if (_this2.usePassingValue) {
+          if (curr.o === _this2.passingValue) {
+            y = getYPos(prev.y);
 
-        if (_this2.usePassingValue && curr.o === _this2.passingValue) {
-          if (!_this2.isExistGrp) {
-            return;
+            if (prev.o === null) {
+              needCutoff = true;
+            }
+
+            if (_this2.isExistGrp && !needCutoff) {
+              var _curr$b;
+
+              y = getYPos((_curr$b = curr.b) !== null && _curr$b !== void 0 ? _curr$b : 0);
+              ctx.lineTo(x, y);
+            }
+
+            curr.xp = x;
+            curr.yp = y;
+            return curr;
           }
         }
 
-        if (lodash_es_isNil((_prevValid = prevValid) === null || _prevValid === void 0 ? void 0 : _prevValid.y) && _this2.usePassingValue && _this2.passingValue !== ((_prevValid2 = prevValid) === null || _prevValid2 === void 0 ? void 0 : _prevValid2.o) || !_this2.usePassingValue && lodash_es_isNil(curr.o) && _this2.interpolation !== 'zero' || !_this2.usePassingValue && lodash_es_isNil((_prevValid3 = prevValid) === null || _prevValid3 === void 0 ? void 0 : _prevValid3.y) || lodash_es_isNil(curr.o) && curr.y == null && _this2.passingValue !== curr.o) {
+        var isNullValue = helpers_util.isNullOrUndefined(prev.o) || helpers_util.isNullOrUndefined(curr.o) || helpers_util.isNullOrUndefined(curr.x) || helpers_util.isNullOrUndefined(curr.y);
+
+        if (isNullValue || needCutoff) {
           ctx.moveTo(x, y);
+          needCutoff = false;
         } else {
           ctx.lineTo(x, y);
         }
 
-        prevValid = curr;
-      });
+        curr.xp = x; // eslint-disable-line
+
+        curr.yp = y; // eslint-disable-line
+
+        return curr;
+      }, this.data[0]);
       ctx.stroke();
 
       if (this.segments) {
@@ -41915,24 +41842,20 @@ var element_line_Line = /*#__PURE__*/function () {
         var valueArray = this.data.map(function (item) {
           return item === null || item === void 0 ? void 0 : item.o;
         });
-        /** @type {Array<[number, number]>} */
-
         var needFillDataIndexList = [];
 
         for (var i = 0; i < valueArray.length + 1; i++) {
-          var isNoneInterpolation = this.interpolation === 'none' || this.usePassingValue && this.passingValue !== null;
-
-          if (isNoneInterpolation ? lodash_es_isNil(valueArray[i]) : lodash_es_isUndefined(valueArray[i])) {
+          if (helpers_util.isNullOrUndefined(valueArray[i])) {
             if (start !== null && end !== null) {
               var temp = valueArray.slice(start, i);
               var lastNormalValueIndex = temp.findLastIndex(function (item) {
-                return !lodash_es_isNil(item) && item !== _this2.passingValue;
+                return item !== helpers_util.isNullOrUndefined(item) && item !== _this2.passingValue;
               });
               needFillDataIndexList.push([start, start + lastNormalValueIndex]);
               start = null;
               end = null;
             }
-          } else if (this.usePassingValue && valueArray[i] === this.passingValue) {
+          } else if (valueArray[i] === this.passingValue) {
             end = i;
           } else {
             start = start === null ? i : start;
@@ -41962,7 +41885,7 @@ var element_line_Line = /*#__PURE__*/function () {
 
             if (ix === startIndex) {
               ctx.moveTo(currData.xp, currData.yp);
-            } else if (_this2.isExistGrp || _this2.passingValue !== currData.o || _this2.interpolation === 'zero' && lodash_es_isNil(currData.o)) {
+            } else if (_this2.isExistGrp || _this2.passingValue !== currData.o) {
               ctx.lineTo(currData.xp, currData.yp);
             }
 
@@ -41995,7 +41918,7 @@ var element_line_Line = /*#__PURE__*/function () {
             return;
           }
 
-          var isSingle = _this2.interpolation === 'none' && helpers_util.isNullOrUndefined((_this2$data = _this2.data[ix - 1]) === null || _this2$data === void 0 ? void 0 : _this2$data.o) && helpers_util.isNullOrUndefined((_this2$data2 = _this2.data[ix + 1]) === null || _this2$data2 === void 0 ? void 0 : _this2$data2.o);
+          var isSingle = helpers_util.isNullOrUndefined((_this2$data = _this2.data[ix - 1]) === null || _this2$data === void 0 ? void 0 : _this2$data.o) && helpers_util.isNullOrUndefined((_this2$data2 = _this2.data[ix + 1]) === null || _this2$data2 === void 0 ? void 0 : _this2$data2.o);
           var isSelectedLabel = selectedLabelIndexList.includes(ix);
 
           if (_this2.point || isSingle || isSelectedLabel) {
@@ -42992,7 +42915,7 @@ var element_bar_Bar = /*#__PURE__*/function () {
 
         if (sx <= xp && xp <= ex) {
           item.data = gdata[m];
-          item.index = m;
+          item.index = gdata[m].index; // 원본 데이터 인덱스 사용
 
           if (ey <= yp && yp <= sy) {
             item.hit = true;
@@ -43041,7 +42964,7 @@ var element_bar_Bar = /*#__PURE__*/function () {
 
         if (ey <= yp && yp <= sy) {
           item.data = gdata[m];
-          item.index = m;
+          item.index = gdata[m].index; // 원본 데이터 인덱스 사용
 
           if (sx <= xp && xp <= ex) {
             item.hit = true;
@@ -44819,47 +44742,6 @@ var model_series_modules = {
   Store: model_store,
   Series: model_series
 });
-/**
- * @typedef {Object} ChartDOMSize
- * @property {number} width - 차트 DOM의 너비
- * @property {number} height - 차트 DOM의 높이
- */
-
-/**
- * @typedef {Object} ChartRect
- * @property {number} x1 - 차트 영역의 시작 X 좌표
- * @property {number} x2 - 차트 영역의 끝 X 좌표
- * @property {number} y1 - 차트 영역의 시작 Y 좌표
- * @property {number} y2 - 차트 영역의 끝 Y 좌표
- * @property {number} chartWidth - 실제 차트 그리기 영역의 너비
- * @property {number} chartHeight - 실제 차트 그리기 영역의 높이
- * @property {number} width - 전체 차트 컨테이너의 너비
- * @property {number} height - 전체 차트 컨테이너의 높이
- */
-
-/**
-* @typedef {Object} MouseLabelValue
-* @property {string|number} labelVal - 마우스 위치에 해당하는 라벨 값
-* @property {number} labelIdx - 라벨 인덱스 (없으면 -1)
-*/
-
-/**
-* @typedef {Object} ChartSeriesDataPoint
-* @property {number|null} x - x축 값 또는 라벨
-* @property {number|null} y - y축 값 또는 데이터 값
-* @property {number|null} o - 원본 데이터 값
-* @property {number|null} b - 스택형 차트의 베이스 값
-* @property {number|null} xp - x좌표 위치(픽셀 등)
-* @property {number|null} yp - y좌표 위치(픽셀 등)
-* @property {number|null} w - 너비
-* @property {number|null} h - 높이
-* @property {string|null} dataColor - 데이터 색상
-* @property {string|null} dataTextColor - 텍스트 색상
-*/
-
-/**
- * @typedef {'none' | 'linear' | 'zero'} InterpolationType
- */
 // CONCATENATED MODULE: ./src/components/chart/scale/scale.js
 
 
@@ -51346,7 +51228,7 @@ var plugins_interaction_modules = {
         if (item !== null && item !== void 0 && item.data) {
           var gdata = void 0;
 
-          if (item.data.o === null && series.interpolation !== 'zero') {
+          if (item.data.o === null) {
             if (!series.isExistGrp) {
               gdata = isHorizontal ? item.data.x : item.data.y;
             }
@@ -54009,6 +53891,7 @@ var element_tip_modules = {
 
 
 
+
 
 
 var chart_core_EvChart = /*#__PURE__*/function () {
@@ -54196,60 +54079,87 @@ var chart_core_EvChart = /*#__PURE__*/function () {
       });
     }
   }, {
-    key: "adjustYAxisWidth",
-    value: function adjustYAxisWidth() {
-      var _this$options$axesY, _this$axesY, _this$axesRange, _this$axesSteps, _this$axesSteps$y, _this$axesSteps$y$, _this$axesSteps2, _this$axesY$;
+    key: "adjustXAndYAxisWidth",
+    value: function adjustXAndYAxisWidth() {
+      var _this$options$axesX,
+          _this$options$axesY,
+          _this2 = this,
+          _this$axesSteps,
+          _this$axesSteps2,
+          _this$axesX$,
+          _this$axesY$,
+          _this$axesRange,
+          _this$axesRange$x,
+          _this$axesRange2,
+          _this$axesRange3,
+          _this$axesRange3$y,
+          _this$axesRange4;
 
       // fitWidth(maxWidth에 넘을 시 말줄임표 들어가는 기능)을 사용중인 step Axis인 경우에는 적용 제외
-      var isStepAxisUseFitWidth = (_this$options$axesY = this.options.axesY) === null || _this$options$axesY === void 0 ? void 0 : _this$options$axesY.some(function (axisY) {
+      var isStepXAxisUseFitWidth = (_this$options$axesX = this.options.axesX) === null || _this$options$axesX === void 0 ? void 0 : _this$options$axesX.some(function (axisX) {
+        var _axisX$labelStyle;
+
+        return axisX.type === 'step' && ((_axisX$labelStyle = axisX.labelStyle) === null || _axisX$labelStyle === void 0 ? void 0 : _axisX$labelStyle.fitWidth);
+      });
+      var isStepYAxisUseFitWidth = (_this$options$axesY = this.options.axesY) === null || _this$options$axesY === void 0 ? void 0 : _this$options$axesY.some(function (axisY) {
         var _axisY$labelStyle;
 
         return axisY.type === 'step' && ((_axisY$labelStyle = axisY.labelStyle) === null || _axisY$labelStyle === void 0 ? void 0 : _axisY$labelStyle.fitWidth);
       });
 
-      if (!((_this$axesY = this.axesY) !== null && _this$axesY !== void 0 && _this$axesY.length) || !((_this$axesRange = this.axesRange) !== null && _this$axesRange !== void 0 && _this$axesRange.y) || !((_this$axesSteps = this.axesSteps) !== null && _this$axesSteps !== void 0 && (_this$axesSteps$y = _this$axesSteps.y) !== null && _this$axesSteps$y !== void 0 && _this$axesSteps$y.length) || isStepAxisUseFitWidth) {
-        return;
-      }
-
-      var notFormattedLabels = [];
-
-      var _ref2 = (_this$axesSteps$y$ = (_this$axesSteps2 = this.axesSteps) === null || _this$axesSteps2 === void 0 ? void 0 : _this$axesSteps2.y[0]) !== null && _this$axesSteps$y$ !== void 0 ? _this$axesSteps$y$ : {},
-          interval = _ref2.interval,
-          graphMin = _ref2.graphMin,
-          graphMax = _ref2.graphMax,
-          _ref2$steps = _ref2.steps,
-          steps = _ref2$steps === void 0 ? 0 : _ref2$steps;
+      var getNotFormattedLabels = function getNotFormattedLabels(axesSteps) {
+        var _ref2 = axesSteps !== null && axesSteps !== void 0 ? axesSteps : {},
+            interval = _ref2.interval,
+            graphMin = _ref2.graphMin,
+            graphMax = _ref2.graphMax,
+            _ref2$steps = _ref2.steps,
+            steps = _ref2$steps === void 0 ? 0 : _ref2$steps;
+
+        var result = [];
+
+        if (interval) {
+          result = Array.from({
+            length: steps
+          }, function (_, i) {
+            return graphMin + i * interval;
+          });
+          result.push(graphMax);
+        } else {
+          var _ref3, _labels$y;
 
-      if (interval) {
-        for (var i = 0; i < steps; i++) {
-          notFormattedLabels.push(graphMin + i * interval);
+          var labels = _this2.data.labels;
+          result = (_ref3 = (_labels$y = labels === null || labels === void 0 ? void 0 : labels.y) !== null && _labels$y !== void 0 ? _labels$y : labels) !== null && _ref3 !== void 0 ? _ref3 : [];
         }
 
-        notFormattedLabels.push(graphMax);
-      } else {
-        var _ref3, _this$data$labels$y, _this$data$labels;
-
-        notFormattedLabels = (_ref3 = (_this$data$labels$y = (_this$data$labels = this.data.labels) === null || _this$data$labels === void 0 ? void 0 : _this$data$labels.y) !== null && _this$data$labels$y !== void 0 ? _this$data$labels$y : this.data.labels) !== null && _ref3 !== void 0 ? _ref3 : [];
-      }
-
-      var yMaxWidth = (_this$axesY$ = this.axesY[0]) === null || _this$axesY$ === void 0 ? void 0 : _this$axesY$.getLabelWidthHasMaxLength(notFormattedLabels);
+        return result;
+      };
 
-      if (yMaxWidth > 0) {
-        var adjustedRange = {
-          x: this.axesRange.x,
-          y: this.axesRange.y.map(function (value) {
-            return _objectSpread2(_objectSpread2({}, value), {}, {
-              size: {
-                width: yMaxWidth,
-                height: value.size.height
-              }
-            });
-          })
-        };
-        this.labelOffset = this.getLabelOffset(adjustedRange);
-        this.labelRange = this.getAxesLabelRange();
-        this.axesSteps = this.calculateSteps();
-      }
+      var notFormattedXLabels = getNotFormattedLabels((_this$axesSteps = this.axesSteps) === null || _this$axesSteps === void 0 ? void 0 : _this$axesSteps.x[0]);
+      var notFormattedYLabels = getNotFormattedLabels((_this$axesSteps2 = this.axesSteps) === null || _this$axesSteps2 === void 0 ? void 0 : _this$axesSteps2.y[0]);
+      var xMaxWidth = (_this$axesX$ = this.axesX[0]) === null || _this$axesX$ === void 0 ? void 0 : _this$axesX$.getLabelWidthHasMaxLength(notFormattedXLabels);
+      var yMaxWidth = (_this$axesY$ = this.axesY[0]) === null || _this$axesY$ === void 0 ? void 0 : _this$axesY$.getLabelWidthHasMaxLength(notFormattedYLabels);
+      var adjustedRange = {
+        x: !isStepXAxisUseFitWidth ? (_this$axesRange = this.axesRange) === null || _this$axesRange === void 0 ? void 0 : (_this$axesRange$x = _this$axesRange.x) === null || _this$axesRange$x === void 0 ? void 0 : _this$axesRange$x.map(function (value) {
+          return _objectSpread2(_objectSpread2({}, value), {}, {
+            size: {
+              width: Math.max(xMaxWidth, value.size.width),
+              height: value.size.height
+            }
+          });
+        }) : (_this$axesRange2 = this.axesRange) === null || _this$axesRange2 === void 0 ? void 0 : _this$axesRange2.x,
+        y: !isStepYAxisUseFitWidth ? (_this$axesRange3 = this.axesRange) === null || _this$axesRange3 === void 0 ? void 0 : (_this$axesRange3$y = _this$axesRange3.y) === null || _this$axesRange3$y === void 0 ? void 0 : _this$axesRange3$y.map(function (value) {
+          return _objectSpread2(_objectSpread2({}, value), {}, {
+            size: {
+              width: Math.max(yMaxWidth, value.size.width),
+              height: value.size.height
+            }
+          });
+        }) : (_this$axesRange4 = this.axesRange) === null || _this$axesRange4 === void 0 ? void 0 : _this$axesRange4.y
+      };
+      this.axesRange = adjustedRange;
+      this.labelOffset = this.getLabelOffset(adjustedRange);
+      this.labelRange = this.getAxesLabelRange();
+      this.axesSteps = this.calculateSteps();
     }
     /**
      * To draw canvas chart, it processes several sequential jobs
@@ -54268,7 +54178,7 @@ var chart_core_EvChart = /*#__PURE__*/function () {
       this.labelOffset = this.getLabelOffset();
       this.labelRange = this.getAxesLabelRange();
       this.axesSteps = this.calculateSteps();
-      this.adjustYAxisWidth();
+      this.adjustXAndYAxisWidth();
       this.drawAxis(hitInfo);
       this.drawSeries(hitInfo);
 
@@ -54293,7 +54203,7 @@ var chart_core_EvChart = /*#__PURE__*/function () {
   }, {
     key: "drawSeries",
     value: function drawSeries(hitInfo) {
-      var _this2 = this;
+      var _this3 = this;
 
       var _this$options2 = this.options,
           maxTip = _this$options2.maxTip,
@@ -54330,7 +54240,7 @@ var chart_core_EvChart = /*#__PURE__*/function () {
       var showIndex = 0;
       var showSeriesCount = 0;
       this.seriesInfo.charts.bar.forEach(function (series) {
-        if (_this2.seriesList[series].show) {
+        if (_this3.seriesList[series].show) {
           showSeriesCount++;
         }
       });
@@ -54532,14 +54442,14 @@ var chart_core_EvChart = /*#__PURE__*/function () {
   }, {
     key: "getAxesRange",
     value: function getAxesRange() {
-      var _this3 = this;
+      var _this4 = this;
 
       /* eslint-disable max-len */
       var axesXMinMax = this.axesX.map(function (axis, index) {
-        return axis.calculateScaleRange(_this3.minMax.x[index], _this3.scrollbar.x, _this3.chartRect);
+        return axis.calculateScaleRange(_this4.minMax.x[index], _this4.scrollbar.x, _this4.chartRect);
       });
       var axesYMinMax = this.axesY.map(function (axis, index) {
-        return axis.calculateScaleRange(_this3.minMax.y[index], _this3.scrollbar.y, _this3.chartRect);
+        return axis.calculateScaleRange(_this4.minMax.y[index], _this4.scrollbar.y, _this4.chartRect);
       });
       /* eslint-enable max-len */
 
@@ -54557,13 +54467,13 @@ var chart_core_EvChart = /*#__PURE__*/function () {
   }, {
     key: "drawAxis",
     value: function drawAxis(hitInfo) {
-      var _this4 = this;
+      var _this5 = this;
 
       this.axesX.forEach(function (axis, index) {
-        axis.draw(_this4.chartRect, _this4.labelOffset, _this4.axesSteps.x[index], hitInfo, _this4.defaultSelectInfo, _this4.data.labels);
+        axis.draw(_this5.chartRect, _this5.labelOffset, _this5.axesSteps.x[index], hitInfo, _this5.defaultSelectInfo, _this5.data.labels);
       });
       this.axesY.forEach(function (axis, index) {
-        axis.draw(_this4.chartRect, _this4.labelOffset, _this4.axesSteps.y[index], hitInfo, _this4.defaultSelectInfo);
+        axis.draw(_this5.chartRect, _this5.labelOffset, _this5.axesSteps.y[index], hitInfo, _this5.defaultSelectInfo);
       });
     }
     /**
@@ -54575,27 +54485,27 @@ var chart_core_EvChart = /*#__PURE__*/function () {
   }, {
     key: "calculateSteps",
     value: function calculateSteps() {
-      var _this5 = this;
+      var _this6 = this;
 
       var axesXMinMax = this.axesX.map(function (axis, index) {
         var range = {
-          minValue: _this5.axesRange.x[index].min,
-          maxValue: _this5.axesRange.x[index].max,
-          minIndex: _this5.axesRange.x[index].minIndex,
-          maxIndex: _this5.axesRange.x[index].maxIndex,
-          minSteps: _this5.labelRange.x[index].min,
-          maxSteps: _this5.labelRange.x[index].max
+          minValue: _this6.axesRange.x[index].min,
+          maxValue: _this6.axesRange.x[index].max,
+          minIndex: _this6.axesRange.x[index].minIndex,
+          maxIndex: _this6.axesRange.x[index].maxIndex,
+          minSteps: _this6.labelRange.x[index].min,
+          maxSteps: _this6.labelRange.x[index].max
         };
         return axis.calculateSteps(range);
       });
       var axesYMinMax = this.axesY.map(function (axis, index) {
         var range = {
-          minValue: _this5.axesRange.y[index].min,
-          maxValue: _this5.axesRange.y[index].max,
-          minIndex: _this5.axesRange.y[index].minIndex,
-          maxIndex: _this5.axesRange.y[index].maxIndex,
-          minSteps: _this5.labelRange.y[index].min,
-          maxSteps: _this5.labelRange.y[index].max
+          minValue: _this6.axesRange.y[index].min,
+          maxValue: _this6.axesRange.y[index].max,
+          minIndex: _this6.axesRange.y[index].minIndex,
+          maxIndex: _this6.axesRange.y[index].maxIndex,
+          minSteps: _this6.labelRange.y[index].min,
+          maxSteps: _this6.labelRange.y[index].max
         };
         return axis.calculateSteps(range);
       });
@@ -54613,15 +54523,15 @@ var chart_core_EvChart = /*#__PURE__*/function () {
   }, {
     key: "getAxesLabelRange",
     value: function getAxesLabelRange() {
-      var _this6 = this;
+      var _this7 = this;
 
       var axesXSteps = this.axesX.map(function (axis, index) {
-        var size = _this6.axesRange.x[index].size;
-        return axis.calculateLabelRange('x', _this6.chartRect, _this6.labelOffset, size.width);
+        var size = _this7.axesRange.x[index].size;
+        return axis.calculateLabelRange('x', _this7.chartRect, _this7.labelOffset, size.width);
       });
       var axesYSteps = this.axesY.map(function (axis, index) {
-        var size = _this6.axesRange.y[index].size;
-        return axis.calculateLabelRange('y', _this6.chartRect, _this6.labelOffset, size.height);
+        var size = _this7.axesRange.y[index].size;
+        return axis.calculateLabelRange('y', _this7.chartRect, _this7.labelOffset, size.height);
       });
       return {
         x: axesXSteps,
@@ -54653,9 +54563,8 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     }
     /**
      * Get chart DOM size and set canvas size
-     * @typedef {import('./model/index').ChartDOMSize} ChartDOMSize
      *
-     * @returns {ChartDOMSize} chart size information
+     * @returns {object} chart size information
      */
 
   }, {
@@ -54675,22 +54584,21 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     }
     /**
      * Calculate chart size
-     * @typedef {import('./model/index').ChartRect} ChartRect
      *
-     * @returns {ChartRect} chart size information
+     * @returns {object} chart size information
      */
 
   }, {
     key: "getChartRect",
     value: function getChartRect() {
-      var _this$options$axesX, _this$options$axesX$, _this$options$axesY2, _this$options$axesY2$;
+      var _this$options$axesX2, _this$options$axesX2$, _this$options$axesY2, _this$options$axesY2$;
 
       var _this$getChartDOMRect = this.getChartDOMRect(),
           width = _this$getChartDOMRect.width,
           height = _this$getChartDOMRect.height;
 
       var padding = this.options.padding;
-      var xAxisTitleOpt = (_this$options$axesX = this.options.axesX) === null || _this$options$axesX === void 0 ? void 0 : (_this$options$axesX$ = _this$options$axesX[0]) === null || _this$options$axesX$ === void 0 ? void 0 : _this$options$axesX$.title;
+      var xAxisTitleOpt = (_this$options$axesX2 = this.options.axesX) === null || _this$options$axesX2 === void 0 ? void 0 : (_this$options$axesX2$ = _this$options$axesX2[0]) === null || _this$options$axesX2$ === void 0 ? void 0 : _this$options$axesX2$.title;
       var yAxisTitleOpt = (_this$options$axesY2 = this.options.axesY) === null || _this$options$axesY2 === void 0 ? void 0 : (_this$options$axesY2$ = _this$options$axesY2[0]) === null || _this$options$axesY2$ === void 0 ? void 0 : _this$options$axesY2$.title;
       var titleMargin = 10;
       var xAxisTitleHeight = 0;