@fmdevui/fm-dev 1.0.112 → 1.0.114

package/lib/node_modules/.pnpm/echarts@6.0.0/node_modules/echarts/lib/component/visualMap/ContinuousView.js

@@ -0,0 +1,662 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../../../../../tslib@2.3.0/node_modules/tslib/tslib.es6.js');
+var util = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/core/util.js');
+var LinearGradient = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/LinearGradient.js');
+var event = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/core/event.js');
+var VisualMapView = require('./VisualMapView.js');
+var graphic = require('../../util/graphic.js');
+var number = require('../../util/number.js');
+var sliderMove = require('../helper/sliderMove.js');
+var helper = require('./helper.js');
+var model = require('../../util/model.js');
+var text = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/contain/text.js');
+var states = require('../../util/states.js');
+var symbol = require('../../util/symbol.js');
+var Image = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/Image.js');
+var innerStore = require('../../util/innerStore.js');
+var labelStyle = require('../../label/labelStyle.js');
+var event$1 = require('../../util/event.js');
+var Text = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/Text.js');
+var Group = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/Group.js');
+var Rect = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/shape/Rect.js');
+var Polygon = require('../../../../../../zrender@6.0.0/node_modules/zrender/lib/graphic/shape/Polygon.js');
+
+var linearMap = number.linearMap;
+var each = util.each;
+var mathMin = Math.min;
+var mathMax = Math.max;
+// Arbitrary value
+var HOVER_LINK_SIZE = 12;
+var HOVER_LINK_OUT = 6;
+// Notice:
+// Any "interval" should be by the order of [low, high].
+// "handle0" (handleIndex === 0) maps to
+// low data value: this._dataInterval[0] and has low coord.
+// "handle1" (handleIndex === 1) maps to
+// high data value: this._dataInterval[1] and has high coord.
+// The logic of transform is implemented in this._createBarGroup.
+var ContinuousView = /** @class */function (_super) {
+  tslib_es6.__extends(ContinuousView, _super);
+  function ContinuousView() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+    _this.type = ContinuousView.type;
+    _this._shapes = {};
+    _this._dataInterval = [];
+    _this._handleEnds = [];
+    _this._hoverLinkDataIndices = [];
+    return _this;
+  }
+  ContinuousView.prototype.init = function (ecModel, api) {
+    _super.prototype.init.call(this, ecModel, api);
+    this._hoverLinkFromSeriesMouseOver = util.bind(this._hoverLinkFromSeriesMouseOver, this);
+    this._hideIndicator = util.bind(this._hideIndicator, this);
+  };
+  ContinuousView.prototype.doRender = function (visualMapModel, ecModel, api, payload) {
+    if (!payload || payload.type !== 'selectDataRange' || payload.from !== this.uid) {
+      this._buildView();
+    }
+  };
+  ContinuousView.prototype._buildView = function () {
+    this.group.removeAll();
+    var visualMapModel = this.visualMapModel;
+    var thisGroup = this.group;
+    this._orient = visualMapModel.get('orient');
+    this._useHandle = visualMapModel.get('calculable');
+    this._resetInterval();
+    this._renderBar(thisGroup);
+    var dataRangeText = visualMapModel.get('text');
+    this._renderEndsText(thisGroup, dataRangeText, 0);
+    this._renderEndsText(thisGroup, dataRangeText, 1);
+    // Do this for background size calculation.
+    this._updateView(true);
+    // After updating view, inner shapes is built completely,
+    // and then background can be rendered.
+    this.renderBackground(thisGroup);
+    // Real update view
+    this._updateView();
+    this._enableHoverLinkToSeries();
+    this._enableHoverLinkFromSeries();
+    this.positionGroup(thisGroup);
+  };
+  ContinuousView.prototype._renderEndsText = function (group, dataRangeText, endsIndex) {
+    if (!dataRangeText) {
+      return;
+    }
+    // Compatible with ec2, text[0] map to high value, text[1] map low value.
+    var text = dataRangeText[1 - endsIndex];
+    text = text != null ? text + '' : '';
+    var visualMapModel = this.visualMapModel;
+    var textGap = visualMapModel.get('textGap');
+    var itemSize = visualMapModel.itemSize;
+    var barGroup = this._shapes.mainGroup;
+    var position = this._applyTransform([itemSize[0] / 2, endsIndex === 0 ? -textGap : itemSize[1] + textGap], barGroup);
+    var align = this._applyTransform(endsIndex === 0 ? 'bottom' : 'top', barGroup);
+    var orient = this._orient;
+    var textStyleModel = this.visualMapModel.textStyleModel;
+    this.group.add(new Text.default({
+      style: labelStyle.createTextStyle(textStyleModel, {
+        x: position[0],
+        y: position[1],
+        verticalAlign: textStyleModel.get('verticalAlign') || (orient === 'horizontal' ? 'middle' : align),
+        align: textStyleModel.get('align') || (orient === 'horizontal' ? align : 'center'),
+        text: text
+      })
+    }));
+  };
+  ContinuousView.prototype._renderBar = function (targetGroup) {
+    var visualMapModel = this.visualMapModel;
+    var shapes = this._shapes;
+    var itemSize = visualMapModel.itemSize;
+    var orient = this._orient;
+    var useHandle = this._useHandle;
+    var itemAlign = helper.getItemAlign(visualMapModel, this.api, itemSize);
+    var mainGroup = shapes.mainGroup = this._createBarGroup(itemAlign);
+    var gradientBarGroup = new Group.default();
+    mainGroup.add(gradientBarGroup);
+    // Bar
+    gradientBarGroup.add(shapes.outOfRange = createPolygon());
+    gradientBarGroup.add(shapes.inRange = createPolygon(null, useHandle ? getCursor(this._orient) : null, util.bind(this._dragHandle, this, 'all', false), util.bind(this._dragHandle, this, 'all', true)));
+    // A border radius clip.
+    gradientBarGroup.setClipPath(new Rect.default({
+      shape: {
+        x: 0,
+        y: 0,
+        width: itemSize[0],
+        height: itemSize[1],
+        r: 3
+      }
+    }));
+    var textRect = visualMapModel.textStyleModel.getTextRect('国');
+    var textSize = mathMax(textRect.width, textRect.height);
+    // Handle
+    if (useHandle) {
+      shapes.handleThumbs = [];
+      shapes.handleLabels = [];
+      shapes.handleLabelPoints = [];
+      this._createHandle(visualMapModel, mainGroup, 0, itemSize, textSize, orient);
+      this._createHandle(visualMapModel, mainGroup, 1, itemSize, textSize, orient);
+    }
+    this._createIndicator(visualMapModel, mainGroup, itemSize, textSize, orient);
+    targetGroup.add(mainGroup);
+  };
+  ContinuousView.prototype._createHandle = function (visualMapModel, mainGroup, handleIndex, itemSize, textSize, orient) {
+    var onDrift = util.bind(this._dragHandle, this, handleIndex, false);
+    var onDragEnd = util.bind(this._dragHandle, this, handleIndex, true);
+    var handleSize = text.parsePercent(visualMapModel.get('handleSize'), itemSize[0]);
+    var handleThumb = symbol.createSymbol(visualMapModel.get('handleIcon'), -handleSize / 2, -handleSize / 2, handleSize, handleSize, null, true);
+    var cursor = getCursor(this._orient);
+    handleThumb.attr({
+      cursor: cursor,
+      draggable: true,
+      drift: onDrift,
+      ondragend: onDragEnd,
+      onmousemove: function (e) {
+        event.stop(e.event);
+      }
+    });
+    handleThumb.x = itemSize[0] / 2;
+    handleThumb.useStyle(visualMapModel.getModel('handleStyle').getItemStyle());
+    handleThumb.setStyle({
+      strokeNoScale: true,
+      strokeFirst: true
+    });
+    handleThumb.style.lineWidth *= 2;
+    handleThumb.ensureState('emphasis').style = visualMapModel.getModel(['emphasis', 'handleStyle']).getItemStyle();
+    states.setAsHighDownDispatcher(handleThumb, true);
+    mainGroup.add(handleThumb);
+    // Text is always horizontal layout but should not be effected by
+    // transform (orient/inverse). So label is built separately but not
+    // use zrender/graphic/helper/RectText, and is located based on view
+    // group (according to handleLabelPoint) but not barGroup.
+    var textStyleModel = this.visualMapModel.textStyleModel;
+    var handleLabel = new Text.default({
+      cursor: cursor,
+      draggable: true,
+      drift: onDrift,
+      onmousemove: function (e) {
+        // For mobile device, prevent screen slider on the button.
+        event.stop(e.event);
+      },
+      ondragend: onDragEnd,
+      style: labelStyle.createTextStyle(textStyleModel, {
+        x: 0,
+        y: 0,
+        text: ''
+      })
+    });
+    handleLabel.ensureState('blur').style = {
+      opacity: 0.1
+    };
+    handleLabel.stateTransition = {
+      duration: 200
+    };
+    this.group.add(handleLabel);
+    var handleLabelPoint = [handleSize, 0];
+    var shapes = this._shapes;
+    shapes.handleThumbs[handleIndex] = handleThumb;
+    shapes.handleLabelPoints[handleIndex] = handleLabelPoint;
+    shapes.handleLabels[handleIndex] = handleLabel;
+  };
+  ContinuousView.prototype._createIndicator = function (visualMapModel, mainGroup, itemSize, textSize, orient) {
+    var scale = text.parsePercent(visualMapModel.get('indicatorSize'), itemSize[0]);
+    var indicator = symbol.createSymbol(visualMapModel.get('indicatorIcon'), -scale / 2, -scale / 2, scale, scale, null, true);
+    indicator.attr({
+      cursor: 'move',
+      invisible: true,
+      silent: true,
+      x: itemSize[0] / 2
+    });
+    var indicatorStyle = visualMapModel.getModel('indicatorStyle').getItemStyle();
+    if (indicator instanceof Image.default) {
+      var pathStyle = indicator.style;
+      indicator.useStyle(util.extend({
+        // TODO other properties like x, y ?
+        image: pathStyle.image,
+        x: pathStyle.x,
+        y: pathStyle.y,
+        width: pathStyle.width,
+        height: pathStyle.height
+      }, indicatorStyle));
+    } else {
+      indicator.useStyle(indicatorStyle);
+    }
+    mainGroup.add(indicator);
+    var textStyleModel = this.visualMapModel.textStyleModel;
+    var indicatorLabel = new Text.default({
+      silent: true,
+      invisible: true,
+      style: labelStyle.createTextStyle(textStyleModel, {
+        x: 0,
+        y: 0,
+        text: ''
+      })
+    });
+    this.group.add(indicatorLabel);
+    var indicatorLabelPoint = [(orient === 'horizontal' ? textSize / 2 : HOVER_LINK_OUT) + itemSize[0] / 2, 0];
+    var shapes = this._shapes;
+    shapes.indicator = indicator;
+    shapes.indicatorLabel = indicatorLabel;
+    shapes.indicatorLabelPoint = indicatorLabelPoint;
+    this._firstShowIndicator = true;
+  };
+  ContinuousView.prototype._dragHandle = function (handleIndex, isEnd,
+  // dx is event from ondragend if isEnd is true. It's not used
+  dx, dy) {
+    if (!this._useHandle) {
+      return;
+    }
+    this._dragging = !isEnd;
+    if (!isEnd) {
+      // Transform dx, dy to bar coordination.
+      var vertex = this._applyTransform([dx, dy], this._shapes.mainGroup, true);
+      this._updateInterval(handleIndex, vertex[1]);
+      this._hideIndicator();
+      // Considering realtime, update view should be executed
+      // before dispatch action.
+      this._updateView();
+    }
+    // dragEnd do not dispatch action when realtime.
+    if (isEnd === !this.visualMapModel.get('realtime')) {
+      // jshint ignore:line
+      this.api.dispatchAction({
+        type: 'selectDataRange',
+        from: this.uid,
+        visualMapId: this.visualMapModel.id,
+        selected: this._dataInterval.slice()
+      });
+    }
+    if (isEnd) {
+      !this._hovering && this._clearHoverLinkToSeries();
+    } else if (useHoverLinkOnHandle(this.visualMapModel)) {
+      this._doHoverLinkToSeries(this._handleEnds[handleIndex], false);
+    }
+  };
+  ContinuousView.prototype._resetInterval = function () {
+    var visualMapModel = this.visualMapModel;
+    var dataInterval = this._dataInterval = visualMapModel.getSelected();
+    var dataExtent = visualMapModel.getExtent();
+    var sizeExtent = [0, visualMapModel.itemSize[1]];
+    this._handleEnds = [linearMap(dataInterval[0], dataExtent, sizeExtent, true), linearMap(dataInterval[1], dataExtent, sizeExtent, true)];
+  };
+  /**
+   * @private
+   * @param {(number|string)} handleIndex 0 or 1 or 'all'
+   * @param {number} dx
+   * @param {number} dy
+   */
+  ContinuousView.prototype._updateInterval = function (handleIndex, delta) {
+    delta = delta || 0;
+    var visualMapModel = this.visualMapModel;
+    var handleEnds = this._handleEnds;
+    var sizeExtent = [0, visualMapModel.itemSize[1]];
+    sliderMove.default(delta, handleEnds, sizeExtent, handleIndex,
+    // cross is forbidden
+    0);
+    var dataExtent = visualMapModel.getExtent();
+    // Update data interval.
+    this._dataInterval = [linearMap(handleEnds[0], sizeExtent, dataExtent, true), linearMap(handleEnds[1], sizeExtent, dataExtent, true)];
+  };
+  ContinuousView.prototype._updateView = function (forSketch) {
+    var visualMapModel = this.visualMapModel;
+    var dataExtent = visualMapModel.getExtent();
+    var shapes = this._shapes;
+    var outOfRangeHandleEnds = [0, visualMapModel.itemSize[1]];
+    var inRangeHandleEnds = forSketch ? outOfRangeHandleEnds : this._handleEnds;
+    var visualInRange = this._createBarVisual(this._dataInterval, dataExtent, inRangeHandleEnds, 'inRange');
+    var visualOutOfRange = this._createBarVisual(dataExtent, dataExtent, outOfRangeHandleEnds, 'outOfRange');
+    shapes.inRange.setStyle({
+      fill: visualInRange.barColor
+      // opacity: visualInRange.opacity
+    }).setShape('points', visualInRange.barPoints);
+    shapes.outOfRange.setStyle({
+      fill: visualOutOfRange.barColor
+      // opacity: visualOutOfRange.opacity
+    }).setShape('points', visualOutOfRange.barPoints);
+    this._updateHandle(inRangeHandleEnds, visualInRange);
+  };
+  ContinuousView.prototype._createBarVisual = function (dataInterval, dataExtent, handleEnds, forceState) {
+    var opts = {
+      forceState: forceState,
+      convertOpacityToAlpha: true
+    };
+    var colorStops = this._makeColorGradient(dataInterval, opts);
+    var symbolSizes = [this.getControllerVisual(dataInterval[0], 'symbolSize', opts), this.getControllerVisual(dataInterval[1], 'symbolSize', opts)];
+    var barPoints = this._createBarPoints(handleEnds, symbolSizes);
+    return {
+      barColor: new LinearGradient.default(0, 0, 0, 1, colorStops),
+      barPoints: barPoints,
+      handlesColor: [colorStops[0].color, colorStops[colorStops.length - 1].color]
+    };
+  };
+  ContinuousView.prototype._makeColorGradient = function (dataInterval, opts) {
+    // Considering colorHue, which is not linear, so we have to sample
+    // to calculate gradient color stops, but not only calculate head
+    // and tail.
+    var sampleNumber = 100; // Arbitrary value.
+    var colorStops = [];
+    var step = (dataInterval[1] - dataInterval[0]) / sampleNumber;
+    colorStops.push({
+      color: this.getControllerVisual(dataInterval[0], 'color', opts),
+      offset: 0
+    });
+    for (var i = 1; i < sampleNumber; i++) {
+      var currValue = dataInterval[0] + step * i;
+      if (currValue > dataInterval[1]) {
+        break;
+      }
+      colorStops.push({
+        color: this.getControllerVisual(currValue, 'color', opts),
+        offset: i / sampleNumber
+      });
+    }
+    colorStops.push({
+      color: this.getControllerVisual(dataInterval[1], 'color', opts),
+      offset: 1
+    });
+    return colorStops;
+  };
+  ContinuousView.prototype._createBarPoints = function (handleEnds, symbolSizes) {
+    var itemSize = this.visualMapModel.itemSize;
+    return [[itemSize[0] - symbolSizes[0], handleEnds[0]], [itemSize[0], handleEnds[0]], [itemSize[0], handleEnds[1]], [itemSize[0] - symbolSizes[1], handleEnds[1]]];
+  };
+  ContinuousView.prototype._createBarGroup = function (itemAlign) {
+    var orient = this._orient;
+    var inverse = this.visualMapModel.get('inverse');
+    return new Group.default(orient === 'horizontal' && !inverse ? {
+      scaleX: itemAlign === 'bottom' ? 1 : -1,
+      rotation: Math.PI / 2
+    } : orient === 'horizontal' && inverse ? {
+      scaleX: itemAlign === 'bottom' ? -1 : 1,
+      rotation: -Math.PI / 2
+    } : orient === 'vertical' && !inverse ? {
+      scaleX: itemAlign === 'left' ? 1 : -1,
+      scaleY: -1
+    } : {
+      scaleX: itemAlign === 'left' ? 1 : -1
+    });
+  };
+  ContinuousView.prototype._updateHandle = function (handleEnds, visualInRange) {
+    if (!this._useHandle) {
+      return;
+    }
+    var shapes = this._shapes;
+    var visualMapModel = this.visualMapModel;
+    var handleThumbs = shapes.handleThumbs;
+    var handleLabels = shapes.handleLabels;
+    var itemSize = visualMapModel.itemSize;
+    var dataExtent = visualMapModel.getExtent();
+    var align = this._applyTransform('left', shapes.mainGroup);
+    each([0, 1], function (handleIndex) {
+      var handleThumb = handleThumbs[handleIndex];
+      handleThumb.setStyle('fill', visualInRange.handlesColor[handleIndex]);
+      handleThumb.y = handleEnds[handleIndex];
+      var val = linearMap(handleEnds[handleIndex], [0, itemSize[1]], dataExtent, true);
+      var symbolSize = this.getControllerVisual(val, 'symbolSize');
+      handleThumb.scaleX = handleThumb.scaleY = symbolSize / itemSize[0];
+      handleThumb.x = itemSize[0] - symbolSize / 2;
+      // Update handle label position.
+      var textPoint = graphic.applyTransform(shapes.handleLabelPoints[handleIndex], graphic.getTransform(handleThumb, this.group));
+      if (this._orient === 'horizontal') {
+        // If visualMap controls symbol size, an additional offset needs to be added to labels to avoid collision at minimum size.
+        // Offset reaches value of 0 at "maximum" position, so maximum position is not altered at all.
+        var minimumOffset = align === 'left' || align === 'top' ? (itemSize[0] - symbolSize) / 2 : (itemSize[0] - symbolSize) / -2;
+        textPoint[1] += minimumOffset;
+      }
+      handleLabels[handleIndex].setStyle({
+        x: textPoint[0],
+        y: textPoint[1],
+        text: visualMapModel.formatValueText(this._dataInterval[handleIndex]),
+        verticalAlign: 'middle',
+        align: this._orient === 'vertical' ? this._applyTransform('left', shapes.mainGroup) : 'center'
+      });
+    }, this);
+  };
+  ContinuousView.prototype._showIndicator = function (cursorValue, textValue, rangeSymbol, halfHoverLinkSize) {
+    var visualMapModel = this.visualMapModel;
+    var dataExtent = visualMapModel.getExtent();
+    var itemSize = visualMapModel.itemSize;
+    var sizeExtent = [0, itemSize[1]];
+    var shapes = this._shapes;
+    var indicator = shapes.indicator;
+    if (!indicator) {
+      return;
+    }
+    indicator.attr('invisible', false);
+    var opts = {
+      convertOpacityToAlpha: true
+    };
+    var color = this.getControllerVisual(cursorValue, 'color', opts);
+    var symbolSize = this.getControllerVisual(cursorValue, 'symbolSize');
+    var y = linearMap(cursorValue, dataExtent, sizeExtent, true);
+    var x = itemSize[0] - symbolSize / 2;
+    var oldIndicatorPos = {
+      x: indicator.x,
+      y: indicator.y
+    };
+    // Update handle label position.
+    indicator.y = y;
+    indicator.x = x;
+    var textPoint = graphic.applyTransform(shapes.indicatorLabelPoint, graphic.getTransform(indicator, this.group));
+    var indicatorLabel = shapes.indicatorLabel;
+    indicatorLabel.attr('invisible', false);
+    var align = this._applyTransform('left', shapes.mainGroup);
+    var orient = this._orient;
+    var isHorizontal = orient === 'horizontal';
+    indicatorLabel.setStyle({
+      text: (rangeSymbol ? rangeSymbol : '') + visualMapModel.formatValueText(textValue),
+      verticalAlign: isHorizontal ? align : 'middle',
+      align: isHorizontal ? 'center' : align
+    });
+    var indicatorNewProps = {
+      x: x,
+      y: y,
+      style: {
+        fill: color
+      }
+    };
+    var labelNewProps = {
+      style: {
+        x: textPoint[0],
+        y: textPoint[1]
+      }
+    };
+    if (visualMapModel.ecModel.isAnimationEnabled() && !this._firstShowIndicator) {
+      var animationCfg = {
+        duration: 100,
+        easing: 'cubicInOut',
+        additive: true
+      };
+      indicator.x = oldIndicatorPos.x;
+      indicator.y = oldIndicatorPos.y;
+      indicator.animateTo(indicatorNewProps, animationCfg);
+      indicatorLabel.animateTo(labelNewProps, animationCfg);
+    } else {
+      indicator.attr(indicatorNewProps);
+      indicatorLabel.attr(labelNewProps);
+    }
+    this._firstShowIndicator = false;
+    var handleLabels = this._shapes.handleLabels;
+    if (handleLabels) {
+      for (var i = 0; i < handleLabels.length; i++) {
+        // Fade out handle labels.
+        // NOTE: Must use api enter/leave on emphasis/blur/select state. Or the global states manager will change it.
+        this.api.enterBlur(handleLabels[i]);
+      }
+    }
+  };
+  ContinuousView.prototype._enableHoverLinkToSeries = function () {
+    var self = this;
+    this._shapes.mainGroup.on('mousemove', function (e) {
+      self._hovering = true;
+      if (!self._dragging) {
+        var itemSize = self.visualMapModel.itemSize;
+        var pos = self._applyTransform([e.offsetX, e.offsetY], self._shapes.mainGroup, true, true);
+        // For hover link show when hover handle, which might be
+        // below or upper than sizeExtent.
+        pos[1] = mathMin(mathMax(0, pos[1]), itemSize[1]);
+        self._doHoverLinkToSeries(pos[1], 0 <= pos[0] && pos[0] <= itemSize[0]);
+      }
+    }).on('mouseout', function () {
+      // When mouse is out of handle, hoverLink still need
+      // to be displayed when realtime is set as false.
+      self._hovering = false;
+      !self._dragging && self._clearHoverLinkToSeries();
+    });
+  };
+  ContinuousView.prototype._enableHoverLinkFromSeries = function () {
+    var zr = this.api.getZr();
+    if (this.visualMapModel.option.hoverLink) {
+      zr.on('mouseover', this._hoverLinkFromSeriesMouseOver, this);
+      zr.on('mouseout', this._hideIndicator, this);
+    } else {
+      this._clearHoverLinkFromSeries();
+    }
+  };
+  ContinuousView.prototype._doHoverLinkToSeries = function (cursorPos, hoverOnBar) {
+    var visualMapModel = this.visualMapModel;
+    var itemSize = visualMapModel.itemSize;
+    if (!visualMapModel.option.hoverLink) {
+      return;
+    }
+    var sizeExtent = [0, itemSize[1]];
+    var dataExtent = visualMapModel.getExtent();
+    // For hover link show when hover handle, which might be below or upper than sizeExtent.
+    cursorPos = mathMin(mathMax(sizeExtent[0], cursorPos), sizeExtent[1]);
+    var halfHoverLinkSize = getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent);
+    var hoverRange = [cursorPos - halfHoverLinkSize, cursorPos + halfHoverLinkSize];
+    var cursorValue = linearMap(cursorPos, sizeExtent, dataExtent, true);
+    var valueRange = [linearMap(hoverRange[0], sizeExtent, dataExtent, true), linearMap(hoverRange[1], sizeExtent, dataExtent, true)];
+    // Consider data range is out of visualMap range, see test/visualMap-continuous.html,
+    // where china and india has very large population.
+    hoverRange[0] < sizeExtent[0] && (valueRange[0] = -Infinity);
+    hoverRange[1] > sizeExtent[1] && (valueRange[1] = Infinity);
+    // Do not show indicator when mouse is over handle,
+    // otherwise labels overlap, especially when dragging.
+    if (hoverOnBar) {
+      if (valueRange[0] === -Infinity) {
+        this._showIndicator(cursorValue, valueRange[1], '< ', halfHoverLinkSize);
+      } else if (valueRange[1] === Infinity) {
+        this._showIndicator(cursorValue, valueRange[0], '> ', halfHoverLinkSize);
+      } else {
+        this._showIndicator(cursorValue, cursorValue, '≈ ', halfHoverLinkSize);
+      }
+    }
+    // When realtime is set as false, handles, which are in barGroup,
+    // also trigger hoverLink, which help user to realize where they
+    // focus on when dragging. (see test/heatmap-large.html)
+    // When realtime is set as true, highlight will not show when hover
+    // handle, because the label on handle, which displays a exact value
+    // but not range, might mislead users.
+    var oldBatch = this._hoverLinkDataIndices;
+    var newBatch = [];
+    if (hoverOnBar || useHoverLinkOnHandle(visualMapModel)) {
+      newBatch = this._hoverLinkDataIndices = visualMapModel.findTargetDataIndices(valueRange);
+    }
+    var resultBatches = model.compressBatches(oldBatch, newBatch);
+    this._dispatchHighDown('downplay', helper.makeHighDownBatch(resultBatches[0], visualMapModel));
+    this._dispatchHighDown('highlight', helper.makeHighDownBatch(resultBatches[1], visualMapModel));
+  };
+  ContinuousView.prototype._hoverLinkFromSeriesMouseOver = function (e) {
+    var ecData;
+    event$1.findEventDispatcher(e.target, function (target) {
+      var currECData = innerStore.getECData(target);
+      if (currECData.dataIndex != null) {
+        ecData = currECData;
+        return true;
+      }
+    }, true);
+    if (!ecData) {
+      return;
+    }
+    var dataModel = this.ecModel.getSeriesByIndex(ecData.seriesIndex);
+    var visualMapModel = this.visualMapModel;
+    if (!visualMapModel.isTargetSeries(dataModel)) {
+      return;
+    }
+    var data = dataModel.getData(ecData.dataType);
+    var value = data.getStore().get(visualMapModel.getDataDimensionIndex(data), ecData.dataIndex);
+    if (!isNaN(value)) {
+      this._showIndicator(value, value);
+    }
+  };
+  ContinuousView.prototype._hideIndicator = function () {
+    var shapes = this._shapes;
+    shapes.indicator && shapes.indicator.attr('invisible', true);
+    shapes.indicatorLabel && shapes.indicatorLabel.attr('invisible', true);
+    var handleLabels = this._shapes.handleLabels;
+    if (handleLabels) {
+      for (var i = 0; i < handleLabels.length; i++) {
+        // Fade out handle labels.
+        // NOTE: Must use api enter/leave on emphasis/blur/select state. Or the global states manager will change it.
+        this.api.leaveBlur(handleLabels[i]);
+      }
+    }
+  };
+  ContinuousView.prototype._clearHoverLinkToSeries = function () {
+    this._hideIndicator();
+    var indices = this._hoverLinkDataIndices;
+    this._dispatchHighDown('downplay', helper.makeHighDownBatch(indices, this.visualMapModel));
+    indices.length = 0;
+  };
+  ContinuousView.prototype._clearHoverLinkFromSeries = function () {
+    this._hideIndicator();
+    var zr = this.api.getZr();
+    zr.off('mouseover', this._hoverLinkFromSeriesMouseOver);
+    zr.off('mouseout', this._hideIndicator);
+  };
+  ContinuousView.prototype._applyTransform = function (vertex, element, inverse, global) {
+    var transform = graphic.getTransform(element, global ? null : this.group);
+    return util.isArray(vertex) ? graphic.applyTransform(vertex, transform, inverse) : graphic.transformDirection(vertex, transform, inverse);
+  };
+  // TODO: TYPE more specified payload types.
+  ContinuousView.prototype._dispatchHighDown = function (type, batch) {
+    batch && batch.length && this.api.dispatchAction({
+      type: type,
+      batch: batch
+    });
+  };
+  /**
+   * @override
+   */
+  ContinuousView.prototype.dispose = function () {
+    this._clearHoverLinkFromSeries();
+    this._clearHoverLinkToSeries();
+  };
+  ContinuousView.type = 'visualMap.continuous';
+  return ContinuousView;
+}(VisualMapView.default);
+function createPolygon(points, cursor, onDrift, onDragEnd) {
+  return new Polygon.default({
+    shape: {
+      points: points
+    },
+    draggable: !!onDrift,
+    cursor: cursor,
+    drift: onDrift,
+    onmousemove: function (e) {
+      // For mobile device, prevent screen slider on the button.
+      event.stop(e.event);
+    },
+    ondragend: onDragEnd
+  });
+}
+function getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent) {
+  var halfHoverLinkSize = HOVER_LINK_SIZE / 2;
+  var hoverLinkDataSize = visualMapModel.get('hoverLinkDataSize');
+  if (hoverLinkDataSize) {
+    halfHoverLinkSize = linearMap(hoverLinkDataSize, dataExtent, sizeExtent, true) / 2;
+  }
+  return halfHoverLinkSize;
+}
+function useHoverLinkOnHandle(visualMapModel) {
+  var hoverLinkOnHandle = visualMapModel.get('hoverLinkOnHandle');
+  return !!(hoverLinkOnHandle == null ? visualMapModel.get('realtime') : hoverLinkOnHandle);
+}
+function getCursor(orient) {
+  return orient === 'vertical' ? 'ns-resize' : 'ew-resize';
+}
+
+exports.default = ContinuousView;