evui 3.4.110 → 3.4.112

package/dist/evui.umd.js

@@ -11173,7 +11173,7 @@ module.exports = exports;
 /***/ "9224":
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"a\":\"3.4.110\"}");
+module.exports = JSON.parse("{\"a\":\"3.4.112\"}");
 
 /***/ }),
 
@@ -38829,9 +38829,9 @@ var modules = {
 
             if (series && sData) {
               if (series.isExistGrp && series.stackIndex && !series.isOverlapping) {
-                series.data = _this.addSeriesStackDS(sData, label, series.bsIds, series.stackIndex);
+                series.data = _this.addSeriesStackDS(sData, label, series.bsIds, series.stackIndex, series.interpolation);
               } else {
-                series.data = _this.addSeriesDS(sData, label, series.isExistGrp);
+                series.data = _this.addSeriesDS(sData, label, series.isExistGrp, series.interpolation);
               }
 
               series.minMax = _this.getSeriesMinMax(series.data);
@@ -39218,13 +39218,17 @@ 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
    *
-   * @returns {array} data for each series
+   * @typedef {import('./index').ChartSeriesDataPoint} ChartSeriesDataPoint
+   *
+   * @returns {ChartSeriesDataPoint[]} 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 = [];
 
@@ -39271,15 +39275,14 @@ var modules = {
           if (oData != null) {
             gdata = bdata + oData;
           } else {
-            gdata = null;
-            bdata = 0;
+            gdata = odata;
           }
         } else {
           bdata = 0;
           gdata = oData;
         }
 
-        sdata.push(_this4.addData(gdata, ldata, odata, bdata));
+        sdata.push(_this4.addData(gdata, ldata, odata, bdata, interpolation));
       }
     });
     return sdata;
@@ -39290,13 +39293,17 @@ 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 {array} data for each series
+   * @returns {ChartSeriesDataPoint[]} 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;
@@ -39311,7 +39318,7 @@ var modules = {
 
       if (ldata !== null) {
         var isPassingValueWithStack = isBase && !helpers_util.isNullOrUndefined(passingValue) && gdata === passingValue;
-        sdata.push(_this5.addData(isPassingValueWithStack ? 0 : gdata, ldata, gdata));
+        sdata.push(_this5.addData(isPassingValueWithStack ? 0 : gdata, ldata, gdata, null, interpolation));
       }
     });
     return sdata;
@@ -39368,13 +39375,18 @@ 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)
-    * @returns {object} data for each graph point
+   * @param {import('./index').InterpolationType}  interpolation   interpolation type
+   *
+   * @typedef {import('./index').ChartSeriesDataPoint} ChartSeriesDataPoint
+   *
+   * @returns {ChartSeriesDataPoint} 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;
@@ -39387,7 +39399,7 @@ var modules = {
       gdataColor = gdata.color;
       dataTextColor = gdata.textColor;
     } else {
-      gdataValue = gdata !== null && gdata !== void 0 ? gdata : null;
+      gdataValue = interpolation === 'zero' && !gdata ? bdata !== null && bdata !== void 0 ? bdata : 0 : gdata !== null && gdata !== void 0 ? gdata : null;
     }
 
     if (odata !== null && _typeof(odata) === 'object') {
@@ -39944,12 +39956,18 @@ 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 {object} clicked label information
+   * @returns {LabelInfoResult} clicked label information
    */
   getLabelInfoByPosition: function getLabelInfoByPosition(offset, targetAxis) {
     var _Object$values$sort$, _Object$values$sort$2, _scrollbarOpt, _scale, _scale$labels, _scale3, _scale3$labels;
@@ -40056,11 +40074,14 @@ 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 {object} current mouse target label value
+   * @returns {MouseLabelValue} current mouse target label value
    */
   getCurMouseLabelVal: function getCurMouseLabelVal(targetAxis, offset, labelIndex) {
     var _this9 = this;
@@ -41090,6 +41111,57 @@ 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: {
@@ -41137,7 +41209,8 @@ var LINE_OPTION = {
   fill: false,
   fillOpacity: 0.4,
   showLegend: true,
-  passingValue: null
+  passingValue: null,
+  interpolation: 'none'
 };
 var BAR_OPTION = {
   show: true,
@@ -41324,13 +41397,13 @@ var TIME_INTERVALS = {
 /* harmony default export */ var helpers_canvas = ({
   /**
    * Calculate X position
-   * @param {any}    value         graph value
+   * @param {number|null|undefined}    value         graph value
    * @param {number} min           min value
    * @param {number} max           max value
    * @param {number} area          height for axis
    * @param {number} startPoint    startPoint
    *
-   * @returns {any} position
+   * @returns {number|null} position
    */
   calculateX: function calculateX(value, min, max, area) {
     var startPoint = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
@@ -41370,13 +41443,13 @@ var TIME_INTERVALS = {
 
   /**
    * Calculate Y position
-   * @param {any}    value         graph value
+   * @param {number|null|undefined}    value         graph value
    * @param {number} min           min value
    * @param {number} max           max value
    * @param {number} area          height for axis
    * @param {number} startPoint    startPoint
    *
-   * @returns {any} position
+   * @returns {number|null} position
    */
   calculateY: function calculateY(value, min, max, area) {
     var startPoint = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
@@ -41624,7 +41697,6 @@ var TIME_INTERVALS = {
 
 
 
-
 var element_line_Line = /*#__PURE__*/function () {
   function Line(sId, opt, sIdx) {
     var _this = this;
@@ -41661,6 +41733,8 @@ var element_line_Line = /*#__PURE__*/function () {
         lineWidth: 2
       }
     };
+    /** @type {import('../model/index').ChartSeriesDataPoint[]} */
+
     this.data = [];
     this.beforeMouseXp = 0;
     this.beforeMouseYp = 0;
@@ -41668,11 +41742,23 @@ var element_line_Line = /*#__PURE__*/function () {
     this.size = {
       comboOffset: 0
     };
-    this.usePassingValue = !!this.passingValue;
+    this.usePassingValue = !lodash_es_isUndefined(this.passingValue) && this.interpolation === 'linear';
   }
+  /**
+   * @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 {object} param     object for drawing series data
+   * @param {LineDrawParam} param     object for drawing series data
    *
    * @returns {undefined}
    */
@@ -41741,8 +41827,6 @@ 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];
@@ -41767,51 +41851,40 @@ var element_line_Line = /*#__PURE__*/function () {
       }; // draw line
 
 
-      var needCutoff = false;
-      this.data.reduce(function (prev, curr) {
-        x = getXPos(curr.x);
-        y = getYPos(curr.y);
+      var prevValid;
+      this.data.forEach(function (curr) {
+        var _prevValid, _prevValid2, _prevValid3;
 
-        if (x !== null) {
-          x += helpers_util.aliasPixel(x);
-        }
+        var x = getXPos(curr.x);
+        var y = getYPos(curr.y);
 
-        if (_this2.usePassingValue) {
-          if (curr.o === _this2.passingValue) {
-            y = getYPos(prev.y);
+        if (_this2.isExistGrp && _this2.usePassingValue && curr.o === _this2.passingValue) {
+          var _curr$b;
 
-            if (prev.o === null) {
-              needCutoff = true;
-            }
+          y = getYPos((_curr$b = curr.b) !== null && _curr$b !== void 0 ? _curr$b : 0);
+        }
 
-            if (_this2.isExistGrp && !needCutoff) {
-              var _curr$b;
+        if (x !== null) {
+          x += helpers_util.aliasPixel(x);
+        }
 
-              y = getYPos((_curr$b = curr.b) !== null && _curr$b !== void 0 ? _curr$b : 0);
-              ctx.lineTo(x, y);
-            }
+        curr.xp = x;
+        curr.yp = y;
 
-            curr.xp = x;
-            curr.yp = y;
-            return curr;
+        if (_this2.usePassingValue && curr.o === _this2.passingValue) {
+          if (!_this2.isExistGrp) {
+            return;
           }
         }
 
-        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) {
+        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) {
           ctx.moveTo(x, y);
-          needCutoff = false;
         } else {
           ctx.lineTo(x, y);
         }
 
-        curr.xp = x; // eslint-disable-line
-
-        curr.yp = y; // eslint-disable-line
-
-        return curr;
-      }, this.data[0]);
+        prevValid = curr;
+      });
       ctx.stroke();
 
       if (this.segments) {
@@ -41851,20 +41924,24 @@ 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++) {
-          if (helpers_util.isNullOrUndefined(valueArray[i])) {
+          var isNoneInterpolation = this.interpolation === 'none' || this.usePassingValue && this.passingValue !== null;
+
+          if (isNoneInterpolation ? lodash_es_isNil(valueArray[i]) : lodash_es_isUndefined(valueArray[i])) {
             if (start !== null && end !== null) {
               var temp = valueArray.slice(start, i);
               var lastNormalValueIndex = temp.findLastIndex(function (item) {
-                return item !== helpers_util.isNullOrUndefined(item) && item !== _this2.passingValue;
+                return !lodash_es_isNil(item) && item !== _this2.passingValue;
               });
               needFillDataIndexList.push([start, start + lastNormalValueIndex]);
               start = null;
               end = null;
             }
-          } else if (valueArray[i] === this.passingValue) {
+          } else if (this.usePassingValue && valueArray[i] === this.passingValue) {
             end = i;
           } else {
             start = start === null ? i : start;
@@ -41894,7 +41971,7 @@ var element_line_Line = /*#__PURE__*/function () {
 
             if (ix === startIndex) {
               ctx.moveTo(currData.xp, currData.yp);
-            } else if (_this2.isExistGrp || _this2.passingValue !== currData.o) {
+            } else if (_this2.isExistGrp || _this2.passingValue !== currData.o || _this2.interpolation === 'zero' && lodash_es_isNil(currData.o)) {
               ctx.lineTo(currData.xp, currData.yp);
             }
 
@@ -41927,7 +42004,7 @@ var element_line_Line = /*#__PURE__*/function () {
             return;
           }
 
-          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 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 isSelectedLabel = selectedLabelIndexList.includes(ix);
 
           if (_this2.point || isSingle || isSelectedLabel) {
@@ -44751,6 +44828,47 @@ 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
 
 
@@ -51237,7 +51355,7 @@ var plugins_interaction_modules = {
         if (item !== null && item !== void 0 && item.data) {
           var gdata = void 0;
 
-          if (item.data.o === null) {
+          if (item.data.o === null && series.interpolation !== 'zero') {
             if (!series.isExistGrp) {
               gdata = isHorizontal ? item.data.x : item.data.y;
             }
@@ -54544,8 +54662,9 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     }
     /**
      * Get chart DOM size and set canvas size
+     * @typedef {import('./model/index').ChartDOMSize} ChartDOMSize
      *
-     * @returns {object} chart size information
+     * @returns {ChartDOMSize} chart size information
      */
 
   }, {
@@ -54565,8 +54684,9 @@ var chart_core_EvChart = /*#__PURE__*/function () {
     }
     /**
      * Calculate chart size
+     * @typedef {import('./model/index').ChartRect} ChartRect
      *
-     * @returns {object} chart size information
+     * @returns {ChartRect} chart size information
      */
 
   }, {