tvcharts 0.5.71 → 0.5.73

package/dist/echarts.common.js

@@ -2936,15 +2936,15 @@
         return Storage;
     }());
 
-    var requestAnimationFrame;
-    requestAnimationFrame = (env.hasGlobalWindow
+    var requestAnimationFrame$1;
+    requestAnimationFrame$1 = (env.hasGlobalWindow
         && ((window.requestAnimationFrame && window.requestAnimationFrame.bind(window))
             || (window.msRequestAnimationFrame && window.msRequestAnimationFrame.bind(window))
             || window.mozRequestAnimationFrame
             || window.webkitRequestAnimationFrame)) || function (func) {
         return setTimeout(func, 16);
     };
-    var requestAnimationFrame$1 = requestAnimationFrame;
+    var requestAnimationFrame$2 = requestAnimationFrame$1;
 
     var easingFuncs = {
         linear: function (k) {
@@ -5082,11 +5082,11 @@
             this._running = true;
             function step() {
                 if (self._running) {
-                    requestAnimationFrame$1(step);
+                    requestAnimationFrame$2(step);
                     !self._paused && self.update();
                 }
             }
-            requestAnimationFrame$1(step);
+            requestAnimationFrame$2(step);
         };
         Animation.prototype.start = function () {
             if (this._running) {
@@ -26322,6 +26322,66 @@
           triggerUpdatedEvent.call(this, silent);
         }
       };
+      // 新增一个方法用于更新图表的配置（在不影响其他组件的情况下）
+      ECharts.prototype.updateComOption = function (option, opt) {
+        var _this = this;
+        if (this[IN_MAIN_PROCESS_KEY]) {
+          if ("development" !== 'production') {
+            error('`updateComOption` should not be called during main process.');
+          }
+          return;
+        }
+        if (this._disposed) {
+          disposedWarning(this.id);
+          return;
+        }
+        if (!isObject(opt)) {
+          opt = {
+            silent: !!opt
+          };
+        }
+        var replaceMerge;
+        this[IN_MAIN_PROCESS_KEY] = true;
+        var mainTypes = Object.keys(option);
+        if (!this._model) {
+          error('图表尚未初始化');
+          return;
+        }
+        this._model.setOption(option, {
+          replaceMerge: replaceMerge
+        }, optionPreprocessorFuncs);
+        this._model.eachComponent(function (type, modal) {
+          if (mainTypes.includes(type)) {
+            var view = _this._componentsMap[modal.__viewId];
+            if (view) {
+              view.render(modal, _this._model, _this._api, {
+                type: 'updateComOption'
+              });
+            }
+          }
+        });
+        // // May dispatchAction in rendering procedure
+        // if (this[IN_MAIN_PROCESS_KEY]) {
+        //     this._pendingActions.push(payload);
+        //     return;
+        // }
+        var silent = opt.silent;
+        // doDispatchAction.call(this, payload, silent);
+        var flush = opt.flush;
+        if (flush) {
+          this._zr.flush();
+        } else if (flush !== false && env.browser.weChat) {
+          // In WeChat embedded browser, `requestAnimationFrame` and `setInterval`
+          // hang when sliding page (on touch event), which cause that zr does not
+          // refresh until user interaction finished, which is not expected.
+          // But `dispatchAction` may be called too frequently when pan on touch
+          // screen, which impacts performance if do not throttle them.
+          this._throttledZrFlush();
+        }
+        this[IN_MAIN_PROCESS_KEY] = false;
+        flushPendingActions.call(this, silent);
+        // triggerUpdatedEvent.call(this, silent);
+      };
       /**
        * @deprecated
        */
@@ -27244,6 +27304,7 @@
           var cptTypeTmp = (actionInfo.update || 'update').split(':');
           var updateMethod = cptTypeTmp.pop();
           var cptType = cptTypeTmp[0] != null && parseClassType(cptTypeTmp[0]);
+          // console.log('%c [ cptType ]-1960', 'font-size:13px; background:pink; color:#bf2c9f;', cptType)
           this[IN_MAIN_PROCESS_KEY] = true;
           var payloads = [payload];
           var batched = false;
@@ -30819,7 +30880,7 @@
       };
       OrdinalScale.prototype.contain = function (rank) {
         rank = this.parse(rank);
-        return contain$1(rank, this._extent) && (this._ordinalMeta.categories[rank] != null || this._ordinalMeta.extraCategory[rank - (this._ordinalMeta.categories.length - 1)] != null);
+        return contain$1(rank, this._extent) && (this._ordinalMeta.categories[rank] != null || this._ordinalMeta.extraCategory[rank - this._ordinalMeta.categories.length] != null);
       };
       /**
        * Normalize given rank or name to linear [0, 1]
@@ -30916,7 +30977,7 @@
       OrdinalScale.prototype.getLabel = function (tick) {
         if (!this.isBlank()) {
           var ordinalNumber = this.getRawOrdinalNumber(tick.value);
-          var cateogry = this._ordinalMeta.categories[ordinalNumber] || this._ordinalMeta.extraCategory[ordinalNumber - (this._ordinalMeta.categories.length - 1)];
+          var cateogry = this._ordinalMeta.categories[ordinalNumber] || this._ordinalMeta.extraCategory[ordinalNumber - this._ordinalMeta.categories.length];
           // Note that if no data, ordinalMeta.categories is an empty array.
           // Return empty if it's not exist.
           return cateogry == null ? '' : cateogry + '';
@@ -33312,6 +33373,7 @@
     }
 
     var inner$5 = makeInner();
+    var dataTimeInner = makeInner();
     function createAxisLabels(axis) {
       // Only ordinal scale support tick interval
       return axis.type === 'category' ? makeCategoryLabels(axis) : makeRealNumberLabels(axis);
@@ -33598,6 +33660,11 @@
             marks: masks
           };
         }
+        var ecModal = axis.model.ecModel;
+        if (!dataTimeInner(ecModal).dataTimeCatch) {
+          dataTimeInner(ecModal).dataTimeCatch = {};
+        }
+        var dataTimeCatch_1 = dataTimeInner(ecModal).dataTimeCatch;
         masks.forEach(function (item) {
           var visible = item.index >= ordinalExtent[0] && item.index <= ordinalExtent[1];
           if (visible) {
@@ -33605,8 +33672,18 @@
               value: item.index
             };
             var weightType = weightToTickMarkType(item.weight, true, true);
+            var locale = 'zh-CN';
+            var key = item.originalTime + locale;
+            // console.log('%c [ axis ]-409', 'font-size:13px; background:pink; color:#bf2c9f;', ecModal);
+            var formattedLabel = dataTimeCatch_1[key];
+            if (!formattedLabel) {
+              formattedLabel = defaultTickMarkFormatter(item, weightType, locale);
+              dataTimeCatch_1[key] = formattedLabel;
+              // dataTimeInner(ecModal).dataTimeCatch = dataTimeCatch;
+            }
+
             result.push({
-              formattedLabel: defaultTickMarkFormatter(item, weightType, 'zh-CN'),
+              formattedLabel: formattedLabel,
               rawLabel: ordinalScale.getLabel(tickObj),
               tickValue: item.index
             });
@@ -33729,7 +33806,7 @@
           var dataIndex = data;
           var dataCount = this.scale.getAxisDataLen();
           var deltaFromRight = dataCount + scale.lastBarRightSideDiffBarCount - dataIndex;
-          return Math.floor(this._extent[1] - deltaFromRight * scale.barSpace);
+          return Math.floor(this._extent[1] - (deltaFromRight - 0.5) * scale.barSpace) - 0.5;
         }
         if (this.onBand && scale.type === 'ordinal') {
           extent = extent.slice();
@@ -36503,7 +36580,7 @@
             }
             if (!finished) {
                 var self_1 = this;
-                requestAnimationFrame$1(function () {
+                requestAnimationFrame$2(function () {
                     self_1._paintList(list, prevList, paintAll, redrawId);
                 });
             }
@@ -45052,6 +45129,7 @@
           padding: paddings,
           backgroundColor: bgColor
         }),
+        // z: labelModel.get('z'),
         // Label should be over axisPointer.
         z2: 10
       };
@@ -47010,6 +47088,7 @@
         });
         var width = api.getWidth();
         var seriesLabels = this._seriesLabels;
+        var backgroundColor = ecModel.get('backgroundColor');
         // const showLabelElIndex: {[index: number]: boolean } = {}
         ecModel.eachSeries(function (seriesModel, index) {
           // const seriesData = seriesModel.getData();
@@ -47031,7 +47110,7 @@
           var yAxisModel = coordSys.getAxis('y');
           var yValue = Array.isArray(data) ? data[2] : data;
           var y = coordSys.dataToPoint([0, yValue])[1] - 9;
-          var x = yAxisModel.position === 'right' ? width - 65 : 0;
+          var x = (yAxisModel.position === 'right' ? width - 65 : 0) + 1;
           var fill = '#26A69A';
           var text = yValue.toFixed(4);
           if (seriesModel.subType === 'candlestick') {
@@ -47057,23 +47136,27 @@
             el.x = x;
             el.y = y;
             el.ignore = false;
-            el.traverse(function (el) {
-              if (el.type === 'text') {
-                el.attr('style', {
-                  fill: fill,
-                  text: text
-                });
-              } else {
-                el.style.stroke = fill;
-              }
+            el.attr('style', {
+              fill: fill,
+              text: text,
+              borderColor: fill
             });
+            // el.traverse(function (el: any) {
+            //     if (el.type === 'text') {
+            //         el.attr('style', { fill, text });
+            //     }
+            //     else {
+            //       el.style.stroke = fill;
+            //     }
+            // });
             // elLabelGroupEls.push(el);
           } else {
             el = getTipsGraphic({
               x: x,
               y: y,
               text: text,
-              fill: fill
+              fill: fill,
+              backgroundColor: backgroundColor
             });
             rootGroup.add(el);
             seriesLabels[index] = el;
@@ -47352,52 +47435,52 @@
         eventData.info = elOption.info;
       }
     }
-    function getWidthFromBytes(text, averageWidthInPixels) {
-      if (averageWidthInPixels === void 0) {
-        averageWidthInPixels = 8;
-      }
-      var byteCount = new TextEncoder().encode(text).length;
-      var width = byteCount * averageWidthInPixels;
-      return width;
-    }
+    // function getWidthFromBytes(
+    //     text: string,
+    //     averageWidthInPixels: number = 8
+    // ): number {
+    //     const byteCount: number = new TextEncoder().encode(text).length;
+    //     const width: number = byteCount * averageWidthInPixels;
+    //     return width;
+    // }
     var getTipsGraphic = function (_a) {
+      // const width = getWidthFromBytes(text as string);
+      // const group = new graphicUtil.Group({ x, y });
+      // const rect = new graphicUtil.Rect({
+      //     shape: {
+      //         width: width + 10,
+      //         height: 18
+      //     },
+      //     style: {
+      //         stroke: fill,
+      //         lineWidth: 1
+      //     },
+      //     z: 100,
+      //     zlevel: 2
+      // });
       var x = _a.x,
         y = _a.y,
         text = _a.text,
         _b = _a.fill,
-        fill = _b === void 0 ? '#26A69A' : _b;
-      var width = getWidthFromBytes(text);
-      var group = new Group({
-        x: x,
-        y: y
-      });
-      var rect = new Rect({
-        shape: {
-          width: width + 10,
-          height: 18
-        },
-        style: {
-          stroke: fill,
-          lineWidth: 1
-        },
-        z: 100,
-        zlevel: 2
-      });
+        fill = _b === void 0 ? '#26A69A' : _b,
+        backgroundColor = _a.backgroundColor;
       var textEl = new ZRText({
+        z: 100,
+        x: x,
+        y: y,
         style: {
           fill: fill,
-          width: width,
-          overflow: 'break',
-          text: text
+          backgroundColor: backgroundColor,
+          padding: [3, 5, 1, 7],
+          text: text,
+          borderColor: fill,
+          borderWidth: 1
         },
-        zlevel: 2,
-        z: 100,
-        x: 4,
-        y: 4
+        zlevel: 2
       });
-      group.add(rect);
-      group.add(textEl);
-      return group;
+      // group.add(rect);
+      // group.add(textEl);
+      return textEl;
     };
 
     function install$9(registers) {
@@ -47549,6 +47632,17 @@
       });
       return coordSysInfoWrap;
     }
+    function barSpaceLimit(barSpace, maxWidth) {
+      if (maxWidth === void 0) {
+        maxWidth = 200;
+      }
+      if (barSpace < 1) {
+        return 1;
+      } else if (barSpace > maxWidth) {
+        return maxWidth;
+      }
+      return barSpace;
+    }
 
     var DataZoomAxisInfo = /** @class */function () {
       function DataZoomAxisInfo() {
@@ -48107,6 +48201,8 @@
 
     var each$4 = each;
     var asc$1 = asc;
+    var leftMinVisibleBarCount = 2;
+    var rightMinVisibleBarCount = 2;
     /**
      * Operate single axis.
      * One axis can only operated by one axis operator.
@@ -48171,7 +48267,6 @@
        * Only calculate by given range and this._dataExtent, do not change anything.
        */
       AxisProxy.prototype.calculateDataWindow = function (opt) {
-        var _a, _b;
         var dataExtent = this._dataExtent;
         var axisModel = this.getAxisModel();
         var scale = axisModel.axis.scale;
@@ -48180,7 +48275,6 @@
         var percentWindow = [];
         var valueWindow = [];
         var hasPropModeValue;
-        var isXAxis = axisModel.mainType === 'xAxis';
         each$4(['start', 'end'], function (prop, idx) {
           var boundPercent = opt[prop];
           var boundValue = opt[prop + 'Value'];
@@ -48217,10 +48311,6 @@
         });
         asc$1(valueWindow);
         asc$1(percentWindow);
-        if (isXAxis) {
-          percentWindow[2] = (_a = opt.startOffset) !== null && _a !== void 0 ? _a : 0;
-          percentWindow[3] = (_b = opt.endOffset) !== null && _b !== void 0 ? _b : 0;
-        }
         // The windows from user calling of `dispatchAction` might be out of the extent,
         // or do not obey the `min/maxSpan`, `min/maxValueSpan`. But we don't restrict window
         // by `zoomLock` here, because we see `zoomLock` just as a interaction constraint,
@@ -48261,7 +48351,7 @@
         }
         var axisModel = this.getAxisModel();
         var isDistanceMode = axisModel.axis.getIsDistanceMode();
-        var isXAxis = axisModel.mainType === 'xAxis';
+        // const isXAxis = axisModel.mainType === 'xAxis';
         // `calculateDataWindow` uses min/maxSpan.
         this._updateMinMaxSpan();
         if (isDistanceMode) {
@@ -48269,8 +48359,6 @@
           var scale = axisModel.axis.scale;
           var dataCount = scale.getAxisDataLen();
           var barCount = axisModel.axis.getExtent()[1] / barSpace;
-          var leftMinVisibleBarCount = 1;
-          var rightMinVisibleBarCount = 1;
           var lastBarRightSideDiffBarCount = dataZoomModel.option.lastBarRightSideDiffBarCount;
           var maxRightOffsetBarCount = barCount - Math.min(leftMinVisibleBarCount, dataCount);
           if (lastBarRightSideDiffBarCount > maxRightOffsetBarCount) {
@@ -48299,13 +48387,6 @@
           dataZoomModel.option.lastBarRightSideDiffBarCount = lastBarRightSideDiffBarCount;
         } else {
           var dataWindow = this.calculateDataWindow(dataZoomModel.settledOption);
-          if (isXAxis && dataWindow.percentWindow[1] === 100 && (dataWindow.percentWindow[2] || dataWindow.percentWindow[3])) {
-            var startValueCount = Math.ceil((this._rawDataExtent[1] - this._rawDataExtent[0]) * dataWindow.percentWindow[2] / 100);
-            var endValueCount = Math.ceil((this._rawDataExtent[1] - this._rawDataExtent[0]) * dataWindow.percentWindow[3] / 100);
-            // todo 数量过多时百分比会有误差 所以这里还得锁定最大值
-            dataWindow.valueWindow[0] = Math.min(dataWindow.valueWindow[0] + startValueCount, this._rawDataExtent[1] - 1);
-            dataWindow.valueWindow[1] = dataWindow.valueWindow[1] + endValueCount;
-          }
           this._valueWindow = dataWindow.valueWindow;
           this._percentWindow = dataWindow.percentWindow;
           // Update axis setting then.
@@ -48563,9 +48644,10 @@
           if (axisProxy) {
             var percentRange = axisProxy.getDataPercentWindow();
             var isDistanceMode = axisProxy.getAxisModel().axis.getIsDistanceMode();
+            var maxWidth = ecModel.scheduler.api.getWidth() / 2;
             if (isDistanceMode) {
               dataZoomModel.setCalculatedRange({
-                barSpace: percentRange[0],
+                barSpace: barSpaceLimit(percentRange[0], maxWidth),
                 lastBarRightSideDiffBarCount: percentRange[1]
               });
             } else {
@@ -48586,6 +48668,7 @@
       registers.registerAction('dataZoom', function (payload, ecModel) {
         var effectedModels = findEffectedDataZooms(ecModel, payload);
         each(effectedModels, function (dataZoomModel) {
+          var isLocalDataZoom = payload.uid === dataZoomModel.uid;
           dataZoomModel.setRawRange({
             start: payload.start,
             end: payload.end,
@@ -48593,8 +48676,8 @@
             // endOffset: payload.endOffset,
             startValue: payload.startValue,
             endValue: payload.endValue,
-            lastBarRightSideDiffBarCount: payload.lastBarRightSideDiffBarCount,
-            barSpace: payload.barSpace
+            lastBarRightSideDiffBarCount: isLocalDataZoom ? void 0 : payload.lastBarRightSideDiffBarCount,
+            barSpace: isLocalDataZoom ? void 0 : payload.barSpace
           });
         });
       });
@@ -51738,6 +51821,10 @@
         this._tooltipModel = tooltipModel;
         this._ecModel = ecModel;
         this._api = api;
+        //  todo tooltip都没有了也就不需要渲染了
+        if (!tooltipModel.get('showContent')) {
+          return;
+        }
         var tooltipContent = this._tooltipContent;
         tooltipContent.update(tooltipModel);
         tooltipContent.setEnterable(tooltipModel.get('enterable'));
@@ -56077,16 +56164,16 @@
               var isDistanceMode = axisModal.axis.getIsDistanceMode();
               if (isDistanceMode) {
                 // // todo 这里为什么要赋值 为了防止防抖导致有些数据更新不及时
-                // dzInfo.model.setRawRange({
-                //     barSpace: range[0],
-                //     lastBarRightSideDiffBarCount: range[1],
-                // });
+                dzInfo.model.setRawRange({
+                  barSpace: range[0],
+                  lastBarRightSideDiffBarCount: range[1]
+                });
                 axisProxy.setDataPercentWindow([range[0], range[1]]);
-                // axisModal.axis.scale.setSpace(range[0], range[1]);
+                axisModal.axis.scale.setSpace(range[0], range[1]);
               }
-
               batch.push(isDistanceMode ? {
                 dataZoomId: dzInfo.model.id,
+                uid: dzInfo.model.uid,
                 barSpace: range[0],
                 lastBarRightSideDiffBarCount: range[1],
                 event: event
@@ -56108,13 +56195,25 @@
      */
     function dispatchAction(api, batch) {
       if (!api.isDisposed()) {
-        api.dispatchAction({
-          type: 'dataZoom',
-          animation: {
-            easing: 'cubicOut',
-            duration: 100
-          },
-          batch: batch
+        // api.dispatchAction({
+        //     type: 'dataZoom',
+        //     animation: {
+        //         easing: 'cubicOut',
+        //         duration: 100
+        //     },
+        //     batch: batch
+        // });
+        // todo 这里不加requestAnimationFrame会导致多屏拖拽卡顿
+        // eslint-disable-next-line no-undef
+        requestAnimationFrame(function () {
+          api.dispatchAction({
+            type: 'dataZoom',
+            animation: {
+              easing: 'cubicOut',
+              duration: 100
+            },
+            batch: batch
+          });
         });
       }
     }
@@ -56258,7 +56357,8 @@
         var scale = Math.max(1 / e.scale, 0);
         var isDistanceMode = axisModel.axis.getIsDistanceMode();
         if (isDistanceMode) {
-          range[0] = barSpaceLimit(lastRange[0] * e.scale);
+          var maxWidth = axisModel.ecModel.scheduler.api.getWidth() / 2;
+          range[0] = barSpaceLimit(lastRange[0] * e.scale, maxWidth);
           this.range = range;
           if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {
             return range;
@@ -56267,39 +56367,6 @@
         }
         range[0] = (range[0] - percentPoint) * scale + percentPoint;
         range[1] = (range[1] - percentPoint) * scale + percentPoint;
-        // // todo 交互与tradingview保持一致缩放左边（tradingView的实现方式应该为修改barwidth）
-        // if (!isXAxis) {
-        // }
-        // else {
-        //     const dataExtent = this.dataZoomModel.findRepresentativeAxisProxy().getRawDataExtent();
-        //     const maxOffset = 100 - 2 / (dataExtent[1] - dataExtent[0]);
-        //     // 如果有开始偏移量
-        //     if (range[2]) {
-        //         // 如果开始进度小于0 则修改开始偏移量
-        //         if (range[0] <= 0) {
-        //             range[2] = range[2] + range[0];
-        //         }
-        //         // 如果开始进度与偏移量大于最大起始偏移量
-        //         else if (range[0] + range[2] > maxOffset) {
-        //             const offsetDiff = range[0] + range[2] - maxOffset;
-        //             range[2] = range[2] - offsetDiff;
-        //             range[0] = Math.max(maxOffset - range[2], 0);
-        //         }
-        //     }
-        //     // 当开始偏移量为0 且拥有结束偏移量时
-        //     if (range[3] && range[2] <= 0 && range[0] <= 0) {
-        //         range[3] = Math.max((range[3] - percentPoint) * scale + percentPoint, 0);
-        //     }
-        //     // 当开始偏移量已经达到最大值时 且拥有结束偏移量时
-        //     else if (range[3] && range[0] + range[2] >= maxOffset) {
-        //         const offsetDiff = range[0] + range[2] - maxOffset;
-        //         range[3] = Math.max(range[2] - offsetDiff, 0);
-        //     }
-        //     range[0] = Math.min(range[0], maxOffset);
-        //     if (range[2]) {
-        //         range[2] = Math.max(range[2], 0);
-        //     }
-        // }
         // Restrict range.
         var minMaxSpan = this.dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
         sliderMove(0, range, [0, 100], 0, minMaxSpan.minSpan, minMaxSpan.maxSpan);
@@ -56317,14 +56384,6 @@
         return directionInfo.signal * (range[1] - range[0]) * e.scrollDelta;
       })
     };
-    function barSpaceLimit(barSpace) {
-      if (barSpace < 1) {
-        return 1;
-      } else if (barSpace > 200) {
-        return 200;
-      }
-      return barSpace;
-    }
     function makeMover(getPercentDelta) {
       return function (coordSysInfo, coordSysMainType, controller, e) {
         var _a, _b, _c;
@@ -56342,7 +56401,7 @@
           var startLastBarRightSideDiffBarCount = (_c = lastRange[1]) !== null && _c !== void 0 ? _c : this.dataZoomModel.get('lastBarRightSideDiffBarCount');
           var distanceBarCount = distance / barSpace;
           var lastBarRightSideDiffBarCount = startLastBarRightSideDiffBarCount - distanceBarCount;
-          range[0] = barSpaceLimit(barSpace);
+          range[0] = barSpace;
           range[1] = lastBarRightSideDiffBarCount;
           this.range = range;
           if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {