You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by su...@apache.org on 2020/03/02 08:19:04 UTC
[incubator-echarts] branch release-dev created (now 04ca4e2)
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a change to branch release-dev
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git.
at 04ca4e2 update dep to zrender@4.3.0
This branch includes the following new commits:
new 4cdca6a release: build 4.7.0
new 04ca4e2 update dep to zrender@4.3.0
The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[incubator-echarts] 02/02: update dep to zrender@4.3.0
Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch release-dev
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 04ca4e2a365a782958d0d035a3c0d397f2f0b9d0
Author: 100pah <su...@gmail.com>
AuthorDate: Mon Mar 2 16:17:51 2020 +0800
update dep to zrender@4.3.0
---
package-lock.json | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index f18660a..071ad60 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "echarts",
- "version": "4.6.0",
+ "version": "4.7.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
@@ -7265,9 +7265,9 @@
"dev": true
},
"zrender": {
- "version": "4.2.0",
- "resolved": "https://registry.npmjs.org/zrender/-/zrender-4.2.0.tgz",
- "integrity": "sha512-YJ9hxt5uFincYYU3KK31+Ce+B6PJmYYK0Q9fQ6jOUAoC/VHbe4kCKAPkxKeT7jGTxrK5wYu18R0TLGqj2zbEOA=="
+ "version": "4.3.0",
+ "resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.0.tgz",
+ "integrity": "sha512-Dii6j2bDsPkxQayuVf2DXJeruIB/mKVxxcGRZQ9GExiBd4c3w7+oBuvo1O/JGHeFeA1nCmSDVDs/S7yKZG1nrA=="
}
}
}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[incubator-echarts] 01/02: release: build 4.7.0
Posted by su...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch release-dev
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 4cdca6af1c5962934e8aa2424b151fd33fb6a2f2
Author: 100pah <su...@gmail.com>
AuthorDate: Mon Mar 2 16:13:33 2020 +0800
release: build 4.7.0
---
dist/echarts-en.common.js | 984 ++++++++++++++++++---------
dist/echarts-en.common.min.js | 2 +-
dist/echarts-en.js | 1477 +++++++++++++++++++++++++++++------------
dist/echarts-en.js.map | 2 +-
dist/echarts-en.min.js | 2 +-
dist/echarts-en.simple.js | 721 +++++++++++++-------
dist/echarts-en.simple.min.js | 2 +-
dist/echarts.common.js | 984 ++++++++++++++++++---------
dist/echarts.common.min.js | 2 +-
dist/echarts.js | 1477 +++++++++++++++++++++++++++++------------
dist/echarts.js.map | 2 +-
dist/echarts.min.js | 2 +-
dist/echarts.simple.js | 721 +++++++++++++-------
dist/echarts.simple.min.js | 2 +-
package.json | 4 +-
src/echarts.js | 4 +-
test/ut/core/extendExpect.js | 20 +
17 files changed, 4538 insertions(+), 1870 deletions(-)
diff --git a/dist/echarts-en.common.js b/dist/echarts-en.common.js
index 305307e..beb0f26 100644
--- a/dist/echarts-en.common.js
+++ b/dist/echarts-en.common.js
@@ -1285,7 +1285,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1714,6 +1718,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1736,6 +1742,153 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+var _calcOut$1 = [];
+
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+function transformLocalCoord(out, elFrom, elTarget, inX, inY) {
+ return transformCoordWithViewport(_calcOut$1, elFrom, inX, inY, true)
+ && transformCoordWithViewport(out, elTarget, _calcOut$1[0], _calcOut$1[1]);
+}
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1743,7 +1896,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1808,11 +1960,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1824,10 +1976,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1837,70 +1986,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4770,7 +4855,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4849,7 +4934,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4910,7 +4995,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4927,7 +5012,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4936,7 +5021,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4988,7 +5073,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10666,7 +10751,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10731,14 +10816,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10749,7 +10834,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10760,7 +10845,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -11027,13 +11112,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11488,7 +11576,7 @@ var instances$1 = {}; // ZRender实例map索引
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16377,12 +16465,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16391,20 +16477,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16420,12 +16508,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16434,6 +16520,16 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
var originWidth = inputShape.width;
var originHeight = inputShape.height;
+ outputShape.x = originX;
+ outputShape.y = originY;
+ outputShape.width = originWidth;
+ outputShape.height = originHeight;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
outputShape.x = subPixelOptimize$1(originX, lineWidth, true);
outputShape.y = subPixelOptimize$1(originY, lineWidth, true);
outputShape.width = Math.max(
@@ -16450,11 +16546,14 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
- * @param {number} lineWidth Should be nonnegative integer.
+ * @param {number} lineWidth If `null`/`undefined`/`0`, do not optimize.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
function subPixelOptimize$1(position, lineWidth, positiveOrNegative) {
+ if (!lineWidth) {
+ return position;
+ }
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
@@ -18155,7 +18254,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -18181,7 +18280,7 @@ function updateProps(el, props, animatableModel, dataIndex, cb) {
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -25019,8 +25118,11 @@ var createRenderPlanner = function () {
var originalLarge = fields.large;
var originalProgressive = fields.progressiveRender;
- var large = fields.large = pipelineContext.large;
- var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+ // FIXME: if the planner works on a filtered series, `pipelineContext` does not
+ // exists. See #11611 . Probably we need to modify this structure, see the comment
+ // on `performRawSeries` in `Schedular.js`.
+ var large = fields.large = pipelineContext && pipelineContext.large;
+ var progressive = fields.progressiveRender = pipelineContext && pipelineContext.progressiveRender;
return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
};
@@ -26169,6 +26271,14 @@ function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
task.dirty();
}
var performArgs = scheduler.getPerformArgs(task, opt.block);
+ // FIXME
+ // if intending to decalare `performRawSeries` in handlers, only
+ // stream-independent (specifically, data item independent) operations can be
+ // performed. Because is a series is filtered, most of the tasks will not
+ // be performed. A stream-dependent operation probably cause wrong biz logic.
+ // Perhaps we should not provide a separate callback for this case instead
+ // of providing the config `performRawSeries`. The stream-dependent operaions
+ // and stream-independent operations should better not be mixed.
performArgs.skip = !stageHandler.performRawSeries
&& ecModel.isSeriesFiltered(task.context.model);
updatePayload(task, payload);
@@ -27543,10 +27653,10 @@ var isFunction = isFunction$1;
var isObject = isObject$1;
var parseClassType = ComponentModel.parseClassType;
-var version = '4.6.0';
+var version = '4.7.0';
var dependencies = {
- zrender: '4.2.0'
+ zrender: '4.3.0'
};
var TEST_FRAME_REMAIN_TIME = 1;
@@ -33831,7 +33941,7 @@ var IntervalScale = Scale.extend({
if (extent[0] < niceTickExtent[0]) {
if (expandToNicedExtent) {
- ticks.push(roundNumber(niceTickExtent[0] - interval));
+ ticks.push(roundNumber(niceTickExtent[0] - interval, intervalPrecision));
}
else {
ticks.push(extent[0]);
@@ -33857,7 +33967,7 @@ var IntervalScale = Scale.extend({
var lastNiceTick = ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1];
if (extent[1] > lastNiceTick) {
if (expandToNicedExtent) {
- ticks.push(lastNiceTick + interval);
+ ticks.push(roundNumber(lastNiceTick + interval, intervalPrecision));
}
else {
ticks.push(extent[1]);
@@ -34405,11 +34515,6 @@ function layout(seriesType, ecModel) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
- if (isNaN(value) || isNaN(baseValue)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -34442,7 +34547,10 @@ function layout(seriesType, ecModel) {
if (Math.abs(width) < barMinHeight) {
width = (width < 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ // Ignore stack from NaN value
+ if (!isNaN(width)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ }
}
else {
var coord = cartesian.dataToPoint([baseValue, value]);
@@ -34455,7 +34563,10 @@ function layout(seriesType, ecModel) {
// Include zero to has a positive bar
height = (height <= 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ // Ignore stack from NaN value
+ if (!isNaN(height)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ }
}
data.setItemLayout(idx, {
@@ -34483,6 +34594,7 @@ var largeLayout = {
var data = seriesModel.getData();
var cartesian = seriesModel.coordinateSystem;
+ var coordLayout = cartesian.grid.getRect();
var baseAxis = cartesian.getBaseAxis();
var valueAxis = cartesian.getOtherAxis(baseAxis);
var valueDim = data.mapDimension(valueAxis.dim);
@@ -34502,6 +34614,7 @@ var largeLayout = {
function progress(params, data) {
var count = params.count;
var largePoints = new LargeArr(count * 2);
+ var largeBackgroundPoints = new LargeArr(count * 2);
var largeDataIndices = new LargeArr(count);
var dataIndex;
var coord = [];
@@ -34515,7 +34628,9 @@ var largeLayout = {
coord = cartesian.dataToPoint(valuePair, null, coord);
// Data index might not be in order, depends on `progressiveChunkMode`.
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
largePoints[pointsOffset++] = coord[0];
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
largePoints[pointsOffset++] = coord[1];
largeDataIndices[idxOffset++] = dataIndex;
}
@@ -34523,8 +34638,10 @@ var largeLayout = {
data.setLayout({
largePoints: largePoints,
largeDataIndices: largeDataIndices,
+ largeBackgroundPoints: largeBackgroundPoints,
barWidth: barWidth,
valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+ backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
valueAxisHorizontal: valueAxisHorizontal
});
}
@@ -42411,6 +42528,117 @@ function layout$1(gridModel, axisModel, opt) {
* under the License.
*/
+function rectCoordAxisBuildSplitArea(axisView, axisGroup, axisModel, gridModel) {
+ var axis = axisModel.axis;
+
+ if (axis.scale.isBlank()) {
+ return;
+ }
+
+ var splitAreaModel = axisModel.getModel('splitArea');
+ var areaStyleModel = splitAreaModel.getModel('areaStyle');
+ var areaColors = areaStyleModel.get('color');
+
+ var gridRect = gridModel.coordinateSystem.getRect();
+
+ var ticksCoords = axis.getTicksCoords({
+ tickModel: splitAreaModel,
+ clamp: true
+ });
+
+ if (!ticksCoords.length) {
+ return;
+ }
+
+ // For Making appropriate splitArea animation, the color and anid
+ // should be corresponding to previous one if possible.
+ var areaColorsLen = areaColors.length;
+ var lastSplitAreaColors = axisView.__splitAreaColors;
+ var newSplitAreaColors = createHashMap();
+ var colorIndex = 0;
+ if (lastSplitAreaColors) {
+ for (var i = 0; i < ticksCoords.length; i++) {
+ var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+ if (cIndex != null) {
+ colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+ break;
+ }
+ }
+ }
+
+ var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+ var areaStyle = areaStyleModel.getAreaStyle();
+ areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+ for (var i = 1; i < ticksCoords.length; i++) {
+ var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+ var x;
+ var y;
+ var width;
+ var height;
+ if (axis.isHorizontal()) {
+ x = prev;
+ y = gridRect.y;
+ width = tickCoord - x;
+ height = gridRect.height;
+ prev = x + width;
+ }
+ else {
+ x = gridRect.x;
+ y = prev;
+ width = gridRect.width;
+ height = tickCoord - y;
+ prev = y + height;
+ }
+
+ var tickValue = ticksCoords[i - 1].tickValue;
+ tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+ axisGroup.add(new Rect({
+ anid: tickValue != null ? 'area_' + tickValue : null,
+ shape: {
+ x: x,
+ y: y,
+ width: width,
+ height: height
+ },
+ style: defaults({
+ fill: areaColors[colorIndex]
+ }, areaStyle),
+ silent: true
+ }));
+
+ colorIndex = (colorIndex + 1) % areaColorsLen;
+ }
+
+ axisView.__splitAreaColors = newSplitAreaColors;
+}
+
+function rectCoordAxisHandleRemove(axisView) {
+ axisView.__splitAreaColors = null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied. See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
var axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
];
@@ -42462,7 +42690,7 @@ var CartesianAxisView = AxisView.extend({
},
remove: function () {
- this._splitAreaColors = null;
+ rectCoordAxisHandleRemove(this);
},
/**
@@ -42594,91 +42822,7 @@ var CartesianAxisView = AxisView.extend({
* @private
*/
_splitArea: function (axisModel, gridModel) {
- var axis = axisModel.axis;
-
- if (axis.scale.isBlank()) {
- return;
- }
-
- var splitAreaModel = axisModel.getModel('splitArea');
- var areaStyleModel = splitAreaModel.getModel('areaStyle');
- var areaColors = areaStyleModel.get('color');
-
- var gridRect = gridModel.coordinateSystem.getRect();
-
- var ticksCoords = axis.getTicksCoords({
- tickModel: splitAreaModel,
- clamp: true
- });
-
- if (!ticksCoords.length) {
- return;
- }
-
- // For Making appropriate splitArea animation, the color and anid
- // should be corresponding to previous one if possible.
- var areaColorsLen = areaColors.length;
- var lastSplitAreaColors = this._splitAreaColors;
- var newSplitAreaColors = createHashMap();
- var colorIndex = 0;
- if (lastSplitAreaColors) {
- for (var i = 0; i < ticksCoords.length; i++) {
- var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
- if (cIndex != null) {
- colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
- break;
- }
- }
- }
-
- var prev = axis.toGlobalCoord(ticksCoords[0].coord);
-
- var areaStyle = areaStyleModel.getAreaStyle();
- areaColors = isArray(areaColors) ? areaColors : [areaColors];
-
- for (var i = 1; i < ticksCoords.length; i++) {
- var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
-
- var x;
- var y;
- var width;
- var height;
- if (axis.isHorizontal()) {
- x = prev;
- y = gridRect.y;
- width = tickCoord - x;
- height = gridRect.height;
- prev = x + width;
- }
- else {
- x = gridRect.x;
- y = prev;
- width = gridRect.width;
- height = tickCoord - y;
- prev = y + height;
- }
-
- var tickValue = ticksCoords[i - 1].tickValue;
- tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
-
- this._axisGroup.add(new Rect({
- anid: tickValue != null ? 'area_' + tickValue : null,
- shape: {
- x: x,
- y: y,
- width: width,
- height: height
- },
- style: defaults({
- fill: areaColors[colorIndex]
- }, areaStyle),
- silent: true
- }));
-
- colorIndex = (colorIndex + 1) % areaColorsLen;
- }
-
- this._splitAreaColors = newSplitAreaColors;
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, gridModel);
}
});
@@ -42924,7 +43068,21 @@ BaseBarSeries.extend({
// If use caps on two sides of bars
// Only available on tangential polar bar
- roundCap: false
+ roundCap: false,
+
+ showBackground: false,
+ backgroundStyle: {
+ color: 'rgba(180, 180, 180, 0.2)',
+ borderColor: null,
+ borderWidth: 0,
+ borderType: 'solid',
+ borderRadius: 0,
+ shadowBlur: 0,
+ shadowColor: null,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ opacity: 1
+ }
}
});
@@ -43229,15 +43387,28 @@ extendChartView({
var roundCap = seriesModel.get('roundCap', true);
+ var drawBackground = seriesModel.get('showBackground', true);
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+
+ var bgEls = [];
+ var oldBgEls = this._backgroundEls || [];
+
data.diff(oldData)
.add(function (dataIndex) {
+ var itemModel = data.getItemModel(dataIndex);
+ var layout = getLayout[coord.type](data, dataIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = createBackgroundEl(coord, isHorizontalOrRadial, layout);
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[dataIndex] = bgEl;
+ }
+
+ // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
if (!data.hasValue(dataIndex)) {
return;
}
- var itemModel = data.getItemModel(dataIndex);
- var layout = getLayout[coord.type](data, dataIndex, itemModel);
-
if (needsClip) {
// Clip will modify the layout params.
// And return a boolean to determine if the shape are fully clipped.
@@ -43260,16 +43431,24 @@ extendChartView({
);
})
.update(function (newIndex, oldIndex) {
- var el = oldData.getItemGraphicEl(oldIndex);
+ var itemModel = data.getItemModel(newIndex);
+ var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = oldBgEls[oldIndex];
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[newIndex] = bgEl;
+ var shape = createBackgroundShape(isHorizontalOrRadial, layout, coord);
+ updateProps(bgEl, { shape: shape }, animationModel, newIndex);
+ }
+
+ var el = oldData.getItemGraphicEl(oldIndex);
if (!data.hasValue(newIndex)) {
group.remove(el);
return;
}
- var itemModel = data.getItemModel(newIndex);
- var layout = getLayout[coord.type](data, newIndex, itemModel);
-
if (needsClip) {
var isClipped = clip[coord.type](coordSysClipArea, layout);
if (isClipped) {
@@ -43307,6 +43486,15 @@ extendChartView({
})
.execute();
+ var bgGroup = this._backgroundGroup || (this._backgroundGroup = new Group());
+ bgGroup.removeAll();
+
+ for (var i = 0; i < bgEls.length; ++i) {
+ bgGroup.add(bgEls[i]);
+ }
+ group.add(bgGroup);
+ this._backgroundEls = bgEls;
+
this._data = data;
},
@@ -43327,6 +43515,7 @@ extendChartView({
},
_incrementalRenderLarge: function (params, seriesModel) {
+ this._removeBackground();
createLarge(seriesModel, this.group, true);
},
@@ -43340,6 +43529,9 @@ extendChartView({
var group = this.group;
var data = this._data;
if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+ this._removeBackground();
+ this._backgroundEls = [];
+
data.eachItemGraphicEl(function (el) {
if (el.type === 'sector') {
removeSector(el.dataIndex, ecModel, el);
@@ -43353,6 +43545,11 @@ extendChartView({
group.removeAll();
}
this._data = null;
+ },
+
+ _removeBackground: function () {
+ this.group.remove(this._backgroundGroup);
+ this._backgroundGroup = null;
}
});
@@ -43410,7 +43607,12 @@ var elementCreator = {
dataIndex, layout, isHorizontal,
animationModel, isUpdate
) {
- var rect = new Rect({shape: extend({}, layout)});
+ var rect = new Rect({
+ shape: extend({}, layout),
+ z2: 1
+ });
+
+ rect.name = 'item';
// Animation
if (animationModel) {
@@ -43440,9 +43642,12 @@ var elementCreator = {
var ShapeClass = (!isRadial && roundCap) ? Sausage : Sector;
var sector = new ShapeClass({
- shape: defaults({clockwise: clockwise}, layout)
+ shape: defaults({clockwise: clockwise}, layout),
+ z2: 1
});
+ sector.name = 'item';
+
// Animation
if (animationModel) {
var sectorShape = sector.shape;
@@ -43562,7 +43767,10 @@ function updateStyle(
// In case width or height are too small.
function getLineWidth(itemModel, rawLayout) {
var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
- return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+ // width or height may be NaN for empty data
+ var width = isNaN(rawLayout.width) ? Number.MAX_VALUE : Math.abs(rawLayout.width);
+ var height = isNaN(rawLayout.height) ? Number.MAX_VALUE : Math.abs(rawLayout.height);
+ return Math.min(lineWidth, width, height);
}
@@ -43594,13 +43802,38 @@ function createLarge(seriesModel, group, incremental) {
var baseDimIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
startPoint[1 - baseDimIdx] = data.getLayout('valueAxisStart');
+ var largeDataIndices = data.getLayout('largeDataIndices');
+ var barWidth = data.getLayout('barWidth');
+
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+ var drawBackground = seriesModel.get('showBackground', true);
+
+ if (drawBackground) {
+ var points = data.getLayout('largeBackgroundPoints');
+ var backgroundStartPoint = [];
+ backgroundStartPoint[1 - baseDimIdx] = data.getLayout('backgroundStart');
+
+ var bgEl = new LargePath({
+ shape: {points: points},
+ incremental: !!incremental,
+ __startPoint: backgroundStartPoint,
+ __baseDimIdx: baseDimIdx,
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth,
+ silent: true,
+ z2: 0
+ });
+ setLargeBackgroundStyle(bgEl, backgroundModel, data);
+ group.add(bgEl);
+ }
+
var el = new LargePath({
shape: {points: data.getLayout('largePoints')},
incremental: !!incremental,
__startPoint: startPoint,
__baseDimIdx: baseDimIdx,
- __largeDataIndices: data.getLayout('largeDataIndices'),
- __barWidth: data.getLayout('barWidth')
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth
});
group.add(el);
setLargeStyle(el, seriesModel, data);
@@ -43665,6 +43898,55 @@ function setLargeStyle(el, seriesModel, data) {
el.style.lineWidth = data.getLayout('barWidth');
}
+function setLargeBackgroundStyle(el, backgroundModel, data) {
+ var borderColor = backgroundModel.get('borderColor') || backgroundModel.get('color');
+ var itemStyle = backgroundModel.getItemStyle(['color', 'borderColor']);
+
+ el.useStyle(itemStyle);
+ el.style.fill = null;
+ el.style.stroke = borderColor;
+ el.style.lineWidth = data.getLayout('barWidth');
+}
+
+function createBackgroundShape(isHorizontalOrRadial, layout, coord) {
+ var coordLayout;
+ var isPolar = coord.type === 'polar';
+ if (isPolar) {
+ coordLayout = coord.getArea();
+ }
+ else {
+ coordLayout = coord.grid.getRect();
+ }
+
+ if (isPolar) {
+ return {
+ cx: coordLayout.cx,
+ cy: coordLayout.cy,
+ r0: isHorizontalOrRadial ? coordLayout.r0 : layout.r0,
+ r: isHorizontalOrRadial ? coordLayout.r : layout.r,
+ startAngle: isHorizontalOrRadial ? layout.startAngle : 0,
+ endAngle: isHorizontalOrRadial ? layout.endAngle : Math.PI * 2
+ };
+ }
+ else {
+ return {
+ x: isHorizontalOrRadial ? layout.x : coordLayout.x,
+ y: isHorizontalOrRadial ? coordLayout.y : layout.y,
+ width: isHorizontalOrRadial ? layout.width : coordLayout.width,
+ height: isHorizontalOrRadial ? coordLayout.height : layout.height
+ };
+ }
+}
+
+function createBackgroundEl(coord, isHorizontalOrRadial, layout) {
+ var ElementClz = coord.type === 'polar' ? Sector : Rect;
+ return new ElementClz({
+ shape: createBackgroundShape(isHorizontalOrRadial, layout, coord),
+ silent: true,
+ z2: 0
+ });
+}
+
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
@@ -44274,7 +44556,7 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
toggleItemSelected(
this,
data.getItemLayout(idx),
- seriesModel.isSelected(null, idx),
+ seriesModel.isSelected(data.getName(idx)),
seriesModel.get('selectedOffset'),
seriesModel.get('animation')
);
@@ -45026,7 +45308,7 @@ var labelLayout = function (seriesModel, r, viewWidth, viewHeight, viewLeft, vie
inside: isLabelInside,
labelDistance: labelDistance,
labelAlignTo: labelAlignTo,
- labelMargin:labelMargin,
+ labelMargin: labelMargin,
bleedMargin: bleedMargin,
textRect: textRect,
text: text,
@@ -48391,24 +48673,63 @@ function assembleCssText(tooltipModel) {
return cssText.join(';') + ';';
}
+// If not able to make, do not modify the input `out`.
+function makeStyleCoord(out, zr, appendToBody, zrX, zrY) {
+ var zrPainter = zr && zr.painter;
+
+ if (appendToBody) {
+ var zrViewportRoot = zrPainter && zrPainter.getViewportRoot();
+ if (zrViewportRoot) {
+ // Some APPs might use scale on body, so we support CSS transform here.
+ transformLocalCoord(out, zrViewportRoot, document.body, zrX, zrY);
+ }
+ }
+ else {
+ out[0] = zrX;
+ out[1] = zrY;
+ // xy should be based on canvas root. But tooltipContent is
+ // the sibling of canvas root. So padding of ec container
+ // should be considered here.
+ var viewportRootOffset = zrPainter && zrPainter.getViewportRootOffset();
+ if (viewportRootOffset) {
+ out[0] += viewportRootOffset.offsetLeft;
+ out[1] += viewportRootOffset.offsetTop;
+ }
+ }
+}
+
/**
* @alias module:echarts/component/tooltip/TooltipContent
+ * @param {HTMLElement} container
+ * @param {ExtensionAPI} api
+ * @param {Object} [opt]
+ * @param {boolean} [opt.appendToBody]
+ * `false`: the DOM element will be inside the container. Default value.
+ * `true`: the DOM element will be appended to HTML body, which avoid
+ * some overflow clip but intrude outside of the container.
* @constructor
*/
-function TooltipContent(container, api) {
+function TooltipContent(container, api, opt) {
if (env$1.wxa) {
return null;
}
var el = document.createElement('div');
+ el.domBelongToZr = true;
+ this.el = el;
var zr = this._zr = api.getZr();
+ var appendToBody = this._appendToBody = opt && opt.appendToBody;
- this.el = el;
+ this._styleCoord = [0, 0];
- this._x = api.getWidth() / 2;
- this._y = api.getHeight() / 2;
+ makeStyleCoord(this._styleCoord, zr, appendToBody, api.getWidth() / 2, api.getHeight() / 2);
- container.appendChild(el);
+ if (appendToBody) {
+ document.body.appendChild(el);
+ }
+ else {
+ container.appendChild(el);
+ }
this._container = container;
@@ -48442,7 +48763,8 @@ function TooltipContent(container, api) {
// Try trigger zrender event to avoid mouse
// in and out shape too frequently
var handler = zr.handler;
- normalizeEvent(container, e, true);
+ var zrViewportRoot = zr.painter.getViewportRoot();
+ normalizeEvent(zrViewportRoot, e, true);
handler.dispatch('mousemove', e);
}
};
@@ -48487,12 +48809,13 @@ TooltipContent.prototype = {
show: function (tooltipModel) {
clearTimeout(this._hideTimeout);
var el = this.el;
+ var styleCoord = this._styleCoord;
el.style.cssText = gCssText + assembleCssText(tooltipModel)
// Because of the reason described in:
// http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
// we should set initial value to `left` and `top`.
- + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+ + ';left:' + styleCoord[0] + 'px;top:' + styleCoord[1] + 'px;'
+ (tooltipModel.get('extraCssText') || '');
el.style.display = el.innerHTML ? 'block' : 'none';
@@ -48520,23 +48843,13 @@ TooltipContent.prototype = {
return [el.clientWidth, el.clientHeight];
},
- moveTo: function (x, y) {
- // xy should be based on canvas root. But tooltipContent is
- // the sibling of canvas root. So padding of ec container
- // should be considered here.
- var zr = this._zr;
- var viewportRootOffset;
- if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
- x += viewportRootOffset.offsetLeft;
- y += viewportRootOffset.offsetTop;
- }
+ moveTo: function (zrX, zrY) {
+ var styleCoord = this._styleCoord;
+ makeStyleCoord(styleCoord, this._zr, this._appendToBody, zrX, zrY);
var style = this.el.style;
- style.left = x + 'px';
- style.top = y + 'px';
-
- this._x = x;
- this._y = y;
+ style.left = styleCoord[0] + 'px';
+ style.top = styleCoord[1] + 'px';
},
hide: function () {
@@ -48562,6 +48875,10 @@ TooltipContent.prototype = {
return this._show;
},
+ dispose: function () {
+ this.el.parentNode.removeChild(this.el);
+ },
+
getOuterSize: function () {
var width = this.el.clientWidth;
var height = this.el.clientHeight;
@@ -48578,6 +48895,7 @@ TooltipContent.prototype = {
return {width: width, height: height};
}
+
};
/*
@@ -48809,7 +49127,9 @@ extendComponentView({
var tooltipContent;
if (this._renderMode === 'html') {
- tooltipContent = new TooltipContent(api.getDom(), api);
+ tooltipContent = new TooltipContent(api.getDom(), api, {
+ appendToBody: tooltipModel.get('appendToBody', true)
+ });
this._newLine = '<br/>';
}
else {
@@ -48962,7 +49282,6 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- event: {},
dataByCoordSys: payload.dataByCoordSys,
tooltipOption: payload.tooltipOption
}, dispatchAction);
@@ -48981,8 +49300,7 @@ extendComponentView({
offsetX: cx,
offsetY: cy,
position: payload.position,
- target: pointInfo.el,
- event: {}
+ target: pointInfo.el
}, dispatchAction);
}
}
@@ -48999,8 +49317,7 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- target: api.getZr().findHover(payload.x, payload.y).target,
- event: {}
+ target: api.getZr().findHover(payload.x, payload.y).target
}, dispatchAction);
}
},
@@ -49106,7 +49423,9 @@ extendComponentView({
_showAxisTooltip: function (dataByCoordSys, e) {
var ecModel = this._ecModel;
var globalTooltipModel = this._tooltipModel;
+
var point = [e.offsetX, e.offsetY];
+
var singleDefaultHTML = [];
var singleParamsList = [];
var singleTooltipModel = buildTooltipModel([
@@ -49362,6 +49681,7 @@ extendComponentView({
_updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
var viewWidth = this._api.getWidth();
var viewHeight = this._api.getHeight();
+
positionExpr = positionExpr || tooltipModel.get('position');
var contentSize = content.getSize();
@@ -49480,7 +49800,7 @@ extendComponentView({
if (env$1.node) {
return;
}
- this._tooltipContent.hide();
+ this._tooltipContent.dispose();
unregister('itemTooltip', api);
}
});
@@ -51325,26 +51645,28 @@ var ScrollableLegendView = LegendView.extend({
},
_findTargetItemIndex: function (targetDataIndex) {
+ if (!this._showController) {
+ return 0;
+ }
+
var index;
var contentGroup = this.getContentGroup();
var defaultIndex;
- if (this._showController) {
- contentGroup.eachChild(function (child, idx) {
- var legendDataIdx = child.__legendDataIndex;
- // FIXME
- // If the given targetDataIndex (from model) is illegal,
- // we use defualtIndex. But the index on the legend model and
- // action payload is still illegal. That case will not be
- // changed until some scenario requires.
- if (defaultIndex == null && legendDataIdx != null) {
- defaultIndex = idx;
- }
- if (legendDataIdx === targetDataIndex) {
- index = idx;
- }
- });
- }
+ contentGroup.eachChild(function (child, idx) {
+ var legendDataIdx = child.__legendDataIndex;
+ // FIXME
+ // If the given targetDataIndex (from model) is illegal,
+ // we use defualtIndex. But the index on the legend model and
+ // action payload is still illegal. That case will not be
+ // changed until some scenario requires.
+ if (defaultIndex == null && legendDataIdx != null) {
+ defaultIndex = idx;
+ }
+ if (legendDataIdx === targetDataIndex) {
+ index = idx;
+ }
+ });
return index != null ? index : defaultIndex;
}
@@ -51926,8 +52248,8 @@ function markerTypeCalculatorWithExtent(
var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
- coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
-
+ coordArr[targetCoordIndex] = data.get(calcDataDim, dataIndex);
+ var coordArrValue = data.get(targetDataDim, dataIndex);
// Make it simple, do not visit all stacked value to count precision.
var precision = getPrecision(data.get(targetDataDim, dataIndex));
precision = Math.min(precision, 20);
@@ -51935,7 +52257,7 @@ function markerTypeCalculatorWithExtent(
coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
}
- return coordArr;
+ return [coordArr, coordArrValue];
}
var curry$4 = curry;
@@ -51998,12 +52320,15 @@ function dataTransform(seriesModel, item) {
var otherCoordIndex = indexOf$1(dims, axisInfo.baseAxis.dim);
var targetCoordIndex = indexOf$1(dims, axisInfo.valueAxis.dim);
- item.coord = markerTypeCalculator[item.type](
+ var coordInfo = markerTypeCalculator[item.type](
data, axisInfo.baseDataDim, axisInfo.valueDataDim,
otherCoordIndex, targetCoordIndex
);
+ item.coord = coordInfo[0];
// Force to use the value of calculated value.
- item.value = item.coord[targetCoordIndex];
+ // let item use the value without stack.
+ item.value = coordInfo[1];
+
}
else {
// FIXME Only has one of xAxis and yAxis.
@@ -52395,7 +52720,8 @@ MarkerModel.extend({
},
label: {
show: true,
- position: 'end'
+ position: 'end',
+ distance: 5
},
lineStyle: {
type: 'dashed'
@@ -52620,39 +52946,90 @@ function updateSymbolAndLabelBeforeLineUpdate() {
var textPosition;
var textAlign;
var textVerticalAlign;
-
- var distance$$1 = 5 * invScale;
- // End
- if (label.__position === 'end') {
- textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
- textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
- }
- // Middle
- else if (label.__position === 'middle') {
- var halfPercent = percent / 2;
- var tangent = line.tangentAt(halfPercent);
- var n = [tangent[1], -tangent[0]];
- var cp = line.pointAt(halfPercent);
- if (n[1] > 0) {
- n[0] = -n[0];
- n[1] = -n[1];
- }
- textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
- textAlign = 'center';
- textVerticalAlign = 'bottom';
+ var textOrigin;
+
+ var distance$$1 = label.__labelDistance;
+ var distanceX = distance$$1[0] * invScale;
+ var distanceY = distance$$1[1] * invScale;
+ var halfPercent = percent / 2;
+ var tangent = line.tangentAt(halfPercent);
+ var n = [tangent[1], -tangent[0]];
+ var cp = line.pointAt(halfPercent);
+ if (n[1] > 0) {
+ n[0] = -n[0];
+ n[1] = -n[1];
+ }
+ var dir = tangent[0] < 0 ? -1 : 1;
+
+ if (label.__position !== 'start' && label.__position !== 'end') {
var rotation = -Math.atan2(tangent[1], tangent[0]);
if (toPos[0] < fromPos[0]) {
rotation = Math.PI + rotation;
}
label.attr('rotation', rotation);
}
- // Start
- else {
- textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
- textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+
+ var dy;
+ switch (label.__position) {
+ case 'insideStartTop':
+ case 'insideMiddleTop':
+ case 'insideEndTop':
+ case 'middle':
+ dy = -distanceY;
+ textVerticalAlign = 'bottom';
+ break;
+
+ case 'insideStartBottom':
+ case 'insideMiddleBottom':
+ case 'insideEndBottom':
+ dy = distanceY;
+ textVerticalAlign = 'top';
+ break;
+
+ default:
+ dy = 0;
+ textVerticalAlign = 'middle';
+ }
+
+ switch (label.__position) {
+ case 'end':
+ textPosition = [d[0] * distanceX + toPos[0], d[1] * distanceY + toPos[1]];
+ textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+ break;
+
+ case 'start':
+ textPosition = [-d[0] * distanceX + fromPos[0], -d[1] * distanceY + fromPos[1]];
+ textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+ break;
+
+ case 'insideStartTop':
+ case 'insideStart':
+ case 'insideStartBottom':
+ textPosition = [distanceX * dir + fromPos[0], fromPos[1] + dy];
+ textAlign = tangent[0] < 0 ? 'right' : 'left';
+ textOrigin = [-distanceX * dir, -dy];
+ break;
+
+ case 'insideMiddleTop':
+ case 'insideMiddle':
+ case 'insideMiddleBottom':
+ case 'middle':
+ textPosition = [cp[0], cp[1] + dy];
+ textAlign = 'center';
+ textOrigin = [0, -dy];
+ break;
+
+ case 'insideEndTop':
+ case 'insideEnd':
+ case 'insideEndBottom':
+ textPosition = [-distanceX * dir + toPos[0], toPos[1] + dy];
+ textAlign = tangent[0] >= 0 ? 'right' : 'left';
+ textOrigin = [distanceX * dir, -dy];
+ break;
}
+
label.attr({
style: {
// Use the user specified text align and baseline first
@@ -52660,7 +53037,8 @@ function updateSymbolAndLabelBeforeLineUpdate() {
textAlign: label.__textAlign || textAlign
},
position: textPosition,
- scale: [invScale, invScale]
+ scale: [invScale, invScale],
+ origin: textOrigin
});
}
}
@@ -52836,6 +53214,12 @@ lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
label.__verticalAlign = labelStyle.textVerticalAlign;
// 'start', 'middle', 'end'
label.__position = labelModel.get('position') || 'middle';
+
+ var distance$$1 = labelModel.get('distance');
+ if (!isArray(distance$$1)) {
+ distance$$1 = [distance$$1, distance$$1];
+ }
+ label.__labelDistance = distance$$1;
}
if (emphasisText != null) {
diff --git a/dist/echarts-en.common.min.js b/dist/echarts-en.common.min.js
index 4d2d1fb..012873f 100644
--- a/dist/echarts-en.common.min.js
+++ b/dist/echarts-en.common.min.js
@@ -19,4 +19,4 @@
*/
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,i=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,i=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
diff --git a/dist/echarts-en.js b/dist/echarts-en.js
index 0db470c..34f3d5b 100644
--- a/dist/echarts-en.js
+++ b/dist/echarts-en.js
@@ -1285,7 +1285,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1714,6 +1718,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1736,6 +1742,153 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+var _calcOut$1 = [];
+
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+function transformLocalCoord(out, elFrom, elTarget, inX, inY) {
+ return transformCoordWithViewport(_calcOut$1, elFrom, inX, inY, true)
+ && transformCoordWithViewport(out, elTarget, _calcOut$1[0], _calcOut$1[1]);
+}
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1743,7 +1896,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1808,11 +1960,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1824,10 +1976,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1837,70 +1986,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4770,7 +4855,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4849,7 +4934,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4910,7 +4995,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4927,7 +5012,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4936,7 +5021,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4988,7 +5073,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10666,7 +10751,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10731,14 +10816,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10749,7 +10834,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10760,7 +10845,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -11027,13 +11112,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11488,7 +11576,7 @@ var instances$1 = {}; // ZRender实例map索引
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16433,12 +16521,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16447,20 +16533,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16476,12 +16564,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16490,6 +16576,16 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
var originWidth = inputShape.width;
var originHeight = inputShape.height;
+ outputShape.x = originX;
+ outputShape.y = originY;
+ outputShape.width = originWidth;
+ outputShape.height = originHeight;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
outputShape.x = subPixelOptimize$1(originX, lineWidth, true);
outputShape.y = subPixelOptimize$1(originY, lineWidth, true);
outputShape.width = Math.max(
@@ -16506,11 +16602,14 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
- * @param {number} lineWidth Should be nonnegative integer.
+ * @param {number} lineWidth If `null`/`undefined`/`0`, do not optimize.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
function subPixelOptimize$1(position, lineWidth, positiveOrNegative) {
+ if (!lineWidth) {
+ return position;
+ }
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
@@ -18211,7 +18310,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -18237,7 +18336,7 @@ function updateProps(el, props, animatableModel, dataIndex, cb) {
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -25098,8 +25197,11 @@ var createRenderPlanner = function () {
var originalLarge = fields.large;
var originalProgressive = fields.progressiveRender;
- var large = fields.large = pipelineContext.large;
- var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+ // FIXME: if the planner works on a filtered series, `pipelineContext` does not
+ // exists. See #11611 . Probably we need to modify this structure, see the comment
+ // on `performRawSeries` in `Schedular.js`.
+ var large = fields.large = pipelineContext && pipelineContext.large;
+ var progressive = fields.progressiveRender = pipelineContext && pipelineContext.progressiveRender;
return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
};
@@ -26248,6 +26350,14 @@ function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
task.dirty();
}
var performArgs = scheduler.getPerformArgs(task, opt.block);
+ // FIXME
+ // if intending to decalare `performRawSeries` in handlers, only
+ // stream-independent (specifically, data item independent) operations can be
+ // performed. Because is a series is filtered, most of the tasks will not
+ // be performed. A stream-dependent operation probably cause wrong biz logic.
+ // Perhaps we should not provide a separate callback for this case instead
+ // of providing the config `performRawSeries`. The stream-dependent operaions
+ // and stream-independent operations should better not be mixed.
performArgs.skip = !stageHandler.performRawSeries
&& ecModel.isSeriesFiltered(task.context.model);
updatePayload(task, payload);
@@ -27626,10 +27736,10 @@ var isFunction = isFunction$1;
var isObject = isObject$1;
var parseClassType = ComponentModel.parseClassType;
-var version = '4.6.0';
+var version = '4.7.0';
var dependencies = {
- zrender: '4.2.0'
+ zrender: '4.3.0'
};
var TEST_FRAME_REMAIN_TIME = 1;
@@ -33914,7 +34024,7 @@ var IntervalScale = Scale.extend({
if (extent[0] < niceTickExtent[0]) {
if (expandToNicedExtent) {
- ticks.push(roundNumber(niceTickExtent[0] - interval));
+ ticks.push(roundNumber(niceTickExtent[0] - interval, intervalPrecision));
}
else {
ticks.push(extent[0]);
@@ -33940,7 +34050,7 @@ var IntervalScale = Scale.extend({
var lastNiceTick = ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1];
if (extent[1] > lastNiceTick) {
if (expandToNicedExtent) {
- ticks.push(lastNiceTick + interval);
+ ticks.push(roundNumber(lastNiceTick + interval, intervalPrecision));
}
else {
ticks.push(extent[1]);
@@ -34515,11 +34625,6 @@ function layout(seriesType, ecModel) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
- if (isNaN(value) || isNaN(baseValue)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -34552,7 +34657,10 @@ function layout(seriesType, ecModel) {
if (Math.abs(width) < barMinHeight) {
width = (width < 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ // Ignore stack from NaN value
+ if (!isNaN(width)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ }
}
else {
var coord = cartesian.dataToPoint([baseValue, value]);
@@ -34565,7 +34673,10 @@ function layout(seriesType, ecModel) {
// Include zero to has a positive bar
height = (height <= 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ // Ignore stack from NaN value
+ if (!isNaN(height)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ }
}
data.setItemLayout(idx, {
@@ -34593,6 +34704,7 @@ var largeLayout = {
var data = seriesModel.getData();
var cartesian = seriesModel.coordinateSystem;
+ var coordLayout = cartesian.grid.getRect();
var baseAxis = cartesian.getBaseAxis();
var valueAxis = cartesian.getOtherAxis(baseAxis);
var valueDim = data.mapDimension(valueAxis.dim);
@@ -34612,6 +34724,7 @@ var largeLayout = {
function progress(params, data) {
var count = params.count;
var largePoints = new LargeArr(count * 2);
+ var largeBackgroundPoints = new LargeArr(count * 2);
var largeDataIndices = new LargeArr(count);
var dataIndex;
var coord = [];
@@ -34625,7 +34738,9 @@ var largeLayout = {
coord = cartesian.dataToPoint(valuePair, null, coord);
// Data index might not be in order, depends on `progressiveChunkMode`.
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
largePoints[pointsOffset++] = coord[0];
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
largePoints[pointsOffset++] = coord[1];
largeDataIndices[idxOffset++] = dataIndex;
}
@@ -34633,8 +34748,10 @@ var largeLayout = {
data.setLayout({
largePoints: largePoints,
largeDataIndices: largeDataIndices,
+ largeBackgroundPoints: largeBackgroundPoints,
barWidth: barWidth,
valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+ backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
valueAxisHorizontal: valueAxisHorizontal
});
}
@@ -42521,6 +42638,117 @@ function layout$1(gridModel, axisModel, opt) {
* under the License.
*/
+function rectCoordAxisBuildSplitArea(axisView, axisGroup, axisModel, gridModel) {
+ var axis = axisModel.axis;
+
+ if (axis.scale.isBlank()) {
+ return;
+ }
+
+ var splitAreaModel = axisModel.getModel('splitArea');
+ var areaStyleModel = splitAreaModel.getModel('areaStyle');
+ var areaColors = areaStyleModel.get('color');
+
+ var gridRect = gridModel.coordinateSystem.getRect();
+
+ var ticksCoords = axis.getTicksCoords({
+ tickModel: splitAreaModel,
+ clamp: true
+ });
+
+ if (!ticksCoords.length) {
+ return;
+ }
+
+ // For Making appropriate splitArea animation, the color and anid
+ // should be corresponding to previous one if possible.
+ var areaColorsLen = areaColors.length;
+ var lastSplitAreaColors = axisView.__splitAreaColors;
+ var newSplitAreaColors = createHashMap();
+ var colorIndex = 0;
+ if (lastSplitAreaColors) {
+ for (var i = 0; i < ticksCoords.length; i++) {
+ var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+ if (cIndex != null) {
+ colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+ break;
+ }
+ }
+ }
+
+ var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+ var areaStyle = areaStyleModel.getAreaStyle();
+ areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+ for (var i = 1; i < ticksCoords.length; i++) {
+ var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+ var x;
+ var y;
+ var width;
+ var height;
+ if (axis.isHorizontal()) {
+ x = prev;
+ y = gridRect.y;
+ width = tickCoord - x;
+ height = gridRect.height;
+ prev = x + width;
+ }
+ else {
+ x = gridRect.x;
+ y = prev;
+ width = gridRect.width;
+ height = tickCoord - y;
+ prev = y + height;
+ }
+
+ var tickValue = ticksCoords[i - 1].tickValue;
+ tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+ axisGroup.add(new Rect({
+ anid: tickValue != null ? 'area_' + tickValue : null,
+ shape: {
+ x: x,
+ y: y,
+ width: width,
+ height: height
+ },
+ style: defaults({
+ fill: areaColors[colorIndex]
+ }, areaStyle),
+ silent: true
+ }));
+
+ colorIndex = (colorIndex + 1) % areaColorsLen;
+ }
+
+ axisView.__splitAreaColors = newSplitAreaColors;
+}
+
+function rectCoordAxisHandleRemove(axisView) {
+ axisView.__splitAreaColors = null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied. See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
var axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
];
@@ -42572,7 +42800,7 @@ var CartesianAxisView = AxisView.extend({
},
remove: function () {
- this._splitAreaColors = null;
+ rectCoordAxisHandleRemove(this);
},
/**
@@ -42704,91 +42932,7 @@ var CartesianAxisView = AxisView.extend({
* @private
*/
_splitArea: function (axisModel, gridModel) {
- var axis = axisModel.axis;
-
- if (axis.scale.isBlank()) {
- return;
- }
-
- var splitAreaModel = axisModel.getModel('splitArea');
- var areaStyleModel = splitAreaModel.getModel('areaStyle');
- var areaColors = areaStyleModel.get('color');
-
- var gridRect = gridModel.coordinateSystem.getRect();
-
- var ticksCoords = axis.getTicksCoords({
- tickModel: splitAreaModel,
- clamp: true
- });
-
- if (!ticksCoords.length) {
- return;
- }
-
- // For Making appropriate splitArea animation, the color and anid
- // should be corresponding to previous one if possible.
- var areaColorsLen = areaColors.length;
- var lastSplitAreaColors = this._splitAreaColors;
- var newSplitAreaColors = createHashMap();
- var colorIndex = 0;
- if (lastSplitAreaColors) {
- for (var i = 0; i < ticksCoords.length; i++) {
- var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
- if (cIndex != null) {
- colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
- break;
- }
- }
- }
-
- var prev = axis.toGlobalCoord(ticksCoords[0].coord);
-
- var areaStyle = areaStyleModel.getAreaStyle();
- areaColors = isArray(areaColors) ? areaColors : [areaColors];
-
- for (var i = 1; i < ticksCoords.length; i++) {
- var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
-
- var x;
- var y;
- var width;
- var height;
- if (axis.isHorizontal()) {
- x = prev;
- y = gridRect.y;
- width = tickCoord - x;
- height = gridRect.height;
- prev = x + width;
- }
- else {
- x = gridRect.x;
- y = prev;
- width = gridRect.width;
- height = tickCoord - y;
- prev = y + height;
- }
-
- var tickValue = ticksCoords[i - 1].tickValue;
- tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
-
- this._axisGroup.add(new Rect({
- anid: tickValue != null ? 'area_' + tickValue : null,
- shape: {
- x: x,
- y: y,
- width: width,
- height: height
- },
- style: defaults({
- fill: areaColors[colorIndex]
- }, areaStyle),
- silent: true
- }));
-
- colorIndex = (colorIndex + 1) % areaColorsLen;
- }
-
- this._splitAreaColors = newSplitAreaColors;
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, gridModel);
}
});
@@ -43034,7 +43178,21 @@ BaseBarSeries.extend({
// If use caps on two sides of bars
// Only available on tangential polar bar
- roundCap: false
+ roundCap: false,
+
+ showBackground: false,
+ backgroundStyle: {
+ color: 'rgba(180, 180, 180, 0.2)',
+ borderColor: null,
+ borderWidth: 0,
+ borderType: 'solid',
+ borderRadius: 0,
+ shadowBlur: 0,
+ shadowColor: null,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ opacity: 1
+ }
}
});
@@ -43339,15 +43497,28 @@ extendChartView({
var roundCap = seriesModel.get('roundCap', true);
+ var drawBackground = seriesModel.get('showBackground', true);
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+
+ var bgEls = [];
+ var oldBgEls = this._backgroundEls || [];
+
data.diff(oldData)
.add(function (dataIndex) {
+ var itemModel = data.getItemModel(dataIndex);
+ var layout = getLayout[coord.type](data, dataIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = createBackgroundEl(coord, isHorizontalOrRadial, layout);
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[dataIndex] = bgEl;
+ }
+
+ // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
if (!data.hasValue(dataIndex)) {
return;
}
- var itemModel = data.getItemModel(dataIndex);
- var layout = getLayout[coord.type](data, dataIndex, itemModel);
-
if (needsClip) {
// Clip will modify the layout params.
// And return a boolean to determine if the shape are fully clipped.
@@ -43370,16 +43541,24 @@ extendChartView({
);
})
.update(function (newIndex, oldIndex) {
- var el = oldData.getItemGraphicEl(oldIndex);
+ var itemModel = data.getItemModel(newIndex);
+ var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = oldBgEls[oldIndex];
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[newIndex] = bgEl;
+ var shape = createBackgroundShape(isHorizontalOrRadial, layout, coord);
+ updateProps(bgEl, { shape: shape }, animationModel, newIndex);
+ }
+
+ var el = oldData.getItemGraphicEl(oldIndex);
if (!data.hasValue(newIndex)) {
group.remove(el);
return;
}
- var itemModel = data.getItemModel(newIndex);
- var layout = getLayout[coord.type](data, newIndex, itemModel);
-
if (needsClip) {
var isClipped = clip[coord.type](coordSysClipArea, layout);
if (isClipped) {
@@ -43417,6 +43596,15 @@ extendChartView({
})
.execute();
+ var bgGroup = this._backgroundGroup || (this._backgroundGroup = new Group());
+ bgGroup.removeAll();
+
+ for (var i = 0; i < bgEls.length; ++i) {
+ bgGroup.add(bgEls[i]);
+ }
+ group.add(bgGroup);
+ this._backgroundEls = bgEls;
+
this._data = data;
},
@@ -43437,6 +43625,7 @@ extendChartView({
},
_incrementalRenderLarge: function (params, seriesModel) {
+ this._removeBackground();
createLarge(seriesModel, this.group, true);
},
@@ -43450,6 +43639,9 @@ extendChartView({
var group = this.group;
var data = this._data;
if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+ this._removeBackground();
+ this._backgroundEls = [];
+
data.eachItemGraphicEl(function (el) {
if (el.type === 'sector') {
removeSector(el.dataIndex, ecModel, el);
@@ -43463,6 +43655,11 @@ extendChartView({
group.removeAll();
}
this._data = null;
+ },
+
+ _removeBackground: function () {
+ this.group.remove(this._backgroundGroup);
+ this._backgroundGroup = null;
}
});
@@ -43520,7 +43717,12 @@ var elementCreator = {
dataIndex, layout, isHorizontal,
animationModel, isUpdate
) {
- var rect = new Rect({shape: extend({}, layout)});
+ var rect = new Rect({
+ shape: extend({}, layout),
+ z2: 1
+ });
+
+ rect.name = 'item';
// Animation
if (animationModel) {
@@ -43550,9 +43752,12 @@ var elementCreator = {
var ShapeClass = (!isRadial && roundCap) ? Sausage : Sector;
var sector = new ShapeClass({
- shape: defaults({clockwise: clockwise}, layout)
+ shape: defaults({clockwise: clockwise}, layout),
+ z2: 1
});
+ sector.name = 'item';
+
// Animation
if (animationModel) {
var sectorShape = sector.shape;
@@ -43672,7 +43877,10 @@ function updateStyle(
// In case width or height are too small.
function getLineWidth(itemModel, rawLayout) {
var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
- return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+ // width or height may be NaN for empty data
+ var width = isNaN(rawLayout.width) ? Number.MAX_VALUE : Math.abs(rawLayout.width);
+ var height = isNaN(rawLayout.height) ? Number.MAX_VALUE : Math.abs(rawLayout.height);
+ return Math.min(lineWidth, width, height);
}
@@ -43704,13 +43912,38 @@ function createLarge(seriesModel, group, incremental) {
var baseDimIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
startPoint[1 - baseDimIdx] = data.getLayout('valueAxisStart');
+ var largeDataIndices = data.getLayout('largeDataIndices');
+ var barWidth = data.getLayout('barWidth');
+
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+ var drawBackground = seriesModel.get('showBackground', true);
+
+ if (drawBackground) {
+ var points = data.getLayout('largeBackgroundPoints');
+ var backgroundStartPoint = [];
+ backgroundStartPoint[1 - baseDimIdx] = data.getLayout('backgroundStart');
+
+ var bgEl = new LargePath({
+ shape: {points: points},
+ incremental: !!incremental,
+ __startPoint: backgroundStartPoint,
+ __baseDimIdx: baseDimIdx,
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth,
+ silent: true,
+ z2: 0
+ });
+ setLargeBackgroundStyle(bgEl, backgroundModel, data);
+ group.add(bgEl);
+ }
+
var el = new LargePath({
shape: {points: data.getLayout('largePoints')},
incremental: !!incremental,
__startPoint: startPoint,
__baseDimIdx: baseDimIdx,
- __largeDataIndices: data.getLayout('largeDataIndices'),
- __barWidth: data.getLayout('barWidth')
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth
});
group.add(el);
setLargeStyle(el, seriesModel, data);
@@ -43775,6 +44008,55 @@ function setLargeStyle(el, seriesModel, data) {
el.style.lineWidth = data.getLayout('barWidth');
}
+function setLargeBackgroundStyle(el, backgroundModel, data) {
+ var borderColor = backgroundModel.get('borderColor') || backgroundModel.get('color');
+ var itemStyle = backgroundModel.getItemStyle(['color', 'borderColor']);
+
+ el.useStyle(itemStyle);
+ el.style.fill = null;
+ el.style.stroke = borderColor;
+ el.style.lineWidth = data.getLayout('barWidth');
+}
+
+function createBackgroundShape(isHorizontalOrRadial, layout, coord) {
+ var coordLayout;
+ var isPolar = coord.type === 'polar';
+ if (isPolar) {
+ coordLayout = coord.getArea();
+ }
+ else {
+ coordLayout = coord.grid.getRect();
+ }
+
+ if (isPolar) {
+ return {
+ cx: coordLayout.cx,
+ cy: coordLayout.cy,
+ r0: isHorizontalOrRadial ? coordLayout.r0 : layout.r0,
+ r: isHorizontalOrRadial ? coordLayout.r : layout.r,
+ startAngle: isHorizontalOrRadial ? layout.startAngle : 0,
+ endAngle: isHorizontalOrRadial ? layout.endAngle : Math.PI * 2
+ };
+ }
+ else {
+ return {
+ x: isHorizontalOrRadial ? layout.x : coordLayout.x,
+ y: isHorizontalOrRadial ? coordLayout.y : layout.y,
+ width: isHorizontalOrRadial ? layout.width : coordLayout.width,
+ height: isHorizontalOrRadial ? coordLayout.height : layout.height
+ };
+ }
+}
+
+function createBackgroundEl(coord, isHorizontalOrRadial, layout) {
+ var ElementClz = coord.type === 'polar' ? Sector : Rect;
+ return new ElementClz({
+ shape: createBackgroundShape(isHorizontalOrRadial, layout, coord),
+ silent: true,
+ z2: 0
+ });
+}
+
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
@@ -44384,7 +44666,7 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
toggleItemSelected(
this,
data.getItemLayout(idx),
- seriesModel.isSelected(null, idx),
+ seriesModel.isSelected(data.getName(idx)),
seriesModel.get('selectedOffset'),
seriesModel.get('animation')
);
@@ -45136,7 +45418,7 @@ var labelLayout = function (seriesModel, r, viewWidth, viewHeight, viewLeft, vie
inside: isLabelInside,
labelDistance: labelDistance,
labelAlignTo: labelAlignTo,
- labelMargin:labelMargin,
+ labelMargin: labelMargin,
bleedMargin: bleedMargin,
textRect: textRect,
text: text,
@@ -46179,6 +46461,7 @@ Radar.prototype.update = function (ecModel, api) {
var fixedMax = axisModel.getMax();
var interval = scale.getInterval();
+
if (fixedMin != null && fixedMax != null) {
// User set min, max, divide to get new interval
scale.setExtent(+fixedMin, +fixedMax);
@@ -46214,13 +46497,10 @@ Radar.prototype.update = function (ecModel, api) {
if (nicedSplitNumber > splitNumber) {
interval = increaseInterval(interval);
}
- // PENDING
- var center = Math.round((rawExtent[0] + rawExtent[1]) / 2 / interval) * interval;
- var halfSplitNumber = Math.round(splitNumber / 2);
- scale.setExtent(
- round$1(center - halfSplitNumber * interval),
- round$1(center + (splitNumber - halfSplitNumber) * interval)
- );
+ // TODO
+ var max = Math.ceil(rawExtent[1] / interval) * interval;
+ var min = round$1(max - interval * splitNumber);
+ scale.setExtent(min, max);
scale.setInterval(interval);
}
});
@@ -46668,6 +46948,28 @@ var RadarSeries = SeriesModel.extend({
}).join('<br />');
},
+ /**
+ * @implement
+ */
+ getTooltipPosition: function (dataIndex) {
+ if (dataIndex != null) {
+ var data = this.getData();
+ var coordSys = this.coordinateSystem;
+ var values = data.getValues(
+ map(coordSys.dimensions, function (dim) {
+ return data.mapDimension(dim);
+ }), dataIndex, true
+ );
+
+ for (var i = 0, len = values.length; i < len; i++) {
+ if (!isNaN(values[i])) {
+ var indicatorAxes = coordSys.getIndicatorAxes();
+ return coordSys.coordToPoint(indicatorAxes[i].dataToCoord(values[i]), i);
+ }
+ }
+ }
+ },
+
defaultOption: {
zlevel: 0,
z: 2,
@@ -48442,13 +48744,13 @@ MapDraw.prototype = {
var regionsGroup = this._regionsGroup;
var group = this.group;
- if (geo._roamTransformable.transform) {
- group.transform = geo._roamTransformable.transform.slice();
- group.decomposeTransform();
- }
+ var transformInfo = geo.getTransformInfo();
+ group.transform = transformInfo.roamTransform;
+ group.decomposeTransform();
+ group.dirty();
- var scale = geo._rawTransformable.scale;
- var position = geo._rawTransformable.position;
+ var scale = transformInfo.rawScale;
+ var position = transformInfo.rawPosition;
regionsGroup.removeAll();
@@ -49254,7 +49556,6 @@ View.prototype = {
/**
* Remove roam
*/
-
_updateCenterAndZoom: function () {
// Must update after view transform updated
var rawTransformMatrix = this._rawTransformable.getLocalTransform();
@@ -49298,6 +49599,16 @@ View.prototype = {
this.decomposeTransform();
},
+ getTransformInfo: function () {
+ var roamTransform = this._roamTransformable.transform;
+ var rawTransformable = this._rawTransformable;
+ return {
+ roamTransform: roamTransform ? slice(roamTransform) : create$1(),
+ rawScale: slice(rawTransformable.scale),
+ rawPosition: slice(rawTransformable.position)
+ };
+ },
+
/**
* @return {module:zrender/core/BoundingRect}
*/
@@ -50914,6 +51225,11 @@ SeriesModel.extend({
// the layout of the tree, two value can be selected, 'orthogonal' or 'radial'
layout: 'orthogonal',
+ // value can be 'polyline'
+ edgeShape: 'curve',
+
+ edgeForkPosition: '50%',
+
// true | false | 'move' | 'scale', see module:component/helper/RoamController.
roam: false,
@@ -51318,6 +51634,58 @@ function defaultSeparation(node1, node2) {
* under the License.
*/
+var TreeShape = extendShape({
+ shape: {
+ parentPoint: [],
+ childPoints: [],
+ orient: '',
+ forkPosition: ''
+ },
+
+ style: {
+ stroke: '#000',
+ fill: null
+ },
+
+ buildPath: function (ctx, shape) {
+ var childPoints = shape.childPoints;
+ var childLen = childPoints.length;
+ var parentPoint = shape.parentPoint;
+ var firstChildPos = childPoints[0];
+ var lastChildPos = childPoints[childLen - 1];
+
+ if (childLen === 1) {
+ ctx.moveTo(parentPoint[0], parentPoint[1]);
+ ctx.lineTo(firstChildPos[0], firstChildPos[1]);
+ return;
+ }
+
+ var orient = shape.orient;
+ var forkDim = (orient === 'TB' || orient === 'BT') ? 0 : 1;
+ var otherDim = 1 - forkDim;
+ var forkPosition = parsePercent$1(shape.forkPosition, 1);
+ var tmpPoint = [];
+ tmpPoint[forkDim] = parentPoint[forkDim];
+ tmpPoint[otherDim] = parentPoint[otherDim] + (lastChildPos[otherDim] - parentPoint[otherDim]) * forkPosition;
+
+ ctx.moveTo(parentPoint[0], parentPoint[1]);
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ ctx.moveTo(firstChildPos[0], firstChildPos[1]);
+ tmpPoint[forkDim] = firstChildPos[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ tmpPoint[forkDim] = lastChildPos[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ ctx.lineTo(lastChildPos[0], lastChildPos[1]);
+
+ for (var i = 1; i < childLen - 1; i++) {
+ var point = childPoints[i];
+ ctx.moveTo(point[0], point[1]);
+ tmpPoint[forkDim] = point[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ }
+ }
+});
+
extendChartView({
type: 'tree',
@@ -51377,6 +51745,8 @@ extendChartView({
var seriesScope = {
expandAndCollapse: seriesModel.get('expandAndCollapse'),
layout: layout,
+ edgeShape: seriesModel.get('edgeShape'),
+ edgeForkPosition: seriesModel.get('edgeForkPosition'),
orient: seriesModel.getOrient(),
curvature: seriesModel.get('lineStyle.curveness'),
symbolRotate: seriesModel.get('symbolRotate'),
@@ -51678,22 +52048,72 @@ function updateNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
});
}
- if (node.parentNode && node.parentNode !== virtualRoot) {
- var edge = symbolEl.__edge;
- if (!edge) {
- edge = symbolEl.__edge = new BezierCurve({
- shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
- style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
- });
- }
+ drawEdge(
+ seriesModel, node, virtualRoot, symbolEl, sourceOldLayout,
+ sourceLayout, targetLayout, group, seriesScope
+ );
- updateProps(edge, {
- shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
- style: {opacity: 1}
- }, seriesModel);
+}
+
+function drawEdge(
+ seriesModel, node, virtualRoot, symbolEl, sourceOldLayout,
+ sourceLayout, targetLayout, group, seriesScope
+) {
+
+ var edgeShape = seriesScope.edgeShape;
+ var edge = symbolEl.__edge;
+ if (edgeShape === 'curve') {
+ if (node.parentNode && node.parentNode !== virtualRoot) {
+ if (!edge) {
+ edge = symbolEl.__edge = new BezierCurve({
+ shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
+ style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
+ });
+ }
+
+ updateProps(edge, {
+ shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
+ style: {opacity: 1}
+ }, seriesModel);
+ }
+ }
+ else if (edgeShape === 'polyline') {
+ if (seriesScope.layout === 'orthogonal') {
+ if (node !== virtualRoot && node.children && (node.children.length !== 0) && (node.isExpand === true)) {
+ var children = node.children;
+ var childPoints = [];
+ for (var i = 0; i < children.length; i++) {
+ var childLayout = children[i].getLayout();
+ childPoints.push([childLayout.x, childLayout.y]);
+ }
- group.add(edge);
+ if (!edge) {
+ edge = symbolEl.__edge = new TreeShape({
+ shape: {
+ parentPoint: [targetLayout.x, targetLayout.y],
+ childPoints: [[targetLayout.x, targetLayout.y]],
+ orient: seriesScope.orient,
+ forkPosition: seriesScope.edgeForkPosition
+ },
+ style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
+ });
+ }
+ updateProps(edge, {
+ shape: {
+ parentPoint: [targetLayout.x, targetLayout.y],
+ childPoints: childPoints
+ },
+ style: {opacity: 1}
+ }, seriesModel);
+ }
+ }
+ else {
+ if (__DEV__) {
+ throw new Error('The polyline edgeShape can only be used in orthogonal layout');
+ }
+ }
}
+ group.add(edge);
}
function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
@@ -51703,6 +52123,7 @@ function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+ var edgeShape = seriesScope.edgeShape;
var sourceLayout;
while (sourceLayout = source.getLayout(), sourceLayout == null) {
source = source.parentNode === virtualRoot ? source : source.parentNode || source;
@@ -51717,16 +52138,42 @@ function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
symbolEl.fadeOut(null, {keepLabel: true});
- var edge = symbolEl.__edge;
+ var sourceSymbolEl = data.getItemGraphicEl(source.dataIndex);
+ var sourceEdge = sourceSymbolEl.__edge;
+
+ // 1. when expand the sub tree, delete the children node should delete the edge of
+ // the source at the same time. because the polyline edge shape is only owned by the source.
+ // 2.when the node is the only children of the source, delete the node should delete the edge of
+ // the source at the same time. the same reason as above.
+ var edge = symbolEl.__edge
+ || ((source.isExpand === false || source.children.length === 1) ? sourceEdge : undefined);
+
+ var edgeShape = seriesScope.edgeShape;
+
if (edge) {
- updateProps(edge, {
- shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
- style: {
- opacity: 0
- }
- }, seriesModel, function () {
- group.remove(edge);
- });
+ if (edgeShape === 'curve') {
+ updateProps(edge, {
+ shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
+ style: {
+ opacity: 0
+ }
+ }, seriesModel, function () {
+ group.remove(edge);
+ });
+ }
+ else if (edgeShape === 'polyline' && seriesScope.layout === 'orthogonal') {
+ updateProps(edge, {
+ shape: {
+ parentPoint: [sourceLayout.x, sourceLayout.y],
+ childPoints: [[sourceLayout.x, sourceLayout.y]]
+ },
+ style: {
+ opacity: 0
+ }
+ }, seriesModel, function () {
+ group.remove(edge);
+ });
+ }
}
}
@@ -52968,6 +53415,7 @@ extendChartView({
var thisStorage = createStorage();
var oldStorage = this._storage;
var willInvisibleEls = [];
+
var doRenderNode = curry(
renderNode, seriesModel,
thisStorage, oldStorage, reRoot,
@@ -53466,6 +53914,11 @@ function renderNode(
// Start of closure variables available in "Procedures in renderNode".
var thisLayout = thisNode.getLayout();
+ var data = seriesModel.getData();
+
+ // Only for enabling highlight/downplay. Clear firstly.
+ // Because some node will not be rendered.
+ data.setItemGraphicEl(thisNode.dataIndex, null);
if (!thisLayout || !thisLayout.isInView) {
return;
@@ -53505,14 +53958,36 @@ function renderNode(
return group;
}
+ var nodeModel = thisNode.getModel();
+
// Background
var bg = giveGraphic('background', Rect$1, depth, Z_BG);
bg && renderBackground(group, bg, isParent && thisLayout.upperHeight);
// No children, render content.
- if (!isParent) {
+ if (isParent) {
+ // Because of the implementation about "traverse" in graphic hover style, we
+ // can not set hover listener on the "group" of non-leaf node. Otherwise the
+ // hover event from the descendents will be listenered.
+ if (isHighDownDispatcher(group)) {
+ setAsHighDownDispatcher(group, false);
+ }
+ if (bg) {
+ setAsHighDownDispatcher(bg, true);
+ // Only for enabling highlight/downplay.
+ data.setItemGraphicEl(thisNode.dataIndex, bg);
+ }
+ }
+ else {
var content = giveGraphic('content', Rect$1, depth, Z_CONTENT);
content && renderContent(group, content);
+
+ if (bg && isHighDownDispatcher(bg)) {
+ setAsHighDownDispatcher(bg, false);
+ }
+ setAsHighDownDispatcher(group, true);
+ // Only for enabling highlight/downplay.
+ data.setItemGraphicEl(thisNode.dataIndex, group);
}
return group;
@@ -53527,10 +54002,17 @@ function renderNode(
bg.seriesIndex = seriesModel.seriesIndex;
bg.setShape({x: 0, y: 0, width: thisWidth, height: thisHeight});
- var visualBorderColor = thisNode.getVisual('borderColor', true);
- var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
- updateStyle(bg, function () {
+ if (thisInvisible) {
+ // If invisible, do not set visual, otherwise the element will
+ // change immediately before animation. We think it is OK to
+ // remain its origin color when moving out of the view window.
+ processInvisible(bg);
+ }
+ else {
+ bg.invisible = false;
+ var visualBorderColor = thisNode.getVisual('borderColor', true);
+ var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
var normalStyle = getItemStyleNormal(itemStyleNormalModel);
normalStyle.fill = visualBorderColor;
var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
@@ -53550,8 +54032,8 @@ function renderNode(
}
bg.setStyle(normalStyle);
- setHoverStyle(bg, emphasisStyle);
- });
+ setElementHoverStyle(bg, emphasisStyle);
+ }
group.add(bg);
}
@@ -53572,8 +54054,15 @@ function renderNode(
height: contentHeight
});
- var visualColor = thisNode.getVisual('color', true);
- updateStyle(content, function () {
+ if (thisInvisible) {
+ // If invisible, do not set visual, otherwise the element will
+ // change immediately before animation. We think it is OK to
+ // remain its origin color when moving out of the view window.
+ processInvisible(content);
+ }
+ else {
+ content.invisible = false;
+ var visualColor = thisNode.getVisual('color', true);
var normalStyle = getItemStyleNormal(itemStyleNormalModel);
normalStyle.fill = visualColor;
var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
@@ -53581,32 +54070,19 @@ function renderNode(
prepareText(normalStyle, emphasisStyle, visualColor, contentWidth, contentHeight);
content.setStyle(normalStyle);
- setHoverStyle(content, emphasisStyle);
- });
+ setElementHoverStyle(content, emphasisStyle);
+ }
group.add(content);
}
- function updateStyle(element, cb) {
- if (!thisInvisible) {
- // If invisible, do not set visual, otherwise the element will
- // change immediately before animation. We think it is OK to
- // remain its origin color when moving out of the view window.
- cb();
-
- if (!element.__tmWillVisible) {
- element.invisible = false;
- }
- }
- else {
- // Delay invisible setting utill animation finished,
- // avoid element vanish suddenly before animation.
- !element.invisible && willInvisibleEls.push(element);
- }
+ function processInvisible(element) {
+ // Delay invisible setting utill animation finished,
+ // avoid element vanish suddenly before animation.
+ !element.invisible && willInvisibleEls.push(element);
}
function prepareText(normalStyle, emphasisStyle, visualColor, width, height, upperLabelRect) {
- var nodeModel = thisNode.getModel();
var text = retrieve(
seriesModel.getFormattedLabel(
thisNode.dataIndex, 'normal', null, null, upperLabelRect ? 'upperLabel' : 'label'
@@ -53703,6 +54179,7 @@ function renderNode(
// Fade in, user can be aware that these nodes are new.
lastCfg.fadein = storageName !== 'nodeGroup';
}
+
}
// We can not set all backgroud with the same z, Because the behaviour of
@@ -56118,7 +56595,8 @@ var GraphSeries = extendSeriesModel({
edgeSymbol: ['none', 'none'],
edgeSymbolSize: 10,
edgeLabel: {
- position: 'middle'
+ position: 'middle',
+ distance: 5
},
draggable: false,
@@ -56372,39 +56850,90 @@ function updateSymbolAndLabelBeforeLineUpdate() {
var textPosition;
var textAlign;
var textVerticalAlign;
-
- var distance$$1 = 5 * invScale;
- // End
- if (label.__position === 'end') {
- textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
- textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
- }
- // Middle
- else if (label.__position === 'middle') {
- var halfPercent = percent / 2;
- var tangent = line.tangentAt(halfPercent);
- var n = [tangent[1], -tangent[0]];
- var cp = line.pointAt(halfPercent);
- if (n[1] > 0) {
- n[0] = -n[0];
- n[1] = -n[1];
- }
- textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
- textAlign = 'center';
- textVerticalAlign = 'bottom';
+ var textOrigin;
+
+ var distance$$1 = label.__labelDistance;
+ var distanceX = distance$$1[0] * invScale;
+ var distanceY = distance$$1[1] * invScale;
+ var halfPercent = percent / 2;
+ var tangent = line.tangentAt(halfPercent);
+ var n = [tangent[1], -tangent[0]];
+ var cp = line.pointAt(halfPercent);
+ if (n[1] > 0) {
+ n[0] = -n[0];
+ n[1] = -n[1];
+ }
+ var dir = tangent[0] < 0 ? -1 : 1;
+
+ if (label.__position !== 'start' && label.__position !== 'end') {
var rotation = -Math.atan2(tangent[1], tangent[0]);
if (toPos[0] < fromPos[0]) {
rotation = Math.PI + rotation;
}
label.attr('rotation', rotation);
}
- // Start
- else {
- textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
- textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+
+ var dy;
+ switch (label.__position) {
+ case 'insideStartTop':
+ case 'insideMiddleTop':
+ case 'insideEndTop':
+ case 'middle':
+ dy = -distanceY;
+ textVerticalAlign = 'bottom';
+ break;
+
+ case 'insideStartBottom':
+ case 'insideMiddleBottom':
+ case 'insideEndBottom':
+ dy = distanceY;
+ textVerticalAlign = 'top';
+ break;
+
+ default:
+ dy = 0;
+ textVerticalAlign = 'middle';
+ }
+
+ switch (label.__position) {
+ case 'end':
+ textPosition = [d[0] * distanceX + toPos[0], d[1] * distanceY + toPos[1]];
+ textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+ break;
+
+ case 'start':
+ textPosition = [-d[0] * distanceX + fromPos[0], -d[1] * distanceY + fromPos[1]];
+ textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+ break;
+
+ case 'insideStartTop':
+ case 'insideStart':
+ case 'insideStartBottom':
+ textPosition = [distanceX * dir + fromPos[0], fromPos[1] + dy];
+ textAlign = tangent[0] < 0 ? 'right' : 'left';
+ textOrigin = [-distanceX * dir, -dy];
+ break;
+
+ case 'insideMiddleTop':
+ case 'insideMiddle':
+ case 'insideMiddleBottom':
+ case 'middle':
+ textPosition = [cp[0], cp[1] + dy];
+ textAlign = 'center';
+ textOrigin = [0, -dy];
+ break;
+
+ case 'insideEndTop':
+ case 'insideEnd':
+ case 'insideEndBottom':
+ textPosition = [-distanceX * dir + toPos[0], toPos[1] + dy];
+ textAlign = tangent[0] >= 0 ? 'right' : 'left';
+ textOrigin = [distanceX * dir, -dy];
+ break;
}
+
label.attr({
style: {
// Use the user specified text align and baseline first
@@ -56412,7 +56941,8 @@ function updateSymbolAndLabelBeforeLineUpdate() {
textAlign: label.__textAlign || textAlign
},
position: textPosition,
- scale: [invScale, invScale]
+ scale: [invScale, invScale],
+ origin: textOrigin
});
}
}
@@ -56588,6 +57118,12 @@ lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
label.__verticalAlign = labelStyle.textVerticalAlign;
// 'start', 'middle', 'end'
label.__position = labelModel.get('position') || 'middle';
+
+ var distance$$1 = labelModel.get('distance');
+ if (!isArray(distance$$1)) {
+ distance$$1 = [distance$$1, distance$$1];
+ }
+ label.__labelDistance = distance$$1;
}
if (emphasisText != null) {
@@ -57282,7 +57818,7 @@ extendChartView({
},
focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var data = this._model.getData();
+ var data = seriesModel.getData();
var graph = data.graph;
var dataIndex = payload.dataIndex;
var edgeDataIndex = payload.edgeDataIndex;
@@ -57320,7 +57856,7 @@ extendChartView({
},
unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var graph = this._model.getData().graph;
+ var graph = seriesModel.getData().graph;
graph.eachNode(function (node) {
fadeOutItem(node, nodeOpacityPath);
@@ -62836,6 +63372,17 @@ var SankeySeries = SeriesModel.extend({
}
},
+ // Override Series.getDataParams()
+ getDataParams: function (dataIndex, dataType) {
+ var params = SankeySeries.superCall(this, 'getDataParams', dataIndex, dataType);
+ if (params.value == null && dataType === 'node') {
+ var node = this.getGraph().getNodeByIndex(dataIndex);
+ var nodeValue = node.getLayout().value;
+ params.value = nodeValue;
+ }
+ return params;
+ },
+
defaultOption: {
zlevel: 0,
z: 2,
@@ -62896,7 +63443,7 @@ var SankeySeries = SeriesModel.extend({
show: true
},
lineStyle: {
- opacity: 0.6
+ opacity: 0.5
}
},
@@ -62927,7 +63474,9 @@ var SankeySeries = SeriesModel.extend({
*/
var nodeOpacityPath$1 = ['itemStyle', 'opacity'];
+var hoverNodeOpacityPath = ['emphasis', 'itemStyle', 'opacity'];
var lineOpacityPath$1 = ['lineStyle', 'opacity'];
+var hoverLineOpacityPath = ['emphasis', 'lineStyle', 'opacity'];
function getItemOpacity$1(item, opacityPath) {
return item.getVisual('opacity') || item.getModel().get(opacityPath);
@@ -62935,8 +63484,8 @@ function getItemOpacity$1(item, opacityPath) {
function fadeOutItem$1(item, opacityPath, opacityRatio) {
var el = item.getGraphicEl();
-
var opacity = getItemOpacity$1(item, opacityPath);
+
if (opacityRatio != null) {
opacity == null && (opacity = 1);
opacity *= opacityRatio;
@@ -62954,12 +63503,14 @@ function fadeInItem$1(item, opacityPath) {
var opacity = getItemOpacity$1(item, opacityPath);
var el = item.getGraphicEl();
- el.highlight && el.highlight();
el.traverse(function (child) {
if (child.type !== 'group') {
child.setStyle('opacity', opacity);
}
});
+
+ // Support emphasis here.
+ el.highlight && el.highlight();
}
var SankeyShape = extendShape({
@@ -62997,6 +63548,14 @@ var SankeyShape = extendShape({
);
}
ctx.closePath();
+ },
+
+ highlight: function () {
+ this.trigger('emphasis');
+ },
+
+ downplay: function () {
+ this.trigger('normal');
}
});
@@ -63179,8 +63738,19 @@ extendChartView({
el.cursor = 'move';
}
+ el.highlight = function () {
+ this.trigger('emphasis');
+ };
+
+ el.downplay = function () {
+ this.trigger('normal');
+ };
+
+ el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+ el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
+
if (itemModel.get('focusNodeAdjacency')) {
- el.off('mouseover').on('mouseover', function () {
+ el.on('mouseover', el.focusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._clearTimer();
api.dispatchAction({
@@ -63190,7 +63760,8 @@ extendChartView({
});
}
});
- el.off('mouseout').on('mouseout', function () {
+
+ el.on('mouseout', el.unfocusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._dispatchUnfocus(api);
}
@@ -63200,8 +63771,12 @@ extendChartView({
edgeData.eachItemGraphicEl(function (el, dataIndex) {
var edgeModel = edgeData.getItemModel(dataIndex);
+
+ el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+ el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
+
if (edgeModel.get('focusNodeAdjacency')) {
- el.off('mouseover').on('mouseover', function () {
+ el.on('mouseover', el.focusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._clearTimer();
api.dispatchAction({
@@ -63211,7 +63786,8 @@ extendChartView({
});
}
});
- el.off('mouseout').on('mouseout', function () {
+
+ el.on('mouseout', el.unfocusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._dispatchUnfocus(api);
}
@@ -63252,7 +63828,7 @@ extendChartView({
},
focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var data = this._model.getData();
+ var data = seriesModel.getData();
var graph = data.graph;
var dataIndex = payload.dataIndex;
var itemModel = data.getItemModel(dataIndex);
@@ -63272,15 +63848,15 @@ extendChartView({
});
if (node) {
- fadeInItem$1(node, nodeOpacityPath$1);
+ fadeInItem$1(node, hoverNodeOpacityPath);
var focusNodeAdj = itemModel.get('focusNodeAdjacency');
if (focusNodeAdj === 'outEdges') {
each$1(node.outEdges, function (edge) {
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node2, hoverNodeOpacityPath);
});
}
else if (focusNodeAdj === 'inEdges') {
@@ -63288,8 +63864,8 @@ extendChartView({
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node1, hoverNodeOpacityPath);
});
}
else if (focusNodeAdj === 'allEdges') {
@@ -63297,21 +63873,21 @@ extendChartView({
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ (edge.node1 !== node) && fadeInItem$1(edge.node1, hoverNodeOpacityPath);
+ (edge.node2 !== node) && fadeInItem$1(edge.node2, hoverNodeOpacityPath);
});
}
}
if (edge) {
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node1, hoverNodeOpacityPath);
+ fadeInItem$1(edge.node2, hoverNodeOpacityPath);
}
},
unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var graph = this._model.getGraph();
+ var graph = seriesModel.getGraph();
graph.eachNode(function (node) {
fadeOutItem$1(node, nodeOpacityPath$1);
@@ -63334,8 +63910,7 @@ function createGridClipShape$1(rect, seriesModel, cb) {
});
initProps(rectEl, {
shape: {
- width: rect.width + 20,
- height: rect.height + 20
+ width: rect.width + 20
}
}, seriesModel, cb);
@@ -63457,7 +64032,8 @@ function computeNodeValues(nodes) {
each$1(nodes, function (node) {
var value1 = sum(node.outEdges, getEdgeValue);
var value2 = sum(node.inEdges, getEdgeValue);
- var value = Math.max(value1, value2);
+ var nodeRawValue = node.getValue() || 0;
+ var value = Math.max(value1, value2, nodeRawValue);
node.setLayout({value: value}, true);
});
}
@@ -63801,12 +64377,12 @@ function getEdgeValue(edge) {
return edge.getValue();
}
-function sum(array, f, orient) {
+function sum(array, cb, orient) {
var sum = 0;
var len = array.length;
var i = -1;
while (++i < len) {
- var value = +f.call(array, array[i], orient);
+ var value = +cb.call(array, array[i], orient);
if (!isNaN(value)) {
sum += value;
}
@@ -65107,7 +65683,6 @@ var candlestickVisual = {
reset: function (seriesModel, ecModel) {
var data = seriesModel.getData();
- var isLargeRender = seriesModel.pipelineContext.large;
data.setVisual({
legendSymbol: 'roundRect',
@@ -65122,6 +65697,7 @@ var candlestickVisual = {
return;
}
+ var isLargeRender = seriesModel.pipelineContext.large;
return !isLargeRender && {progress: progress};
@@ -66218,6 +66794,7 @@ effectLineProto._updateEffectSymbol = function (lineData, idx) {
symbol.attr('scale', size);
this._symbolType = symbolType;
+ this._symbolScale = size;
this._updateEffectAnimation(lineData, effectModel, idx);
};
@@ -66308,6 +66885,7 @@ effectLineProto.updateSymbolPosition = function (symbol) {
var cp1 = symbol.__cp1;
var t = symbol.__t;
var pos = symbol.position;
+ var lastPos = [pos[0], pos[1]];
var quadraticAt$$1 = quadraticAt;
var quadraticDerivativeAt$$1 = quadraticDerivativeAt;
pos[0] = quadraticAt$$1(p1[0], cp1[0], p2[0], t);
@@ -66318,7 +66896,27 @@ effectLineProto.updateSymbolPosition = function (symbol) {
var ty = quadraticDerivativeAt$$1(p1[1], cp1[1], p2[1], t);
symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
-
+ // enable continuity trail for 'line', 'rect', 'roundRect' symbolType
+ if (this._symbolType === 'line' || this._symbolType === 'rect' || this._symbolType === 'roundRect') {
+ if (symbol.__lastT !== undefined && symbol.__lastT < symbol.__t) {
+ var scaleY = dist(lastPos, pos) * 1.05;
+ symbol.attr('scale', [symbol.scale[0], scaleY]);
+ // make sure the last segment render within endPoint
+ if (t === 1) {
+ pos[0] = lastPos[0] + (pos[0] - lastPos[0]) / 2;
+ pos[1] = lastPos[1] + (pos[1] - lastPos[1]) / 2;
+ }
+ }
+ else if (symbol.__lastT === 1) {
+ // After first loop, symbol.__t does NOT start with 0, so connect p1 to pos directly.
+ var scaleY = 2 * dist(p1, pos);
+ symbol.attr('scale', [symbol.scale[0], scaleY ]);
+ }
+ else {
+ symbol.attr('scale', this._symbolScale);
+ }
+ }
+ symbol.__lastT = symbol.__t;
symbol.ignore = false;
};
@@ -69144,7 +69742,7 @@ var axisBuilderAttrs$2 = [
'axisLine', 'axisTickLabel', 'axisName'
];
-var selfBuilderAttr = 'splitLine';
+var selfBuilderAttrs$1 = ['splitArea', 'splitLine'];
var SingleAxisView = AxisView.extend({
@@ -69158,21 +69756,33 @@ var SingleAxisView = AxisView.extend({
group.removeAll();
+ var oldAxisGroup = this._axisGroup;
+ this._axisGroup = new Group();
+
var layout = layout$2(axisModel);
var axisBuilder = new AxisBuilder(axisModel, layout);
each$1(axisBuilderAttrs$2, axisBuilder.add, axisBuilder);
+ group.add(this._axisGroup);
group.add(axisBuilder.getGroup());
- if (axisModel.get(selfBuilderAttr + '.show')) {
- this['_' + selfBuilderAttr](axisModel);
- }
+ each$1(selfBuilderAttrs$1, function (name) {
+ if (axisModel.get(name + '.show')) {
+ this['_' + name](axisModel);
+ }
+ }, this);
+
+ groupTransition(oldAxisGroup, this._axisGroup, axisModel);
SingleAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
},
+ remove: function () {
+ rectCoordAxisHandleRemove(this);
+ },
+
_splitLine: function (axisModel) {
var axis = axisModel.axis;
@@ -69241,6 +69851,10 @@ var SingleAxisView = AxisView.extend({
silent: true
}));
}
+ },
+
+ _splitArea: function (axisModel) {
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, axisModel);
}
});
@@ -74267,10 +74881,6 @@ function barLayoutPolar(seriesType, ecModel, api) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- if (isNaN(value)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -75659,7 +76269,7 @@ AxisView.extend({
var axisBuilderAttrs$3 = [
'axisLine', 'axisTickLabel', 'axisName'
];
-var selfBuilderAttrs$1 = [
+var selfBuilderAttrs$2 = [
'splitLine', 'splitArea', 'minorSplitLine'
];
@@ -75687,7 +76297,7 @@ AxisView.extend({
each$1(axisBuilderAttrs$3, axisBuilder.add, axisBuilder);
this.group.add(axisBuilder.getGroup());
- each$1(selfBuilderAttrs$1, function (name) {
+ each$1(selfBuilderAttrs$2, function (name) {
if (radiusAxisModel.get(name + '.show') && !radiusAxis.scale.isBlank()) {
this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, minorTicksCoords);
}
@@ -82090,24 +82700,63 @@ function assembleCssText(tooltipModel) {
return cssText.join(';') + ';';
}
+// If not able to make, do not modify the input `out`.
+function makeStyleCoord(out, zr, appendToBody, zrX, zrY) {
+ var zrPainter = zr && zr.painter;
+
+ if (appendToBody) {
+ var zrViewportRoot = zrPainter && zrPainter.getViewportRoot();
+ if (zrViewportRoot) {
+ // Some APPs might use scale on body, so we support CSS transform here.
+ transformLocalCoord(out, zrViewportRoot, document.body, zrX, zrY);
+ }
+ }
+ else {
+ out[0] = zrX;
+ out[1] = zrY;
+ // xy should be based on canvas root. But tooltipContent is
+ // the sibling of canvas root. So padding of ec container
+ // should be considered here.
+ var viewportRootOffset = zrPainter && zrPainter.getViewportRootOffset();
+ if (viewportRootOffset) {
+ out[0] += viewportRootOffset.offsetLeft;
+ out[1] += viewportRootOffset.offsetTop;
+ }
+ }
+}
+
/**
* @alias module:echarts/component/tooltip/TooltipContent
+ * @param {HTMLElement} container
+ * @param {ExtensionAPI} api
+ * @param {Object} [opt]
+ * @param {boolean} [opt.appendToBody]
+ * `false`: the DOM element will be inside the container. Default value.
+ * `true`: the DOM element will be appended to HTML body, which avoid
+ * some overflow clip but intrude outside of the container.
* @constructor
*/
-function TooltipContent(container, api) {
+function TooltipContent(container, api, opt) {
if (env$1.wxa) {
return null;
}
var el = document.createElement('div');
+ el.domBelongToZr = true;
+ this.el = el;
var zr = this._zr = api.getZr();
+ var appendToBody = this._appendToBody = opt && opt.appendToBody;
- this.el = el;
+ this._styleCoord = [0, 0];
- this._x = api.getWidth() / 2;
- this._y = api.getHeight() / 2;
+ makeStyleCoord(this._styleCoord, zr, appendToBody, api.getWidth() / 2, api.getHeight() / 2);
- container.appendChild(el);
+ if (appendToBody) {
+ document.body.appendChild(el);
+ }
+ else {
+ container.appendChild(el);
+ }
this._container = container;
@@ -82141,7 +82790,8 @@ function TooltipContent(container, api) {
// Try trigger zrender event to avoid mouse
// in and out shape too frequently
var handler = zr.handler;
- normalizeEvent(container, e, true);
+ var zrViewportRoot = zr.painter.getViewportRoot();
+ normalizeEvent(zrViewportRoot, e, true);
handler.dispatch('mousemove', e);
}
};
@@ -82186,12 +82836,13 @@ TooltipContent.prototype = {
show: function (tooltipModel) {
clearTimeout(this._hideTimeout);
var el = this.el;
+ var styleCoord = this._styleCoord;
el.style.cssText = gCssText + assembleCssText(tooltipModel)
// Because of the reason described in:
// http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
// we should set initial value to `left` and `top`.
- + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+ + ';left:' + styleCoord[0] + 'px;top:' + styleCoord[1] + 'px;'
+ (tooltipModel.get('extraCssText') || '');
el.style.display = el.innerHTML ? 'block' : 'none';
@@ -82219,23 +82870,13 @@ TooltipContent.prototype = {
return [el.clientWidth, el.clientHeight];
},
- moveTo: function (x, y) {
- // xy should be based on canvas root. But tooltipContent is
- // the sibling of canvas root. So padding of ec container
- // should be considered here.
- var zr = this._zr;
- var viewportRootOffset;
- if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
- x += viewportRootOffset.offsetLeft;
- y += viewportRootOffset.offsetTop;
- }
+ moveTo: function (zrX, zrY) {
+ var styleCoord = this._styleCoord;
+ makeStyleCoord(styleCoord, this._zr, this._appendToBody, zrX, zrY);
var style = this.el.style;
- style.left = x + 'px';
- style.top = y + 'px';
-
- this._x = x;
- this._y = y;
+ style.left = styleCoord[0] + 'px';
+ style.top = styleCoord[1] + 'px';
},
hide: function () {
@@ -82261,6 +82902,10 @@ TooltipContent.prototype = {
return this._show;
},
+ dispose: function () {
+ this.el.parentNode.removeChild(this.el);
+ },
+
getOuterSize: function () {
var width = this.el.clientWidth;
var height = this.el.clientHeight;
@@ -82277,6 +82922,7 @@ TooltipContent.prototype = {
return {width: width, height: height};
}
+
};
/*
@@ -82508,7 +83154,9 @@ extendComponentView({
var tooltipContent;
if (this._renderMode === 'html') {
- tooltipContent = new TooltipContent(api.getDom(), api);
+ tooltipContent = new TooltipContent(api.getDom(), api, {
+ appendToBody: tooltipModel.get('appendToBody', true)
+ });
this._newLine = '<br/>';
}
else {
@@ -82661,7 +83309,6 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- event: {},
dataByCoordSys: payload.dataByCoordSys,
tooltipOption: payload.tooltipOption
}, dispatchAction);
@@ -82680,8 +83327,7 @@ extendComponentView({
offsetX: cx,
offsetY: cy,
position: payload.position,
- target: pointInfo.el,
- event: {}
+ target: pointInfo.el
}, dispatchAction);
}
}
@@ -82698,8 +83344,7 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- target: api.getZr().findHover(payload.x, payload.y).target,
- event: {}
+ target: api.getZr().findHover(payload.x, payload.y).target
}, dispatchAction);
}
},
@@ -82805,7 +83450,9 @@ extendComponentView({
_showAxisTooltip: function (dataByCoordSys, e) {
var ecModel = this._ecModel;
var globalTooltipModel = this._tooltipModel;
+
var point = [e.offsetX, e.offsetY];
+
var singleDefaultHTML = [];
var singleParamsList = [];
var singleTooltipModel = buildTooltipModel([
@@ -83061,6 +83708,7 @@ extendComponentView({
_updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
var viewWidth = this._api.getWidth();
var viewHeight = this._api.getHeight();
+
positionExpr = positionExpr || tooltipModel.get('position');
var contentSize = content.getSize();
@@ -83179,7 +83827,7 @@ extendComponentView({
if (env$1.node) {
return;
}
- this._tooltipContent.hide();
+ this._tooltipContent.dispose();
unregister('itemTooltip', api);
}
});
@@ -83764,16 +84412,19 @@ var PRIORITY_BRUSH = PRIORITY.VISUAL.BRUSH;
*/
registerLayout(PRIORITY_BRUSH, function (ecModel, api, payload) {
ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
-
payload && payload.type === 'takeGlobalCursor' && brushModel.setBrushOption(
payload.key === 'brush' ? payload.brushOption : {brushType: false}
);
+ });
+ layoutCovers(ecModel);
+});
+function layoutCovers(ecModel) {
+ ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
var brushTargetManager = brushModel.brushTargetManager = new BrushTargetManager(brushModel.option, ecModel);
-
brushTargetManager.setInputRanges(brushModel.areas, ecModel);
});
-});
+}
/**
* Register the visual encoding if this modules required.
@@ -84288,7 +84939,13 @@ extendComponentView({
/**
* @override
*/
- updateTransform: updateController,
+ updateTransform: function (brushModel, ecModel) {
+ // PENDING: `updateTransform` is a little tricky, whose layout need
+ // to be calculate mandatorily and other stages will not be performed.
+ // Take care the correctness of the logic. See #11754 .
+ layoutCovers(ecModel);
+ return updateController.apply(this, arguments);
+ },
/**
* @override
@@ -86380,8 +87037,8 @@ function markerTypeCalculatorWithExtent(
var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
- coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
-
+ coordArr[targetCoordIndex] = data.get(calcDataDim, dataIndex);
+ var coordArrValue = data.get(targetDataDim, dataIndex);
// Make it simple, do not visit all stacked value to count precision.
var precision = getPrecision(data.get(targetDataDim, dataIndex));
precision = Math.min(precision, 20);
@@ -86389,7 +87046,7 @@ function markerTypeCalculatorWithExtent(
coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
}
- return coordArr;
+ return [coordArr, coordArrValue];
}
var curry$5 = curry;
@@ -86452,12 +87109,15 @@ function dataTransform(seriesModel, item) {
var otherCoordIndex = indexOf$2(dims, axisInfo.baseAxis.dim);
var targetCoordIndex = indexOf$2(dims, axisInfo.valueAxis.dim);
- item.coord = markerTypeCalculator[item.type](
+ var coordInfo = markerTypeCalculator[item.type](
data, axisInfo.baseDataDim, axisInfo.valueDataDim,
otherCoordIndex, targetCoordIndex
);
+ item.coord = coordInfo[0];
// Force to use the value of calculated value.
- item.value = item.coord[targetCoordIndex];
+ // let item use the value without stack.
+ item.value = coordInfo[1];
+
}
else {
// FIXME Only has one of xAxis and yAxis.
@@ -86849,7 +87509,8 @@ MarkerModel.extend({
},
label: {
show: true,
- position: 'end'
+ position: 'end',
+ distance: 5
},
lineStyle: {
type: 'dashed'
@@ -89299,26 +89960,28 @@ var ScrollableLegendView = LegendView.extend({
},
_findTargetItemIndex: function (targetDataIndex) {
+ if (!this._showController) {
+ return 0;
+ }
+
var index;
var contentGroup = this.getContentGroup();
var defaultIndex;
- if (this._showController) {
- contentGroup.eachChild(function (child, idx) {
- var legendDataIdx = child.__legendDataIndex;
- // FIXME
- // If the given targetDataIndex (from model) is illegal,
- // we use defualtIndex. But the index on the legend model and
- // action payload is still illegal. That case will not be
- // changed until some scenario requires.
- if (defaultIndex == null && legendDataIdx != null) {
- defaultIndex = idx;
- }
- if (legendDataIdx === targetDataIndex) {
- index = idx;
- }
- });
- }
+ contentGroup.eachChild(function (child, idx) {
+ var legendDataIdx = child.__legendDataIndex;
+ // FIXME
+ // If the given targetDataIndex (from model) is illegal,
+ // we use defualtIndex. But the index on the legend model and
+ // action payload is still illegal. That case will not be
+ // changed until some scenario requires.
+ if (defaultIndex == null && legendDataIdx != null) {
+ defaultIndex = idx;
+ }
+ if (legendDataIdx === targetDataIndex) {
+ index = idx;
+ }
+ });
return index != null ? index : defaultIndex;
}
diff --git a/dist/echarts-en.js.map b/dist/echarts-en.js.map
index a994ff2..81951f0 100644
--- a/dist/echarts-en.js.map
+++ b/dist/echarts-en.js.map
@@ -1 +1 @@
-{"version":3,"file":"echarts-en.js","sources":["../src/config.js","../../zrender/src/core/guid.js","../../zrender/src/core/env.js","../../zrender/src/core/util.js","../../zrender/src/core/vector.js","../../zrender/src/mixin/Draggable.js","../../zrender/src/mixin/Eventful.js","../../zrender/src/core/fourPointsTransform.js","../../zrender/src/core/event.js","../../zrender/src/core/GestureMgr.js","../../zrender/src/Handler.js","../../zrender/src/core/matrix.js","../../zrender/src/mixin/Tran [...]
\ No newline at end of file
+{"version":3,"file":"echarts-en.js","sources":["../src/config.js","../../zrender/src/core/guid.js","../../zrender/src/core/env.js","../../zrender/src/core/util.js","../../zrender/src/core/vector.js","../../zrender/src/mixin/Draggable.js","../../zrender/src/mixin/Eventful.js","../../zrender/src/core/fourPointsTransform.js","../../zrender/src/core/dom.js","../../zrender/src/core/event.js","../../zrender/src/core/GestureMgr.js","../../zrender/src/Handler.js","../../zrender/src/core/matrix.j [...]
\ No newline at end of file
diff --git a/dist/echarts-en.min.js b/dist/echarts-en.min.js
index 456243b..d118440 100644
--- a/dist/echarts-en.min.js
+++ b/dist/echarts-en.min.js
@@ -19,4 +19,4 @@
*/
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
diff --git a/dist/echarts-en.simple.js b/dist/echarts-en.simple.js
index cd00713..c282195 100644
--- a/dist/echarts-en.simple.js
+++ b/dist/echarts-en.simple.js
@@ -1172,7 +1172,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1601,6 +1605,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1623,6 +1629,148 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1630,7 +1778,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1695,11 +1842,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1711,10 +1858,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1724,70 +1868,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4473,7 +4553,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4552,7 +4632,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4613,7 +4693,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4630,7 +4710,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4639,7 +4719,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4691,7 +4771,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10367,7 +10447,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10432,14 +10512,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10450,7 +10530,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10461,7 +10541,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -10728,13 +10808,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11187,7 +11270,7 @@ var painterCtors = {
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16020,12 +16103,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16034,20 +16115,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16063,12 +16146,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16077,6 +16158,16 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
var originWidth = inputShape.width;
var originHeight = inputShape.height;
+ outputShape.x = originX;
+ outputShape.y = originY;
+ outputShape.width = originWidth;
+ outputShape.height = originHeight;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
outputShape.x = subPixelOptimize$1(originX, lineWidth, true);
outputShape.y = subPixelOptimize$1(originY, lineWidth, true);
outputShape.width = Math.max(
@@ -16093,11 +16184,14 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
- * @param {number} lineWidth Should be nonnegative integer.
+ * @param {number} lineWidth If `null`/`undefined`/`0`, do not optimize.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
function subPixelOptimize$1(position, lineWidth, positiveOrNegative) {
+ if (!lineWidth) {
+ return position;
+ }
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
@@ -17798,7 +17892,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -17824,7 +17918,7 @@ function updateProps(el, props, animatableModel, dataIndex, cb) {
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -24472,8 +24566,11 @@ var createRenderPlanner = function () {
var originalLarge = fields.large;
var originalProgressive = fields.progressiveRender;
- var large = fields.large = pipelineContext.large;
- var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+ // FIXME: if the planner works on a filtered series, `pipelineContext` does not
+ // exists. See #11611 . Probably we need to modify this structure, see the comment
+ // on `performRawSeries` in `Schedular.js`.
+ var large = fields.large = pipelineContext && pipelineContext.large;
+ var progressive = fields.progressiveRender = pipelineContext && pipelineContext.progressiveRender;
return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
};
@@ -25587,6 +25684,14 @@ function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
task.dirty();
}
var performArgs = scheduler.getPerformArgs(task, opt.block);
+ // FIXME
+ // if intending to decalare `performRawSeries` in handlers, only
+ // stream-independent (specifically, data item independent) operations can be
+ // performed. Because is a series is filtered, most of the tasks will not
+ // be performed. A stream-dependent operation probably cause wrong biz logic.
+ // Perhaps we should not provide a separate callback for this case instead
+ // of providing the config `performRawSeries`. The stream-dependent operaions
+ // and stream-independent operations should better not be mixed.
performArgs.skip = !stageHandler.performRawSeries
&& ecModel.isSeriesFiltered(task.context.model);
updatePayload(task, payload);
@@ -26961,10 +27066,10 @@ var isFunction = isFunction$1;
var isObject = isObject$1;
var parseClassType = ComponentModel.parseClassType;
-var version = '4.6.0';
+var version = '4.7.0';
var dependencies = {
- zrender: '4.2.0'
+ zrender: '4.3.0'
};
var TEST_FRAME_REMAIN_TIME = 1;
@@ -36152,7 +36257,7 @@ var IntervalScale = Scale.extend({
if (extent[0] < niceTickExtent[0]) {
if (expandToNicedExtent) {
- ticks.push(roundNumber(niceTickExtent[0] - interval));
+ ticks.push(roundNumber(niceTickExtent[0] - interval, intervalPrecision));
}
else {
ticks.push(extent[0]);
@@ -36178,7 +36283,7 @@ var IntervalScale = Scale.extend({
var lastNiceTick = ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1];
if (extent[1] > lastNiceTick) {
if (expandToNicedExtent) {
- ticks.push(lastNiceTick + interval);
+ ticks.push(roundNumber(lastNiceTick + interval, intervalPrecision));
}
else {
ticks.push(extent[1]);
@@ -36726,11 +36831,6 @@ function layout(seriesType, ecModel) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
- if (isNaN(value) || isNaN(baseValue)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -36763,7 +36863,10 @@ function layout(seriesType, ecModel) {
if (Math.abs(width) < barMinHeight) {
width = (width < 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ // Ignore stack from NaN value
+ if (!isNaN(width)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ }
}
else {
var coord = cartesian.dataToPoint([baseValue, value]);
@@ -36776,7 +36879,10 @@ function layout(seriesType, ecModel) {
// Include zero to has a positive bar
height = (height <= 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ // Ignore stack from NaN value
+ if (!isNaN(height)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ }
}
data.setItemLayout(idx, {
@@ -36804,6 +36910,7 @@ var largeLayout = {
var data = seriesModel.getData();
var cartesian = seriesModel.coordinateSystem;
+ var coordLayout = cartesian.grid.getRect();
var baseAxis = cartesian.getBaseAxis();
var valueAxis = cartesian.getOtherAxis(baseAxis);
var valueDim = data.mapDimension(valueAxis.dim);
@@ -36823,6 +36930,7 @@ var largeLayout = {
function progress(params, data) {
var count = params.count;
var largePoints = new LargeArr(count * 2);
+ var largeBackgroundPoints = new LargeArr(count * 2);
var largeDataIndices = new LargeArr(count);
var dataIndex;
var coord = [];
@@ -36836,7 +36944,9 @@ var largeLayout = {
coord = cartesian.dataToPoint(valuePair, null, coord);
// Data index might not be in order, depends on `progressiveChunkMode`.
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
largePoints[pointsOffset++] = coord[0];
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
largePoints[pointsOffset++] = coord[1];
largeDataIndices[idxOffset++] = dataIndex;
}
@@ -36844,8 +36954,10 @@ var largeLayout = {
data.setLayout({
largePoints: largePoints,
largeDataIndices: largeDataIndices,
+ largeBackgroundPoints: largeBackgroundPoints,
barWidth: barWidth,
valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+ backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
valueAxisHorizontal: valueAxisHorizontal
});
}
@@ -41082,6 +41194,117 @@ function layout$1(gridModel, axisModel, opt) {
* under the License.
*/
+function rectCoordAxisBuildSplitArea(axisView, axisGroup, axisModel, gridModel) {
+ var axis = axisModel.axis;
+
+ if (axis.scale.isBlank()) {
+ return;
+ }
+
+ var splitAreaModel = axisModel.getModel('splitArea');
+ var areaStyleModel = splitAreaModel.getModel('areaStyle');
+ var areaColors = areaStyleModel.get('color');
+
+ var gridRect = gridModel.coordinateSystem.getRect();
+
+ var ticksCoords = axis.getTicksCoords({
+ tickModel: splitAreaModel,
+ clamp: true
+ });
+
+ if (!ticksCoords.length) {
+ return;
+ }
+
+ // For Making appropriate splitArea animation, the color and anid
+ // should be corresponding to previous one if possible.
+ var areaColorsLen = areaColors.length;
+ var lastSplitAreaColors = axisView.__splitAreaColors;
+ var newSplitAreaColors = createHashMap();
+ var colorIndex = 0;
+ if (lastSplitAreaColors) {
+ for (var i = 0; i < ticksCoords.length; i++) {
+ var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+ if (cIndex != null) {
+ colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+ break;
+ }
+ }
+ }
+
+ var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+ var areaStyle = areaStyleModel.getAreaStyle();
+ areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+ for (var i = 1; i < ticksCoords.length; i++) {
+ var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+ var x;
+ var y;
+ var width;
+ var height;
+ if (axis.isHorizontal()) {
+ x = prev;
+ y = gridRect.y;
+ width = tickCoord - x;
+ height = gridRect.height;
+ prev = x + width;
+ }
+ else {
+ x = gridRect.x;
+ y = prev;
+ width = gridRect.width;
+ height = tickCoord - y;
+ prev = y + height;
+ }
+
+ var tickValue = ticksCoords[i - 1].tickValue;
+ tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+ axisGroup.add(new Rect({
+ anid: tickValue != null ? 'area_' + tickValue : null,
+ shape: {
+ x: x,
+ y: y,
+ width: width,
+ height: height
+ },
+ style: defaults({
+ fill: areaColors[colorIndex]
+ }, areaStyle),
+ silent: true
+ }));
+
+ colorIndex = (colorIndex + 1) % areaColorsLen;
+ }
+
+ axisView.__splitAreaColors = newSplitAreaColors;
+}
+
+function rectCoordAxisHandleRemove(axisView) {
+ axisView.__splitAreaColors = null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied. See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
var axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
];
@@ -41133,7 +41356,7 @@ var CartesianAxisView = AxisView.extend({
},
remove: function () {
- this._splitAreaColors = null;
+ rectCoordAxisHandleRemove(this);
},
/**
@@ -41265,91 +41488,7 @@ var CartesianAxisView = AxisView.extend({
* @private
*/
_splitArea: function (axisModel, gridModel) {
- var axis = axisModel.axis;
-
- if (axis.scale.isBlank()) {
- return;
- }
-
- var splitAreaModel = axisModel.getModel('splitArea');
- var areaStyleModel = splitAreaModel.getModel('areaStyle');
- var areaColors = areaStyleModel.get('color');
-
- var gridRect = gridModel.coordinateSystem.getRect();
-
- var ticksCoords = axis.getTicksCoords({
- tickModel: splitAreaModel,
- clamp: true
- });
-
- if (!ticksCoords.length) {
- return;
- }
-
- // For Making appropriate splitArea animation, the color and anid
- // should be corresponding to previous one if possible.
- var areaColorsLen = areaColors.length;
- var lastSplitAreaColors = this._splitAreaColors;
- var newSplitAreaColors = createHashMap();
- var colorIndex = 0;
- if (lastSplitAreaColors) {
- for (var i = 0; i < ticksCoords.length; i++) {
- var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
- if (cIndex != null) {
- colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
- break;
- }
- }
- }
-
- var prev = axis.toGlobalCoord(ticksCoords[0].coord);
-
- var areaStyle = areaStyleModel.getAreaStyle();
- areaColors = isArray(areaColors) ? areaColors : [areaColors];
-
- for (var i = 1; i < ticksCoords.length; i++) {
- var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
-
- var x;
- var y;
- var width;
- var height;
- if (axis.isHorizontal()) {
- x = prev;
- y = gridRect.y;
- width = tickCoord - x;
- height = gridRect.height;
- prev = x + width;
- }
- else {
- x = gridRect.x;
- y = prev;
- width = gridRect.width;
- height = tickCoord - y;
- prev = y + height;
- }
-
- var tickValue = ticksCoords[i - 1].tickValue;
- tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
-
- this._axisGroup.add(new Rect({
- anid: tickValue != null ? 'area_' + tickValue : null,
- shape: {
- x: x,
- y: y,
- width: width,
- height: height
- },
- style: defaults({
- fill: areaColors[colorIndex]
- }, areaStyle),
- silent: true
- }));
-
- colorIndex = (colorIndex + 1) % areaColorsLen;
- }
-
- this._splitAreaColors = newSplitAreaColors;
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, gridModel);
}
});
@@ -41595,7 +41734,21 @@ BaseBarSeries.extend({
// If use caps on two sides of bars
// Only available on tangential polar bar
- roundCap: false
+ roundCap: false,
+
+ showBackground: false,
+ backgroundStyle: {
+ color: 'rgba(180, 180, 180, 0.2)',
+ borderColor: null,
+ borderWidth: 0,
+ borderType: 'solid',
+ borderRadius: 0,
+ shadowBlur: 0,
+ shadowColor: null,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ opacity: 1
+ }
}
});
@@ -41900,15 +42053,28 @@ extendChartView({
var roundCap = seriesModel.get('roundCap', true);
+ var drawBackground = seriesModel.get('showBackground', true);
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+
+ var bgEls = [];
+ var oldBgEls = this._backgroundEls || [];
+
data.diff(oldData)
.add(function (dataIndex) {
+ var itemModel = data.getItemModel(dataIndex);
+ var layout = getLayout[coord.type](data, dataIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = createBackgroundEl(coord, isHorizontalOrRadial, layout);
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[dataIndex] = bgEl;
+ }
+
+ // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
if (!data.hasValue(dataIndex)) {
return;
}
- var itemModel = data.getItemModel(dataIndex);
- var layout = getLayout[coord.type](data, dataIndex, itemModel);
-
if (needsClip) {
// Clip will modify the layout params.
// And return a boolean to determine if the shape are fully clipped.
@@ -41931,16 +42097,24 @@ extendChartView({
);
})
.update(function (newIndex, oldIndex) {
- var el = oldData.getItemGraphicEl(oldIndex);
+ var itemModel = data.getItemModel(newIndex);
+ var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = oldBgEls[oldIndex];
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[newIndex] = bgEl;
+ var shape = createBackgroundShape(isHorizontalOrRadial, layout, coord);
+ updateProps(bgEl, { shape: shape }, animationModel, newIndex);
+ }
+
+ var el = oldData.getItemGraphicEl(oldIndex);
if (!data.hasValue(newIndex)) {
group.remove(el);
return;
}
- var itemModel = data.getItemModel(newIndex);
- var layout = getLayout[coord.type](data, newIndex, itemModel);
-
if (needsClip) {
var isClipped = clip[coord.type](coordSysClipArea, layout);
if (isClipped) {
@@ -41978,6 +42152,15 @@ extendChartView({
})
.execute();
+ var bgGroup = this._backgroundGroup || (this._backgroundGroup = new Group());
+ bgGroup.removeAll();
+
+ for (var i = 0; i < bgEls.length; ++i) {
+ bgGroup.add(bgEls[i]);
+ }
+ group.add(bgGroup);
+ this._backgroundEls = bgEls;
+
this._data = data;
},
@@ -41998,6 +42181,7 @@ extendChartView({
},
_incrementalRenderLarge: function (params, seriesModel) {
+ this._removeBackground();
createLarge(seriesModel, this.group, true);
},
@@ -42011,6 +42195,9 @@ extendChartView({
var group = this.group;
var data = this._data;
if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+ this._removeBackground();
+ this._backgroundEls = [];
+
data.eachItemGraphicEl(function (el) {
if (el.type === 'sector') {
removeSector(el.dataIndex, ecModel, el);
@@ -42024,6 +42211,11 @@ extendChartView({
group.removeAll();
}
this._data = null;
+ },
+
+ _removeBackground: function () {
+ this.group.remove(this._backgroundGroup);
+ this._backgroundGroup = null;
}
});
@@ -42081,7 +42273,12 @@ var elementCreator = {
dataIndex, layout, isHorizontal,
animationModel, isUpdate
) {
- var rect = new Rect({shape: extend({}, layout)});
+ var rect = new Rect({
+ shape: extend({}, layout),
+ z2: 1
+ });
+
+ rect.name = 'item';
// Animation
if (animationModel) {
@@ -42111,9 +42308,12 @@ var elementCreator = {
var ShapeClass = (!isRadial && roundCap) ? Sausage : Sector;
var sector = new ShapeClass({
- shape: defaults({clockwise: clockwise}, layout)
+ shape: defaults({clockwise: clockwise}, layout),
+ z2: 1
});
+ sector.name = 'item';
+
// Animation
if (animationModel) {
var sectorShape = sector.shape;
@@ -42233,7 +42433,10 @@ function updateStyle(
// In case width or height are too small.
function getLineWidth(itemModel, rawLayout) {
var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
- return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+ // width or height may be NaN for empty data
+ var width = isNaN(rawLayout.width) ? Number.MAX_VALUE : Math.abs(rawLayout.width);
+ var height = isNaN(rawLayout.height) ? Number.MAX_VALUE : Math.abs(rawLayout.height);
+ return Math.min(lineWidth, width, height);
}
@@ -42265,13 +42468,38 @@ function createLarge(seriesModel, group, incremental) {
var baseDimIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
startPoint[1 - baseDimIdx] = data.getLayout('valueAxisStart');
+ var largeDataIndices = data.getLayout('largeDataIndices');
+ var barWidth = data.getLayout('barWidth');
+
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+ var drawBackground = seriesModel.get('showBackground', true);
+
+ if (drawBackground) {
+ var points = data.getLayout('largeBackgroundPoints');
+ var backgroundStartPoint = [];
+ backgroundStartPoint[1 - baseDimIdx] = data.getLayout('backgroundStart');
+
+ var bgEl = new LargePath({
+ shape: {points: points},
+ incremental: !!incremental,
+ __startPoint: backgroundStartPoint,
+ __baseDimIdx: baseDimIdx,
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth,
+ silent: true,
+ z2: 0
+ });
+ setLargeBackgroundStyle(bgEl, backgroundModel, data);
+ group.add(bgEl);
+ }
+
var el = new LargePath({
shape: {points: data.getLayout('largePoints')},
incremental: !!incremental,
__startPoint: startPoint,
__baseDimIdx: baseDimIdx,
- __largeDataIndices: data.getLayout('largeDataIndices'),
- __barWidth: data.getLayout('barWidth')
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth
});
group.add(el);
setLargeStyle(el, seriesModel, data);
@@ -42336,6 +42564,55 @@ function setLargeStyle(el, seriesModel, data) {
el.style.lineWidth = data.getLayout('barWidth');
}
+function setLargeBackgroundStyle(el, backgroundModel, data) {
+ var borderColor = backgroundModel.get('borderColor') || backgroundModel.get('color');
+ var itemStyle = backgroundModel.getItemStyle(['color', 'borderColor']);
+
+ el.useStyle(itemStyle);
+ el.style.fill = null;
+ el.style.stroke = borderColor;
+ el.style.lineWidth = data.getLayout('barWidth');
+}
+
+function createBackgroundShape(isHorizontalOrRadial, layout, coord) {
+ var coordLayout;
+ var isPolar = coord.type === 'polar';
+ if (isPolar) {
+ coordLayout = coord.getArea();
+ }
+ else {
+ coordLayout = coord.grid.getRect();
+ }
+
+ if (isPolar) {
+ return {
+ cx: coordLayout.cx,
+ cy: coordLayout.cy,
+ r0: isHorizontalOrRadial ? coordLayout.r0 : layout.r0,
+ r: isHorizontalOrRadial ? coordLayout.r : layout.r,
+ startAngle: isHorizontalOrRadial ? layout.startAngle : 0,
+ endAngle: isHorizontalOrRadial ? layout.endAngle : Math.PI * 2
+ };
+ }
+ else {
+ return {
+ x: isHorizontalOrRadial ? layout.x : coordLayout.x,
+ y: isHorizontalOrRadial ? coordLayout.y : layout.y,
+ width: isHorizontalOrRadial ? layout.width : coordLayout.width,
+ height: isHorizontalOrRadial ? coordLayout.height : layout.height
+ };
+ }
+}
+
+function createBackgroundEl(coord, isHorizontalOrRadial, layout) {
+ var ElementClz = coord.type === 'polar' ? Sector : Rect;
+ return new ElementClz({
+ shape: createBackgroundShape(isHorizontalOrRadial, layout, coord),
+ silent: true,
+ z2: 0
+ });
+}
+
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
@@ -42945,7 +43222,7 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
toggleItemSelected(
this,
data.getItemLayout(idx),
- seriesModel.isSelected(null, idx),
+ seriesModel.isSelected(data.getName(idx)),
seriesModel.get('selectedOffset'),
seriesModel.get('animation')
);
@@ -43697,7 +43974,7 @@ var labelLayout = function (seriesModel, r, viewWidth, viewHeight, viewLeft, vie
inside: isLabelInside,
labelDistance: labelDistance,
labelAlignTo: labelAlignTo,
- labelMargin:labelMargin,
+ labelMargin: labelMargin,
bleedMargin: bleedMargin,
textRect: textRect,
text: text,
diff --git a/dist/echarts-en.simple.min.js b/dist/echarts-en.simple.min.js
index 4e2af9b..f289ecd 100644
--- a/dist/echarts-en.simple.min.js
+++ b/dist/echarts-en.simple.min.js
@@ -19,4 +19,4 @@
*/
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},m="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},m="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
diff --git a/dist/echarts.common.js b/dist/echarts.common.js
index 2c53f99..96417af 100644
--- a/dist/echarts.common.js
+++ b/dist/echarts.common.js
@@ -1285,7 +1285,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1714,6 +1718,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1736,6 +1742,153 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+var _calcOut$1 = [];
+
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+function transformLocalCoord(out, elFrom, elTarget, inX, inY) {
+ return transformCoordWithViewport(_calcOut$1, elFrom, inX, inY, true)
+ && transformCoordWithViewport(out, elTarget, _calcOut$1[0], _calcOut$1[1]);
+}
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1743,7 +1896,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1808,11 +1960,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1824,10 +1976,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1837,70 +1986,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4770,7 +4855,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4849,7 +4934,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4910,7 +4995,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4927,7 +5012,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4936,7 +5021,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4988,7 +5073,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10666,7 +10751,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10731,14 +10816,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10749,7 +10834,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10760,7 +10845,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -11027,13 +11112,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11488,7 +11576,7 @@ var instances$1 = {}; // ZRender实例map索引
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16377,12 +16465,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16391,20 +16477,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16420,12 +16508,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16434,6 +16520,16 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
var originWidth = inputShape.width;
var originHeight = inputShape.height;
+ outputShape.x = originX;
+ outputShape.y = originY;
+ outputShape.width = originWidth;
+ outputShape.height = originHeight;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
outputShape.x = subPixelOptimize$1(originX, lineWidth, true);
outputShape.y = subPixelOptimize$1(originY, lineWidth, true);
outputShape.width = Math.max(
@@ -16450,11 +16546,14 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
- * @param {number} lineWidth Should be nonnegative integer.
+ * @param {number} lineWidth If `null`/`undefined`/`0`, do not optimize.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
function subPixelOptimize$1(position, lineWidth, positiveOrNegative) {
+ if (!lineWidth) {
+ return position;
+ }
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
@@ -18155,7 +18254,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -18181,7 +18280,7 @@ function updateProps(el, props, animatableModel, dataIndex, cb) {
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -25019,8 +25118,11 @@ var createRenderPlanner = function () {
var originalLarge = fields.large;
var originalProgressive = fields.progressiveRender;
- var large = fields.large = pipelineContext.large;
- var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+ // FIXME: if the planner works on a filtered series, `pipelineContext` does not
+ // exists. See #11611 . Probably we need to modify this structure, see the comment
+ // on `performRawSeries` in `Schedular.js`.
+ var large = fields.large = pipelineContext && pipelineContext.large;
+ var progressive = fields.progressiveRender = pipelineContext && pipelineContext.progressiveRender;
return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
};
@@ -26195,6 +26297,14 @@ function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
task.dirty();
}
var performArgs = scheduler.getPerformArgs(task, opt.block);
+ // FIXME
+ // if intending to decalare `performRawSeries` in handlers, only
+ // stream-independent (specifically, data item independent) operations can be
+ // performed. Because is a series is filtered, most of the tasks will not
+ // be performed. A stream-dependent operation probably cause wrong biz logic.
+ // Perhaps we should not provide a separate callback for this case instead
+ // of providing the config `performRawSeries`. The stream-dependent operaions
+ // and stream-independent operations should better not be mixed.
performArgs.skip = !stageHandler.performRawSeries
&& ecModel.isSeriesFiltered(task.context.model);
updatePayload(task, payload);
@@ -27569,10 +27679,10 @@ var isFunction = isFunction$1;
var isObject = isObject$1;
var parseClassType = ComponentModel.parseClassType;
-var version = '4.6.0';
+var version = '4.7.0';
var dependencies = {
- zrender: '4.2.0'
+ zrender: '4.3.0'
};
var TEST_FRAME_REMAIN_TIME = 1;
@@ -33857,7 +33967,7 @@ var IntervalScale = Scale.extend({
if (extent[0] < niceTickExtent[0]) {
if (expandToNicedExtent) {
- ticks.push(roundNumber(niceTickExtent[0] - interval));
+ ticks.push(roundNumber(niceTickExtent[0] - interval, intervalPrecision));
}
else {
ticks.push(extent[0]);
@@ -33883,7 +33993,7 @@ var IntervalScale = Scale.extend({
var lastNiceTick = ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1];
if (extent[1] > lastNiceTick) {
if (expandToNicedExtent) {
- ticks.push(lastNiceTick + interval);
+ ticks.push(roundNumber(lastNiceTick + interval, intervalPrecision));
}
else {
ticks.push(extent[1]);
@@ -34431,11 +34541,6 @@ function layout(seriesType, ecModel) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
- if (isNaN(value) || isNaN(baseValue)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -34468,7 +34573,10 @@ function layout(seriesType, ecModel) {
if (Math.abs(width) < barMinHeight) {
width = (width < 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ // Ignore stack from NaN value
+ if (!isNaN(width)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ }
}
else {
var coord = cartesian.dataToPoint([baseValue, value]);
@@ -34481,7 +34589,10 @@ function layout(seriesType, ecModel) {
// Include zero to has a positive bar
height = (height <= 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ // Ignore stack from NaN value
+ if (!isNaN(height)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ }
}
data.setItemLayout(idx, {
@@ -34509,6 +34620,7 @@ var largeLayout = {
var data = seriesModel.getData();
var cartesian = seriesModel.coordinateSystem;
+ var coordLayout = cartesian.grid.getRect();
var baseAxis = cartesian.getBaseAxis();
var valueAxis = cartesian.getOtherAxis(baseAxis);
var valueDim = data.mapDimension(valueAxis.dim);
@@ -34528,6 +34640,7 @@ var largeLayout = {
function progress(params, data) {
var count = params.count;
var largePoints = new LargeArr(count * 2);
+ var largeBackgroundPoints = new LargeArr(count * 2);
var largeDataIndices = new LargeArr(count);
var dataIndex;
var coord = [];
@@ -34541,7 +34654,9 @@ var largeLayout = {
coord = cartesian.dataToPoint(valuePair, null, coord);
// Data index might not be in order, depends on `progressiveChunkMode`.
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
largePoints[pointsOffset++] = coord[0];
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
largePoints[pointsOffset++] = coord[1];
largeDataIndices[idxOffset++] = dataIndex;
}
@@ -34549,8 +34664,10 @@ var largeLayout = {
data.setLayout({
largePoints: largePoints,
largeDataIndices: largeDataIndices,
+ largeBackgroundPoints: largeBackgroundPoints,
barWidth: barWidth,
valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+ backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
valueAxisHorizontal: valueAxisHorizontal
});
}
@@ -42437,6 +42554,117 @@ function layout$1(gridModel, axisModel, opt) {
* under the License.
*/
+function rectCoordAxisBuildSplitArea(axisView, axisGroup, axisModel, gridModel) {
+ var axis = axisModel.axis;
+
+ if (axis.scale.isBlank()) {
+ return;
+ }
+
+ var splitAreaModel = axisModel.getModel('splitArea');
+ var areaStyleModel = splitAreaModel.getModel('areaStyle');
+ var areaColors = areaStyleModel.get('color');
+
+ var gridRect = gridModel.coordinateSystem.getRect();
+
+ var ticksCoords = axis.getTicksCoords({
+ tickModel: splitAreaModel,
+ clamp: true
+ });
+
+ if (!ticksCoords.length) {
+ return;
+ }
+
+ // For Making appropriate splitArea animation, the color and anid
+ // should be corresponding to previous one if possible.
+ var areaColorsLen = areaColors.length;
+ var lastSplitAreaColors = axisView.__splitAreaColors;
+ var newSplitAreaColors = createHashMap();
+ var colorIndex = 0;
+ if (lastSplitAreaColors) {
+ for (var i = 0; i < ticksCoords.length; i++) {
+ var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+ if (cIndex != null) {
+ colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+ break;
+ }
+ }
+ }
+
+ var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+ var areaStyle = areaStyleModel.getAreaStyle();
+ areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+ for (var i = 1; i < ticksCoords.length; i++) {
+ var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+ var x;
+ var y;
+ var width;
+ var height;
+ if (axis.isHorizontal()) {
+ x = prev;
+ y = gridRect.y;
+ width = tickCoord - x;
+ height = gridRect.height;
+ prev = x + width;
+ }
+ else {
+ x = gridRect.x;
+ y = prev;
+ width = gridRect.width;
+ height = tickCoord - y;
+ prev = y + height;
+ }
+
+ var tickValue = ticksCoords[i - 1].tickValue;
+ tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+ axisGroup.add(new Rect({
+ anid: tickValue != null ? 'area_' + tickValue : null,
+ shape: {
+ x: x,
+ y: y,
+ width: width,
+ height: height
+ },
+ style: defaults({
+ fill: areaColors[colorIndex]
+ }, areaStyle),
+ silent: true
+ }));
+
+ colorIndex = (colorIndex + 1) % areaColorsLen;
+ }
+
+ axisView.__splitAreaColors = newSplitAreaColors;
+}
+
+function rectCoordAxisHandleRemove(axisView) {
+ axisView.__splitAreaColors = null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied. See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
var axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
];
@@ -42488,7 +42716,7 @@ var CartesianAxisView = AxisView.extend({
},
remove: function () {
- this._splitAreaColors = null;
+ rectCoordAxisHandleRemove(this);
},
/**
@@ -42620,91 +42848,7 @@ var CartesianAxisView = AxisView.extend({
* @private
*/
_splitArea: function (axisModel, gridModel) {
- var axis = axisModel.axis;
-
- if (axis.scale.isBlank()) {
- return;
- }
-
- var splitAreaModel = axisModel.getModel('splitArea');
- var areaStyleModel = splitAreaModel.getModel('areaStyle');
- var areaColors = areaStyleModel.get('color');
-
- var gridRect = gridModel.coordinateSystem.getRect();
-
- var ticksCoords = axis.getTicksCoords({
- tickModel: splitAreaModel,
- clamp: true
- });
-
- if (!ticksCoords.length) {
- return;
- }
-
- // For Making appropriate splitArea animation, the color and anid
- // should be corresponding to previous one if possible.
- var areaColorsLen = areaColors.length;
- var lastSplitAreaColors = this._splitAreaColors;
- var newSplitAreaColors = createHashMap();
- var colorIndex = 0;
- if (lastSplitAreaColors) {
- for (var i = 0; i < ticksCoords.length; i++) {
- var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
- if (cIndex != null) {
- colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
- break;
- }
- }
- }
-
- var prev = axis.toGlobalCoord(ticksCoords[0].coord);
-
- var areaStyle = areaStyleModel.getAreaStyle();
- areaColors = isArray(areaColors) ? areaColors : [areaColors];
-
- for (var i = 1; i < ticksCoords.length; i++) {
- var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
-
- var x;
- var y;
- var width;
- var height;
- if (axis.isHorizontal()) {
- x = prev;
- y = gridRect.y;
- width = tickCoord - x;
- height = gridRect.height;
- prev = x + width;
- }
- else {
- x = gridRect.x;
- y = prev;
- width = gridRect.width;
- height = tickCoord - y;
- prev = y + height;
- }
-
- var tickValue = ticksCoords[i - 1].tickValue;
- tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
-
- this._axisGroup.add(new Rect({
- anid: tickValue != null ? 'area_' + tickValue : null,
- shape: {
- x: x,
- y: y,
- width: width,
- height: height
- },
- style: defaults({
- fill: areaColors[colorIndex]
- }, areaStyle),
- silent: true
- }));
-
- colorIndex = (colorIndex + 1) % areaColorsLen;
- }
-
- this._splitAreaColors = newSplitAreaColors;
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, gridModel);
}
});
@@ -42950,7 +43094,21 @@ BaseBarSeries.extend({
// If use caps on two sides of bars
// Only available on tangential polar bar
- roundCap: false
+ roundCap: false,
+
+ showBackground: false,
+ backgroundStyle: {
+ color: 'rgba(180, 180, 180, 0.2)',
+ borderColor: null,
+ borderWidth: 0,
+ borderType: 'solid',
+ borderRadius: 0,
+ shadowBlur: 0,
+ shadowColor: null,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ opacity: 1
+ }
}
});
@@ -43255,15 +43413,28 @@ extendChartView({
var roundCap = seriesModel.get('roundCap', true);
+ var drawBackground = seriesModel.get('showBackground', true);
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+
+ var bgEls = [];
+ var oldBgEls = this._backgroundEls || [];
+
data.diff(oldData)
.add(function (dataIndex) {
+ var itemModel = data.getItemModel(dataIndex);
+ var layout = getLayout[coord.type](data, dataIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = createBackgroundEl(coord, isHorizontalOrRadial, layout);
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[dataIndex] = bgEl;
+ }
+
+ // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
if (!data.hasValue(dataIndex)) {
return;
}
- var itemModel = data.getItemModel(dataIndex);
- var layout = getLayout[coord.type](data, dataIndex, itemModel);
-
if (needsClip) {
// Clip will modify the layout params.
// And return a boolean to determine if the shape are fully clipped.
@@ -43286,16 +43457,24 @@ extendChartView({
);
})
.update(function (newIndex, oldIndex) {
- var el = oldData.getItemGraphicEl(oldIndex);
+ var itemModel = data.getItemModel(newIndex);
+ var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = oldBgEls[oldIndex];
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[newIndex] = bgEl;
+ var shape = createBackgroundShape(isHorizontalOrRadial, layout, coord);
+ updateProps(bgEl, { shape: shape }, animationModel, newIndex);
+ }
+
+ var el = oldData.getItemGraphicEl(oldIndex);
if (!data.hasValue(newIndex)) {
group.remove(el);
return;
}
- var itemModel = data.getItemModel(newIndex);
- var layout = getLayout[coord.type](data, newIndex, itemModel);
-
if (needsClip) {
var isClipped = clip[coord.type](coordSysClipArea, layout);
if (isClipped) {
@@ -43333,6 +43512,15 @@ extendChartView({
})
.execute();
+ var bgGroup = this._backgroundGroup || (this._backgroundGroup = new Group());
+ bgGroup.removeAll();
+
+ for (var i = 0; i < bgEls.length; ++i) {
+ bgGroup.add(bgEls[i]);
+ }
+ group.add(bgGroup);
+ this._backgroundEls = bgEls;
+
this._data = data;
},
@@ -43353,6 +43541,7 @@ extendChartView({
},
_incrementalRenderLarge: function (params, seriesModel) {
+ this._removeBackground();
createLarge(seriesModel, this.group, true);
},
@@ -43366,6 +43555,9 @@ extendChartView({
var group = this.group;
var data = this._data;
if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+ this._removeBackground();
+ this._backgroundEls = [];
+
data.eachItemGraphicEl(function (el) {
if (el.type === 'sector') {
removeSector(el.dataIndex, ecModel, el);
@@ -43379,6 +43571,11 @@ extendChartView({
group.removeAll();
}
this._data = null;
+ },
+
+ _removeBackground: function () {
+ this.group.remove(this._backgroundGroup);
+ this._backgroundGroup = null;
}
});
@@ -43436,7 +43633,12 @@ var elementCreator = {
dataIndex, layout, isHorizontal,
animationModel, isUpdate
) {
- var rect = new Rect({shape: extend({}, layout)});
+ var rect = new Rect({
+ shape: extend({}, layout),
+ z2: 1
+ });
+
+ rect.name = 'item';
// Animation
if (animationModel) {
@@ -43466,9 +43668,12 @@ var elementCreator = {
var ShapeClass = (!isRadial && roundCap) ? Sausage : Sector;
var sector = new ShapeClass({
- shape: defaults({clockwise: clockwise}, layout)
+ shape: defaults({clockwise: clockwise}, layout),
+ z2: 1
});
+ sector.name = 'item';
+
// Animation
if (animationModel) {
var sectorShape = sector.shape;
@@ -43588,7 +43793,10 @@ function updateStyle(
// In case width or height are too small.
function getLineWidth(itemModel, rawLayout) {
var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
- return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+ // width or height may be NaN for empty data
+ var width = isNaN(rawLayout.width) ? Number.MAX_VALUE : Math.abs(rawLayout.width);
+ var height = isNaN(rawLayout.height) ? Number.MAX_VALUE : Math.abs(rawLayout.height);
+ return Math.min(lineWidth, width, height);
}
@@ -43620,13 +43828,38 @@ function createLarge(seriesModel, group, incremental) {
var baseDimIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
startPoint[1 - baseDimIdx] = data.getLayout('valueAxisStart');
+ var largeDataIndices = data.getLayout('largeDataIndices');
+ var barWidth = data.getLayout('barWidth');
+
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+ var drawBackground = seriesModel.get('showBackground', true);
+
+ if (drawBackground) {
+ var points = data.getLayout('largeBackgroundPoints');
+ var backgroundStartPoint = [];
+ backgroundStartPoint[1 - baseDimIdx] = data.getLayout('backgroundStart');
+
+ var bgEl = new LargePath({
+ shape: {points: points},
+ incremental: !!incremental,
+ __startPoint: backgroundStartPoint,
+ __baseDimIdx: baseDimIdx,
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth,
+ silent: true,
+ z2: 0
+ });
+ setLargeBackgroundStyle(bgEl, backgroundModel, data);
+ group.add(bgEl);
+ }
+
var el = new LargePath({
shape: {points: data.getLayout('largePoints')},
incremental: !!incremental,
__startPoint: startPoint,
__baseDimIdx: baseDimIdx,
- __largeDataIndices: data.getLayout('largeDataIndices'),
- __barWidth: data.getLayout('barWidth')
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth
});
group.add(el);
setLargeStyle(el, seriesModel, data);
@@ -43691,6 +43924,55 @@ function setLargeStyle(el, seriesModel, data) {
el.style.lineWidth = data.getLayout('barWidth');
}
+function setLargeBackgroundStyle(el, backgroundModel, data) {
+ var borderColor = backgroundModel.get('borderColor') || backgroundModel.get('color');
+ var itemStyle = backgroundModel.getItemStyle(['color', 'borderColor']);
+
+ el.useStyle(itemStyle);
+ el.style.fill = null;
+ el.style.stroke = borderColor;
+ el.style.lineWidth = data.getLayout('barWidth');
+}
+
+function createBackgroundShape(isHorizontalOrRadial, layout, coord) {
+ var coordLayout;
+ var isPolar = coord.type === 'polar';
+ if (isPolar) {
+ coordLayout = coord.getArea();
+ }
+ else {
+ coordLayout = coord.grid.getRect();
+ }
+
+ if (isPolar) {
+ return {
+ cx: coordLayout.cx,
+ cy: coordLayout.cy,
+ r0: isHorizontalOrRadial ? coordLayout.r0 : layout.r0,
+ r: isHorizontalOrRadial ? coordLayout.r : layout.r,
+ startAngle: isHorizontalOrRadial ? layout.startAngle : 0,
+ endAngle: isHorizontalOrRadial ? layout.endAngle : Math.PI * 2
+ };
+ }
+ else {
+ return {
+ x: isHorizontalOrRadial ? layout.x : coordLayout.x,
+ y: isHorizontalOrRadial ? coordLayout.y : layout.y,
+ width: isHorizontalOrRadial ? layout.width : coordLayout.width,
+ height: isHorizontalOrRadial ? coordLayout.height : layout.height
+ };
+ }
+}
+
+function createBackgroundEl(coord, isHorizontalOrRadial, layout) {
+ var ElementClz = coord.type === 'polar' ? Sector : Rect;
+ return new ElementClz({
+ shape: createBackgroundShape(isHorizontalOrRadial, layout, coord),
+ silent: true,
+ z2: 0
+ });
+}
+
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
@@ -44300,7 +44582,7 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
toggleItemSelected(
this,
data.getItemLayout(idx),
- seriesModel.isSelected(null, idx),
+ seriesModel.isSelected(data.getName(idx)),
seriesModel.get('selectedOffset'),
seriesModel.get('animation')
);
@@ -45052,7 +45334,7 @@ var labelLayout = function (seriesModel, r, viewWidth, viewHeight, viewLeft, vie
inside: isLabelInside,
labelDistance: labelDistance,
labelAlignTo: labelAlignTo,
- labelMargin:labelMargin,
+ labelMargin: labelMargin,
bleedMargin: bleedMargin,
textRect: textRect,
text: text,
@@ -48417,24 +48699,63 @@ function assembleCssText(tooltipModel) {
return cssText.join(';') + ';';
}
+// If not able to make, do not modify the input `out`.
+function makeStyleCoord(out, zr, appendToBody, zrX, zrY) {
+ var zrPainter = zr && zr.painter;
+
+ if (appendToBody) {
+ var zrViewportRoot = zrPainter && zrPainter.getViewportRoot();
+ if (zrViewportRoot) {
+ // Some APPs might use scale on body, so we support CSS transform here.
+ transformLocalCoord(out, zrViewportRoot, document.body, zrX, zrY);
+ }
+ }
+ else {
+ out[0] = zrX;
+ out[1] = zrY;
+ // xy should be based on canvas root. But tooltipContent is
+ // the sibling of canvas root. So padding of ec container
+ // should be considered here.
+ var viewportRootOffset = zrPainter && zrPainter.getViewportRootOffset();
+ if (viewportRootOffset) {
+ out[0] += viewportRootOffset.offsetLeft;
+ out[1] += viewportRootOffset.offsetTop;
+ }
+ }
+}
+
/**
* @alias module:echarts/component/tooltip/TooltipContent
+ * @param {HTMLElement} container
+ * @param {ExtensionAPI} api
+ * @param {Object} [opt]
+ * @param {boolean} [opt.appendToBody]
+ * `false`: the DOM element will be inside the container. Default value.
+ * `true`: the DOM element will be appended to HTML body, which avoid
+ * some overflow clip but intrude outside of the container.
* @constructor
*/
-function TooltipContent(container, api) {
+function TooltipContent(container, api, opt) {
if (env$1.wxa) {
return null;
}
var el = document.createElement('div');
+ el.domBelongToZr = true;
+ this.el = el;
var zr = this._zr = api.getZr();
+ var appendToBody = this._appendToBody = opt && opt.appendToBody;
- this.el = el;
+ this._styleCoord = [0, 0];
- this._x = api.getWidth() / 2;
- this._y = api.getHeight() / 2;
+ makeStyleCoord(this._styleCoord, zr, appendToBody, api.getWidth() / 2, api.getHeight() / 2);
- container.appendChild(el);
+ if (appendToBody) {
+ document.body.appendChild(el);
+ }
+ else {
+ container.appendChild(el);
+ }
this._container = container;
@@ -48468,7 +48789,8 @@ function TooltipContent(container, api) {
// Try trigger zrender event to avoid mouse
// in and out shape too frequently
var handler = zr.handler;
- normalizeEvent(container, e, true);
+ var zrViewportRoot = zr.painter.getViewportRoot();
+ normalizeEvent(zrViewportRoot, e, true);
handler.dispatch('mousemove', e);
}
};
@@ -48513,12 +48835,13 @@ TooltipContent.prototype = {
show: function (tooltipModel) {
clearTimeout(this._hideTimeout);
var el = this.el;
+ var styleCoord = this._styleCoord;
el.style.cssText = gCssText + assembleCssText(tooltipModel)
// Because of the reason described in:
// http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
// we should set initial value to `left` and `top`.
- + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+ + ';left:' + styleCoord[0] + 'px;top:' + styleCoord[1] + 'px;'
+ (tooltipModel.get('extraCssText') || '');
el.style.display = el.innerHTML ? 'block' : 'none';
@@ -48546,23 +48869,13 @@ TooltipContent.prototype = {
return [el.clientWidth, el.clientHeight];
},
- moveTo: function (x, y) {
- // xy should be based on canvas root. But tooltipContent is
- // the sibling of canvas root. So padding of ec container
- // should be considered here.
- var zr = this._zr;
- var viewportRootOffset;
- if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
- x += viewportRootOffset.offsetLeft;
- y += viewportRootOffset.offsetTop;
- }
+ moveTo: function (zrX, zrY) {
+ var styleCoord = this._styleCoord;
+ makeStyleCoord(styleCoord, this._zr, this._appendToBody, zrX, zrY);
var style = this.el.style;
- style.left = x + 'px';
- style.top = y + 'px';
-
- this._x = x;
- this._y = y;
+ style.left = styleCoord[0] + 'px';
+ style.top = styleCoord[1] + 'px';
},
hide: function () {
@@ -48588,6 +48901,10 @@ TooltipContent.prototype = {
return this._show;
},
+ dispose: function () {
+ this.el.parentNode.removeChild(this.el);
+ },
+
getOuterSize: function () {
var width = this.el.clientWidth;
var height = this.el.clientHeight;
@@ -48604,6 +48921,7 @@ TooltipContent.prototype = {
return {width: width, height: height};
}
+
};
/*
@@ -48835,7 +49153,9 @@ extendComponentView({
var tooltipContent;
if (this._renderMode === 'html') {
- tooltipContent = new TooltipContent(api.getDom(), api);
+ tooltipContent = new TooltipContent(api.getDom(), api, {
+ appendToBody: tooltipModel.get('appendToBody', true)
+ });
this._newLine = '<br/>';
}
else {
@@ -48988,7 +49308,6 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- event: {},
dataByCoordSys: payload.dataByCoordSys,
tooltipOption: payload.tooltipOption
}, dispatchAction);
@@ -49007,8 +49326,7 @@ extendComponentView({
offsetX: cx,
offsetY: cy,
position: payload.position,
- target: pointInfo.el,
- event: {}
+ target: pointInfo.el
}, dispatchAction);
}
}
@@ -49025,8 +49343,7 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- target: api.getZr().findHover(payload.x, payload.y).target,
- event: {}
+ target: api.getZr().findHover(payload.x, payload.y).target
}, dispatchAction);
}
},
@@ -49132,7 +49449,9 @@ extendComponentView({
_showAxisTooltip: function (dataByCoordSys, e) {
var ecModel = this._ecModel;
var globalTooltipModel = this._tooltipModel;
+
var point = [e.offsetX, e.offsetY];
+
var singleDefaultHTML = [];
var singleParamsList = [];
var singleTooltipModel = buildTooltipModel([
@@ -49388,6 +49707,7 @@ extendComponentView({
_updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
var viewWidth = this._api.getWidth();
var viewHeight = this._api.getHeight();
+
positionExpr = positionExpr || tooltipModel.get('position');
var contentSize = content.getSize();
@@ -49506,7 +49826,7 @@ extendComponentView({
if (env$1.node) {
return;
}
- this._tooltipContent.hide();
+ this._tooltipContent.dispose();
unregister('itemTooltip', api);
}
});
@@ -51351,26 +51671,28 @@ var ScrollableLegendView = LegendView.extend({
},
_findTargetItemIndex: function (targetDataIndex) {
+ if (!this._showController) {
+ return 0;
+ }
+
var index;
var contentGroup = this.getContentGroup();
var defaultIndex;
- if (this._showController) {
- contentGroup.eachChild(function (child, idx) {
- var legendDataIdx = child.__legendDataIndex;
- // FIXME
- // If the given targetDataIndex (from model) is illegal,
- // we use defualtIndex. But the index on the legend model and
- // action payload is still illegal. That case will not be
- // changed until some scenario requires.
- if (defaultIndex == null && legendDataIdx != null) {
- defaultIndex = idx;
- }
- if (legendDataIdx === targetDataIndex) {
- index = idx;
- }
- });
- }
+ contentGroup.eachChild(function (child, idx) {
+ var legendDataIdx = child.__legendDataIndex;
+ // FIXME
+ // If the given targetDataIndex (from model) is illegal,
+ // we use defualtIndex. But the index on the legend model and
+ // action payload is still illegal. That case will not be
+ // changed until some scenario requires.
+ if (defaultIndex == null && legendDataIdx != null) {
+ defaultIndex = idx;
+ }
+ if (legendDataIdx === targetDataIndex) {
+ index = idx;
+ }
+ });
return index != null ? index : defaultIndex;
}
@@ -51952,8 +52274,8 @@ function markerTypeCalculatorWithExtent(
var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
- coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
-
+ coordArr[targetCoordIndex] = data.get(calcDataDim, dataIndex);
+ var coordArrValue = data.get(targetDataDim, dataIndex);
// Make it simple, do not visit all stacked value to count precision.
var precision = getPrecision(data.get(targetDataDim, dataIndex));
precision = Math.min(precision, 20);
@@ -51961,7 +52283,7 @@ function markerTypeCalculatorWithExtent(
coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
}
- return coordArr;
+ return [coordArr, coordArrValue];
}
var curry$4 = curry;
@@ -52024,12 +52346,15 @@ function dataTransform(seriesModel, item) {
var otherCoordIndex = indexOf$1(dims, axisInfo.baseAxis.dim);
var targetCoordIndex = indexOf$1(dims, axisInfo.valueAxis.dim);
- item.coord = markerTypeCalculator[item.type](
+ var coordInfo = markerTypeCalculator[item.type](
data, axisInfo.baseDataDim, axisInfo.valueDataDim,
otherCoordIndex, targetCoordIndex
);
+ item.coord = coordInfo[0];
// Force to use the value of calculated value.
- item.value = item.coord[targetCoordIndex];
+ // let item use the value without stack.
+ item.value = coordInfo[1];
+
}
else {
// FIXME Only has one of xAxis and yAxis.
@@ -52421,7 +52746,8 @@ MarkerModel.extend({
},
label: {
show: true,
- position: 'end'
+ position: 'end',
+ distance: 5
},
lineStyle: {
type: 'dashed'
@@ -52646,39 +52972,90 @@ function updateSymbolAndLabelBeforeLineUpdate() {
var textPosition;
var textAlign;
var textVerticalAlign;
-
- var distance$$1 = 5 * invScale;
- // End
- if (label.__position === 'end') {
- textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
- textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
- }
- // Middle
- else if (label.__position === 'middle') {
- var halfPercent = percent / 2;
- var tangent = line.tangentAt(halfPercent);
- var n = [tangent[1], -tangent[0]];
- var cp = line.pointAt(halfPercent);
- if (n[1] > 0) {
- n[0] = -n[0];
- n[1] = -n[1];
- }
- textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
- textAlign = 'center';
- textVerticalAlign = 'bottom';
+ var textOrigin;
+
+ var distance$$1 = label.__labelDistance;
+ var distanceX = distance$$1[0] * invScale;
+ var distanceY = distance$$1[1] * invScale;
+ var halfPercent = percent / 2;
+ var tangent = line.tangentAt(halfPercent);
+ var n = [tangent[1], -tangent[0]];
+ var cp = line.pointAt(halfPercent);
+ if (n[1] > 0) {
+ n[0] = -n[0];
+ n[1] = -n[1];
+ }
+ var dir = tangent[0] < 0 ? -1 : 1;
+
+ if (label.__position !== 'start' && label.__position !== 'end') {
var rotation = -Math.atan2(tangent[1], tangent[0]);
if (toPos[0] < fromPos[0]) {
rotation = Math.PI + rotation;
}
label.attr('rotation', rotation);
}
- // Start
- else {
- textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
- textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+
+ var dy;
+ switch (label.__position) {
+ case 'insideStartTop':
+ case 'insideMiddleTop':
+ case 'insideEndTop':
+ case 'middle':
+ dy = -distanceY;
+ textVerticalAlign = 'bottom';
+ break;
+
+ case 'insideStartBottom':
+ case 'insideMiddleBottom':
+ case 'insideEndBottom':
+ dy = distanceY;
+ textVerticalAlign = 'top';
+ break;
+
+ default:
+ dy = 0;
+ textVerticalAlign = 'middle';
+ }
+
+ switch (label.__position) {
+ case 'end':
+ textPosition = [d[0] * distanceX + toPos[0], d[1] * distanceY + toPos[1]];
+ textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+ break;
+
+ case 'start':
+ textPosition = [-d[0] * distanceX + fromPos[0], -d[1] * distanceY + fromPos[1]];
+ textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+ break;
+
+ case 'insideStartTop':
+ case 'insideStart':
+ case 'insideStartBottom':
+ textPosition = [distanceX * dir + fromPos[0], fromPos[1] + dy];
+ textAlign = tangent[0] < 0 ? 'right' : 'left';
+ textOrigin = [-distanceX * dir, -dy];
+ break;
+
+ case 'insideMiddleTop':
+ case 'insideMiddle':
+ case 'insideMiddleBottom':
+ case 'middle':
+ textPosition = [cp[0], cp[1] + dy];
+ textAlign = 'center';
+ textOrigin = [0, -dy];
+ break;
+
+ case 'insideEndTop':
+ case 'insideEnd':
+ case 'insideEndBottom':
+ textPosition = [-distanceX * dir + toPos[0], toPos[1] + dy];
+ textAlign = tangent[0] >= 0 ? 'right' : 'left';
+ textOrigin = [distanceX * dir, -dy];
+ break;
}
+
label.attr({
style: {
// Use the user specified text align and baseline first
@@ -52686,7 +53063,8 @@ function updateSymbolAndLabelBeforeLineUpdate() {
textAlign: label.__textAlign || textAlign
},
position: textPosition,
- scale: [invScale, invScale]
+ scale: [invScale, invScale],
+ origin: textOrigin
});
}
}
@@ -52862,6 +53240,12 @@ lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
label.__verticalAlign = labelStyle.textVerticalAlign;
// 'start', 'middle', 'end'
label.__position = labelModel.get('position') || 'middle';
+
+ var distance$$1 = labelModel.get('distance');
+ if (!isArray(distance$$1)) {
+ distance$$1 = [distance$$1, distance$$1];
+ }
+ label.__labelDistance = distance$$1;
}
if (emphasisText != null) {
diff --git a/dist/echarts.common.min.js b/dist/echarts.common.min.js
index b864317..0d97001 100644
--- a/dist/echarts.common.min.js
+++ b/dist/echarts.common.min.js
@@ -19,4 +19,4 @@
*/
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,i=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,i=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
diff --git a/dist/echarts.js b/dist/echarts.js
index 187186c..49a2582 100644
--- a/dist/echarts.js
+++ b/dist/echarts.js
@@ -1285,7 +1285,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1714,6 +1718,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1736,6 +1742,153 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+var _calcOut$1 = [];
+
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+function transformLocalCoord(out, elFrom, elTarget, inX, inY) {
+ return transformCoordWithViewport(_calcOut$1, elFrom, inX, inY, true)
+ && transformCoordWithViewport(out, elTarget, _calcOut$1[0], _calcOut$1[1]);
+}
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1743,7 +1896,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1808,11 +1960,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1824,10 +1976,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1837,70 +1986,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4770,7 +4855,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4849,7 +4934,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4910,7 +4995,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4927,7 +5012,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4936,7 +5021,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4988,7 +5073,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10666,7 +10751,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10731,14 +10816,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10749,7 +10834,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10760,7 +10845,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -11027,13 +11112,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11488,7 +11576,7 @@ var instances$1 = {}; // ZRender实例map索引
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16433,12 +16521,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16447,20 +16533,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16476,12 +16564,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16490,6 +16576,16 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
var originWidth = inputShape.width;
var originHeight = inputShape.height;
+ outputShape.x = originX;
+ outputShape.y = originY;
+ outputShape.width = originWidth;
+ outputShape.height = originHeight;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
outputShape.x = subPixelOptimize$1(originX, lineWidth, true);
outputShape.y = subPixelOptimize$1(originY, lineWidth, true);
outputShape.width = Math.max(
@@ -16506,11 +16602,14 @@ function subPixelOptimizeRect$1(outputShape, inputShape, style) {
* Sub pixel optimize for canvas
*
* @param {number} position Coordinate, such as x, y
- * @param {number} lineWidth Should be nonnegative integer.
+ * @param {number} lineWidth If `null`/`undefined`/`0`, do not optimize.
* @param {boolean=} positiveOrNegative Default false (negative).
* @return {number} Optimized position.
*/
function subPixelOptimize$1(position, lineWidth, positiveOrNegative) {
+ if (!lineWidth) {
+ return position;
+ }
// Assure that (position + lineWidth / 2) is near integer edge,
// otherwise line will be fuzzy in canvas.
var doubledPosition = round(position * 2);
@@ -18211,7 +18310,7 @@ function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb)
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -18237,7 +18336,7 @@ function updateProps(el, props, animatableModel, dataIndex, cb) {
* configuration in series.
*
* Caution: this method will stop previous animation.
- * So if do not use this method to one element twice before
+ * So do not use this method to one element twice before
* animation starts, unless you know what you are doing.
*
* @param {module:zrender/Element} el
@@ -25098,8 +25197,11 @@ var createRenderPlanner = function () {
var originalLarge = fields.large;
var originalProgressive = fields.progressiveRender;
- var large = fields.large = pipelineContext.large;
- var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+ // FIXME: if the planner works on a filtered series, `pipelineContext` does not
+ // exists. See #11611 . Probably we need to modify this structure, see the comment
+ // on `performRawSeries` in `Schedular.js`.
+ var large = fields.large = pipelineContext && pipelineContext.large;
+ var progressive = fields.progressiveRender = pipelineContext && pipelineContext.progressiveRender;
return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
};
@@ -26274,6 +26376,14 @@ function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
task.dirty();
}
var performArgs = scheduler.getPerformArgs(task, opt.block);
+ // FIXME
+ // if intending to decalare `performRawSeries` in handlers, only
+ // stream-independent (specifically, data item independent) operations can be
+ // performed. Because is a series is filtered, most of the tasks will not
+ // be performed. A stream-dependent operation probably cause wrong biz logic.
+ // Perhaps we should not provide a separate callback for this case instead
+ // of providing the config `performRawSeries`. The stream-dependent operaions
+ // and stream-independent operations should better not be mixed.
performArgs.skip = !stageHandler.performRawSeries
&& ecModel.isSeriesFiltered(task.context.model);
updatePayload(task, payload);
@@ -27652,10 +27762,10 @@ var isFunction = isFunction$1;
var isObject = isObject$1;
var parseClassType = ComponentModel.parseClassType;
-var version = '4.6.0';
+var version = '4.7.0';
var dependencies = {
- zrender: '4.2.0'
+ zrender: '4.3.0'
};
var TEST_FRAME_REMAIN_TIME = 1;
@@ -33940,7 +34050,7 @@ var IntervalScale = Scale.extend({
if (extent[0] < niceTickExtent[0]) {
if (expandToNicedExtent) {
- ticks.push(roundNumber(niceTickExtent[0] - interval));
+ ticks.push(roundNumber(niceTickExtent[0] - interval, intervalPrecision));
}
else {
ticks.push(extent[0]);
@@ -33966,7 +34076,7 @@ var IntervalScale = Scale.extend({
var lastNiceTick = ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1];
if (extent[1] > lastNiceTick) {
if (expandToNicedExtent) {
- ticks.push(lastNiceTick + interval);
+ ticks.push(roundNumber(lastNiceTick + interval, intervalPrecision));
}
else {
ticks.push(extent[1]);
@@ -34541,11 +34651,6 @@ function layout(seriesType, ecModel) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
- if (isNaN(value) || isNaN(baseValue)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -34578,7 +34683,10 @@ function layout(seriesType, ecModel) {
if (Math.abs(width) < barMinHeight) {
width = (width < 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ // Ignore stack from NaN value
+ if (!isNaN(width)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+ }
}
else {
var coord = cartesian.dataToPoint([baseValue, value]);
@@ -34591,7 +34699,10 @@ function layout(seriesType, ecModel) {
// Include zero to has a positive bar
height = (height <= 0 ? -1 : 1) * barMinHeight;
}
- stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ // Ignore stack from NaN value
+ if (!isNaN(height)) {
+ stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+ }
}
data.setItemLayout(idx, {
@@ -34619,6 +34730,7 @@ var largeLayout = {
var data = seriesModel.getData();
var cartesian = seriesModel.coordinateSystem;
+ var coordLayout = cartesian.grid.getRect();
var baseAxis = cartesian.getBaseAxis();
var valueAxis = cartesian.getOtherAxis(baseAxis);
var valueDim = data.mapDimension(valueAxis.dim);
@@ -34638,6 +34750,7 @@ var largeLayout = {
function progress(params, data) {
var count = params.count;
var largePoints = new LargeArr(count * 2);
+ var largeBackgroundPoints = new LargeArr(count * 2);
var largeDataIndices = new LargeArr(count);
var dataIndex;
var coord = [];
@@ -34651,7 +34764,9 @@ var largeLayout = {
coord = cartesian.dataToPoint(valuePair, null, coord);
// Data index might not be in order, depends on `progressiveChunkMode`.
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
largePoints[pointsOffset++] = coord[0];
+ largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
largePoints[pointsOffset++] = coord[1];
largeDataIndices[idxOffset++] = dataIndex;
}
@@ -34659,8 +34774,10 @@ var largeLayout = {
data.setLayout({
largePoints: largePoints,
largeDataIndices: largeDataIndices,
+ largeBackgroundPoints: largeBackgroundPoints,
barWidth: barWidth,
valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+ backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
valueAxisHorizontal: valueAxisHorizontal
});
}
@@ -42547,6 +42664,117 @@ function layout$1(gridModel, axisModel, opt) {
* under the License.
*/
+function rectCoordAxisBuildSplitArea(axisView, axisGroup, axisModel, gridModel) {
+ var axis = axisModel.axis;
+
+ if (axis.scale.isBlank()) {
+ return;
+ }
+
+ var splitAreaModel = axisModel.getModel('splitArea');
+ var areaStyleModel = splitAreaModel.getModel('areaStyle');
+ var areaColors = areaStyleModel.get('color');
+
+ var gridRect = gridModel.coordinateSystem.getRect();
+
+ var ticksCoords = axis.getTicksCoords({
+ tickModel: splitAreaModel,
+ clamp: true
+ });
+
+ if (!ticksCoords.length) {
+ return;
+ }
+
+ // For Making appropriate splitArea animation, the color and anid
+ // should be corresponding to previous one if possible.
+ var areaColorsLen = areaColors.length;
+ var lastSplitAreaColors = axisView.__splitAreaColors;
+ var newSplitAreaColors = createHashMap();
+ var colorIndex = 0;
+ if (lastSplitAreaColors) {
+ for (var i = 0; i < ticksCoords.length; i++) {
+ var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+ if (cIndex != null) {
+ colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+ break;
+ }
+ }
+ }
+
+ var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+ var areaStyle = areaStyleModel.getAreaStyle();
+ areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+ for (var i = 1; i < ticksCoords.length; i++) {
+ var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+ var x;
+ var y;
+ var width;
+ var height;
+ if (axis.isHorizontal()) {
+ x = prev;
+ y = gridRect.y;
+ width = tickCoord - x;
+ height = gridRect.height;
+ prev = x + width;
+ }
+ else {
+ x = gridRect.x;
+ y = prev;
+ width = gridRect.width;
+ height = tickCoord - y;
+ prev = y + height;
+ }
+
+ var tickValue = ticksCoords[i - 1].tickValue;
+ tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+ axisGroup.add(new Rect({
+ anid: tickValue != null ? 'area_' + tickValue : null,
+ shape: {
+ x: x,
+ y: y,
+ width: width,
+ height: height
+ },
+ style: defaults({
+ fill: areaColors[colorIndex]
+ }, areaStyle),
+ silent: true
+ }));
+
+ colorIndex = (colorIndex + 1) % areaColorsLen;
+ }
+
+ axisView.__splitAreaColors = newSplitAreaColors;
+}
+
+function rectCoordAxisHandleRemove(axisView) {
+ axisView.__splitAreaColors = null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements. See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership. The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License. You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing,
+* software distributed under the License is distributed on an
+* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+* KIND, either express or implied. See the License for the
+* specific language governing permissions and limitations
+* under the License.
+*/
+
var axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
];
@@ -42598,7 +42826,7 @@ var CartesianAxisView = AxisView.extend({
},
remove: function () {
- this._splitAreaColors = null;
+ rectCoordAxisHandleRemove(this);
},
/**
@@ -42730,91 +42958,7 @@ var CartesianAxisView = AxisView.extend({
* @private
*/
_splitArea: function (axisModel, gridModel) {
- var axis = axisModel.axis;
-
- if (axis.scale.isBlank()) {
- return;
- }
-
- var splitAreaModel = axisModel.getModel('splitArea');
- var areaStyleModel = splitAreaModel.getModel('areaStyle');
- var areaColors = areaStyleModel.get('color');
-
- var gridRect = gridModel.coordinateSystem.getRect();
-
- var ticksCoords = axis.getTicksCoords({
- tickModel: splitAreaModel,
- clamp: true
- });
-
- if (!ticksCoords.length) {
- return;
- }
-
- // For Making appropriate splitArea animation, the color and anid
- // should be corresponding to previous one if possible.
- var areaColorsLen = areaColors.length;
- var lastSplitAreaColors = this._splitAreaColors;
- var newSplitAreaColors = createHashMap();
- var colorIndex = 0;
- if (lastSplitAreaColors) {
- for (var i = 0; i < ticksCoords.length; i++) {
- var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
- if (cIndex != null) {
- colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
- break;
- }
- }
- }
-
- var prev = axis.toGlobalCoord(ticksCoords[0].coord);
-
- var areaStyle = areaStyleModel.getAreaStyle();
- areaColors = isArray(areaColors) ? areaColors : [areaColors];
-
- for (var i = 1; i < ticksCoords.length; i++) {
- var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
-
- var x;
- var y;
- var width;
- var height;
- if (axis.isHorizontal()) {
- x = prev;
- y = gridRect.y;
- width = tickCoord - x;
- height = gridRect.height;
- prev = x + width;
- }
- else {
- x = gridRect.x;
- y = prev;
- width = gridRect.width;
- height = tickCoord - y;
- prev = y + height;
- }
-
- var tickValue = ticksCoords[i - 1].tickValue;
- tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
-
- this._axisGroup.add(new Rect({
- anid: tickValue != null ? 'area_' + tickValue : null,
- shape: {
- x: x,
- y: y,
- width: width,
- height: height
- },
- style: defaults({
- fill: areaColors[colorIndex]
- }, areaStyle),
- silent: true
- }));
-
- colorIndex = (colorIndex + 1) % areaColorsLen;
- }
-
- this._splitAreaColors = newSplitAreaColors;
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, gridModel);
}
});
@@ -43060,7 +43204,21 @@ BaseBarSeries.extend({
// If use caps on two sides of bars
// Only available on tangential polar bar
- roundCap: false
+ roundCap: false,
+
+ showBackground: false,
+ backgroundStyle: {
+ color: 'rgba(180, 180, 180, 0.2)',
+ borderColor: null,
+ borderWidth: 0,
+ borderType: 'solid',
+ borderRadius: 0,
+ shadowBlur: 0,
+ shadowColor: null,
+ shadowOffsetX: 0,
+ shadowOffsetY: 0,
+ opacity: 1
+ }
}
});
@@ -43365,15 +43523,28 @@ extendChartView({
var roundCap = seriesModel.get('roundCap', true);
+ var drawBackground = seriesModel.get('showBackground', true);
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+
+ var bgEls = [];
+ var oldBgEls = this._backgroundEls || [];
+
data.diff(oldData)
.add(function (dataIndex) {
+ var itemModel = data.getItemModel(dataIndex);
+ var layout = getLayout[coord.type](data, dataIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = createBackgroundEl(coord, isHorizontalOrRadial, layout);
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[dataIndex] = bgEl;
+ }
+
+ // If dataZoom in filteMode: 'empty', the baseValue can be set as NaN in "axisProxy".
if (!data.hasValue(dataIndex)) {
return;
}
- var itemModel = data.getItemModel(dataIndex);
- var layout = getLayout[coord.type](data, dataIndex, itemModel);
-
if (needsClip) {
// Clip will modify the layout params.
// And return a boolean to determine if the shape are fully clipped.
@@ -43396,16 +43567,24 @@ extendChartView({
);
})
.update(function (newIndex, oldIndex) {
- var el = oldData.getItemGraphicEl(oldIndex);
+ var itemModel = data.getItemModel(newIndex);
+ var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+ if (drawBackground) {
+ var bgEl = oldBgEls[oldIndex];
+ bgEl.useStyle(backgroundModel.getBarItemStyle());
+ bgEls[newIndex] = bgEl;
+ var shape = createBackgroundShape(isHorizontalOrRadial, layout, coord);
+ updateProps(bgEl, { shape: shape }, animationModel, newIndex);
+ }
+
+ var el = oldData.getItemGraphicEl(oldIndex);
if (!data.hasValue(newIndex)) {
group.remove(el);
return;
}
- var itemModel = data.getItemModel(newIndex);
- var layout = getLayout[coord.type](data, newIndex, itemModel);
-
if (needsClip) {
var isClipped = clip[coord.type](coordSysClipArea, layout);
if (isClipped) {
@@ -43443,6 +43622,15 @@ extendChartView({
})
.execute();
+ var bgGroup = this._backgroundGroup || (this._backgroundGroup = new Group());
+ bgGroup.removeAll();
+
+ for (var i = 0; i < bgEls.length; ++i) {
+ bgGroup.add(bgEls[i]);
+ }
+ group.add(bgGroup);
+ this._backgroundEls = bgEls;
+
this._data = data;
},
@@ -43463,6 +43651,7 @@ extendChartView({
},
_incrementalRenderLarge: function (params, seriesModel) {
+ this._removeBackground();
createLarge(seriesModel, this.group, true);
},
@@ -43476,6 +43665,9 @@ extendChartView({
var group = this.group;
var data = this._data;
if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+ this._removeBackground();
+ this._backgroundEls = [];
+
data.eachItemGraphicEl(function (el) {
if (el.type === 'sector') {
removeSector(el.dataIndex, ecModel, el);
@@ -43489,6 +43681,11 @@ extendChartView({
group.removeAll();
}
this._data = null;
+ },
+
+ _removeBackground: function () {
+ this.group.remove(this._backgroundGroup);
+ this._backgroundGroup = null;
}
});
@@ -43546,7 +43743,12 @@ var elementCreator = {
dataIndex, layout, isHorizontal,
animationModel, isUpdate
) {
- var rect = new Rect({shape: extend({}, layout)});
+ var rect = new Rect({
+ shape: extend({}, layout),
+ z2: 1
+ });
+
+ rect.name = 'item';
// Animation
if (animationModel) {
@@ -43576,9 +43778,12 @@ var elementCreator = {
var ShapeClass = (!isRadial && roundCap) ? Sausage : Sector;
var sector = new ShapeClass({
- shape: defaults({clockwise: clockwise}, layout)
+ shape: defaults({clockwise: clockwise}, layout),
+ z2: 1
});
+ sector.name = 'item';
+
// Animation
if (animationModel) {
var sectorShape = sector.shape;
@@ -43698,7 +43903,10 @@ function updateStyle(
// In case width or height are too small.
function getLineWidth(itemModel, rawLayout) {
var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
- return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+ // width or height may be NaN for empty data
+ var width = isNaN(rawLayout.width) ? Number.MAX_VALUE : Math.abs(rawLayout.width);
+ var height = isNaN(rawLayout.height) ? Number.MAX_VALUE : Math.abs(rawLayout.height);
+ return Math.min(lineWidth, width, height);
}
@@ -43730,13 +43938,38 @@ function createLarge(seriesModel, group, incremental) {
var baseDimIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
startPoint[1 - baseDimIdx] = data.getLayout('valueAxisStart');
+ var largeDataIndices = data.getLayout('largeDataIndices');
+ var barWidth = data.getLayout('barWidth');
+
+ var backgroundModel = seriesModel.getModel('backgroundStyle');
+ var drawBackground = seriesModel.get('showBackground', true);
+
+ if (drawBackground) {
+ var points = data.getLayout('largeBackgroundPoints');
+ var backgroundStartPoint = [];
+ backgroundStartPoint[1 - baseDimIdx] = data.getLayout('backgroundStart');
+
+ var bgEl = new LargePath({
+ shape: {points: points},
+ incremental: !!incremental,
+ __startPoint: backgroundStartPoint,
+ __baseDimIdx: baseDimIdx,
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth,
+ silent: true,
+ z2: 0
+ });
+ setLargeBackgroundStyle(bgEl, backgroundModel, data);
+ group.add(bgEl);
+ }
+
var el = new LargePath({
shape: {points: data.getLayout('largePoints')},
incremental: !!incremental,
__startPoint: startPoint,
__baseDimIdx: baseDimIdx,
- __largeDataIndices: data.getLayout('largeDataIndices'),
- __barWidth: data.getLayout('barWidth')
+ __largeDataIndices: largeDataIndices,
+ __barWidth: barWidth
});
group.add(el);
setLargeStyle(el, seriesModel, data);
@@ -43801,6 +44034,55 @@ function setLargeStyle(el, seriesModel, data) {
el.style.lineWidth = data.getLayout('barWidth');
}
+function setLargeBackgroundStyle(el, backgroundModel, data) {
+ var borderColor = backgroundModel.get('borderColor') || backgroundModel.get('color');
+ var itemStyle = backgroundModel.getItemStyle(['color', 'borderColor']);
+
+ el.useStyle(itemStyle);
+ el.style.fill = null;
+ el.style.stroke = borderColor;
+ el.style.lineWidth = data.getLayout('barWidth');
+}
+
+function createBackgroundShape(isHorizontalOrRadial, layout, coord) {
+ var coordLayout;
+ var isPolar = coord.type === 'polar';
+ if (isPolar) {
+ coordLayout = coord.getArea();
+ }
+ else {
+ coordLayout = coord.grid.getRect();
+ }
+
+ if (isPolar) {
+ return {
+ cx: coordLayout.cx,
+ cy: coordLayout.cy,
+ r0: isHorizontalOrRadial ? coordLayout.r0 : layout.r0,
+ r: isHorizontalOrRadial ? coordLayout.r : layout.r,
+ startAngle: isHorizontalOrRadial ? layout.startAngle : 0,
+ endAngle: isHorizontalOrRadial ? layout.endAngle : Math.PI * 2
+ };
+ }
+ else {
+ return {
+ x: isHorizontalOrRadial ? layout.x : coordLayout.x,
+ y: isHorizontalOrRadial ? coordLayout.y : layout.y,
+ width: isHorizontalOrRadial ? layout.width : coordLayout.width,
+ height: isHorizontalOrRadial ? coordLayout.height : layout.height
+ };
+ }
+}
+
+function createBackgroundEl(coord, isHorizontalOrRadial, layout) {
+ var ElementClz = coord.type === 'polar' ? Sector : Rect;
+ return new ElementClz({
+ shape: createBackgroundShape(isHorizontalOrRadial, layout, coord),
+ silent: true,
+ z2: 0
+ });
+}
+
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
@@ -44410,7 +44692,7 @@ piePieceProto.updateData = function (data, idx, firstCreate) {
toggleItemSelected(
this,
data.getItemLayout(idx),
- seriesModel.isSelected(null, idx),
+ seriesModel.isSelected(data.getName(idx)),
seriesModel.get('selectedOffset'),
seriesModel.get('animation')
);
@@ -45162,7 +45444,7 @@ var labelLayout = function (seriesModel, r, viewWidth, viewHeight, viewLeft, vie
inside: isLabelInside,
labelDistance: labelDistance,
labelAlignTo: labelAlignTo,
- labelMargin:labelMargin,
+ labelMargin: labelMargin,
bleedMargin: bleedMargin,
textRect: textRect,
text: text,
@@ -46205,6 +46487,7 @@ Radar.prototype.update = function (ecModel, api) {
var fixedMax = axisModel.getMax();
var interval = scale.getInterval();
+
if (fixedMin != null && fixedMax != null) {
// User set min, max, divide to get new interval
scale.setExtent(+fixedMin, +fixedMax);
@@ -46240,13 +46523,10 @@ Radar.prototype.update = function (ecModel, api) {
if (nicedSplitNumber > splitNumber) {
interval = increaseInterval(interval);
}
- // PENDING
- var center = Math.round((rawExtent[0] + rawExtent[1]) / 2 / interval) * interval;
- var halfSplitNumber = Math.round(splitNumber / 2);
- scale.setExtent(
- round$1(center - halfSplitNumber * interval),
- round$1(center + (splitNumber - halfSplitNumber) * interval)
- );
+ // TODO
+ var max = Math.ceil(rawExtent[1] / interval) * interval;
+ var min = round$1(max - interval * splitNumber);
+ scale.setExtent(min, max);
scale.setInterval(interval);
}
});
@@ -46694,6 +46974,28 @@ var RadarSeries = SeriesModel.extend({
}).join('<br />');
},
+ /**
+ * @implement
+ */
+ getTooltipPosition: function (dataIndex) {
+ if (dataIndex != null) {
+ var data = this.getData();
+ var coordSys = this.coordinateSystem;
+ var values = data.getValues(
+ map(coordSys.dimensions, function (dim) {
+ return data.mapDimension(dim);
+ }), dataIndex, true
+ );
+
+ for (var i = 0, len = values.length; i < len; i++) {
+ if (!isNaN(values[i])) {
+ var indicatorAxes = coordSys.getIndicatorAxes();
+ return coordSys.coordToPoint(indicatorAxes[i].dataToCoord(values[i]), i);
+ }
+ }
+ }
+ },
+
defaultOption: {
zlevel: 0,
z: 2,
@@ -48468,13 +48770,13 @@ MapDraw.prototype = {
var regionsGroup = this._regionsGroup;
var group = this.group;
- if (geo._roamTransformable.transform) {
- group.transform = geo._roamTransformable.transform.slice();
- group.decomposeTransform();
- }
+ var transformInfo = geo.getTransformInfo();
+ group.transform = transformInfo.roamTransform;
+ group.decomposeTransform();
+ group.dirty();
- var scale = geo._rawTransformable.scale;
- var position = geo._rawTransformable.position;
+ var scale = transformInfo.rawScale;
+ var position = transformInfo.rawPosition;
regionsGroup.removeAll();
@@ -49280,7 +49582,6 @@ View.prototype = {
/**
* Remove roam
*/
-
_updateCenterAndZoom: function () {
// Must update after view transform updated
var rawTransformMatrix = this._rawTransformable.getLocalTransform();
@@ -49324,6 +49625,16 @@ View.prototype = {
this.decomposeTransform();
},
+ getTransformInfo: function () {
+ var roamTransform = this._roamTransformable.transform;
+ var rawTransformable = this._rawTransformable;
+ return {
+ roamTransform: roamTransform ? slice(roamTransform) : create$1(),
+ rawScale: slice(rawTransformable.scale),
+ rawPosition: slice(rawTransformable.position)
+ };
+ },
+
/**
* @return {module:zrender/core/BoundingRect}
*/
@@ -50940,6 +51251,11 @@ SeriesModel.extend({
// the layout of the tree, two value can be selected, 'orthogonal' or 'radial'
layout: 'orthogonal',
+ // value can be 'polyline'
+ edgeShape: 'curve',
+
+ edgeForkPosition: '50%',
+
// true | false | 'move' | 'scale', see module:component/helper/RoamController.
roam: false,
@@ -51344,6 +51660,58 @@ function defaultSeparation(node1, node2) {
* under the License.
*/
+var TreeShape = extendShape({
+ shape: {
+ parentPoint: [],
+ childPoints: [],
+ orient: '',
+ forkPosition: ''
+ },
+
+ style: {
+ stroke: '#000',
+ fill: null
+ },
+
+ buildPath: function (ctx, shape) {
+ var childPoints = shape.childPoints;
+ var childLen = childPoints.length;
+ var parentPoint = shape.parentPoint;
+ var firstChildPos = childPoints[0];
+ var lastChildPos = childPoints[childLen - 1];
+
+ if (childLen === 1) {
+ ctx.moveTo(parentPoint[0], parentPoint[1]);
+ ctx.lineTo(firstChildPos[0], firstChildPos[1]);
+ return;
+ }
+
+ var orient = shape.orient;
+ var forkDim = (orient === 'TB' || orient === 'BT') ? 0 : 1;
+ var otherDim = 1 - forkDim;
+ var forkPosition = parsePercent$1(shape.forkPosition, 1);
+ var tmpPoint = [];
+ tmpPoint[forkDim] = parentPoint[forkDim];
+ tmpPoint[otherDim] = parentPoint[otherDim] + (lastChildPos[otherDim] - parentPoint[otherDim]) * forkPosition;
+
+ ctx.moveTo(parentPoint[0], parentPoint[1]);
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ ctx.moveTo(firstChildPos[0], firstChildPos[1]);
+ tmpPoint[forkDim] = firstChildPos[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ tmpPoint[forkDim] = lastChildPos[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ ctx.lineTo(lastChildPos[0], lastChildPos[1]);
+
+ for (var i = 1; i < childLen - 1; i++) {
+ var point = childPoints[i];
+ ctx.moveTo(point[0], point[1]);
+ tmpPoint[forkDim] = point[forkDim];
+ ctx.lineTo(tmpPoint[0], tmpPoint[1]);
+ }
+ }
+});
+
extendChartView({
type: 'tree',
@@ -51403,6 +51771,8 @@ extendChartView({
var seriesScope = {
expandAndCollapse: seriesModel.get('expandAndCollapse'),
layout: layout,
+ edgeShape: seriesModel.get('edgeShape'),
+ edgeForkPosition: seriesModel.get('edgeForkPosition'),
orient: seriesModel.getOrient(),
curvature: seriesModel.get('lineStyle.curveness'),
symbolRotate: seriesModel.get('symbolRotate'),
@@ -51704,22 +52074,72 @@ function updateNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
});
}
- if (node.parentNode && node.parentNode !== virtualRoot) {
- var edge = symbolEl.__edge;
- if (!edge) {
- edge = symbolEl.__edge = new BezierCurve({
- shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
- style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
- });
- }
+ drawEdge(
+ seriesModel, node, virtualRoot, symbolEl, sourceOldLayout,
+ sourceLayout, targetLayout, group, seriesScope
+ );
- updateProps(edge, {
- shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
- style: {opacity: 1}
- }, seriesModel);
+}
+
+function drawEdge(
+ seriesModel, node, virtualRoot, symbolEl, sourceOldLayout,
+ sourceLayout, targetLayout, group, seriesScope
+) {
+
+ var edgeShape = seriesScope.edgeShape;
+ var edge = symbolEl.__edge;
+ if (edgeShape === 'curve') {
+ if (node.parentNode && node.parentNode !== virtualRoot) {
+ if (!edge) {
+ edge = symbolEl.__edge = new BezierCurve({
+ shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
+ style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
+ });
+ }
+
+ updateProps(edge, {
+ shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
+ style: {opacity: 1}
+ }, seriesModel);
+ }
+ }
+ else if (edgeShape === 'polyline') {
+ if (seriesScope.layout === 'orthogonal') {
+ if (node !== virtualRoot && node.children && (node.children.length !== 0) && (node.isExpand === true)) {
+ var children = node.children;
+ var childPoints = [];
+ for (var i = 0; i < children.length; i++) {
+ var childLayout = children[i].getLayout();
+ childPoints.push([childLayout.x, childLayout.y]);
+ }
- group.add(edge);
+ if (!edge) {
+ edge = symbolEl.__edge = new TreeShape({
+ shape: {
+ parentPoint: [targetLayout.x, targetLayout.y],
+ childPoints: [[targetLayout.x, targetLayout.y]],
+ orient: seriesScope.orient,
+ forkPosition: seriesScope.edgeForkPosition
+ },
+ style: defaults({opacity: 0, strokeNoScale: true}, seriesScope.lineStyle)
+ });
+ }
+ updateProps(edge, {
+ shape: {
+ parentPoint: [targetLayout.x, targetLayout.y],
+ childPoints: childPoints
+ },
+ style: {opacity: 1}
+ }, seriesModel);
+ }
+ }
+ else {
+ if (__DEV__) {
+ throw new Error('The polyline edgeShape can only be used in orthogonal layout');
+ }
+ }
}
+ group.add(edge);
}
function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
@@ -51729,6 +52149,7 @@ function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+ var edgeShape = seriesScope.edgeShape;
var sourceLayout;
while (sourceLayout = source.getLayout(), sourceLayout == null) {
source = source.parentNode === virtualRoot ? source : source.parentNode || source;
@@ -51743,16 +52164,42 @@ function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope)
symbolEl.fadeOut(null, {keepLabel: true});
- var edge = symbolEl.__edge;
+ var sourceSymbolEl = data.getItemGraphicEl(source.dataIndex);
+ var sourceEdge = sourceSymbolEl.__edge;
+
+ // 1. when expand the sub tree, delete the children node should delete the edge of
+ // the source at the same time. because the polyline edge shape is only owned by the source.
+ // 2.when the node is the only children of the source, delete the node should delete the edge of
+ // the source at the same time. the same reason as above.
+ var edge = symbolEl.__edge
+ || ((source.isExpand === false || source.children.length === 1) ? sourceEdge : undefined);
+
+ var edgeShape = seriesScope.edgeShape;
+
if (edge) {
- updateProps(edge, {
- shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
- style: {
- opacity: 0
- }
- }, seriesModel, function () {
- group.remove(edge);
- });
+ if (edgeShape === 'curve') {
+ updateProps(edge, {
+ shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
+ style: {
+ opacity: 0
+ }
+ }, seriesModel, function () {
+ group.remove(edge);
+ });
+ }
+ else if (edgeShape === 'polyline' && seriesScope.layout === 'orthogonal') {
+ updateProps(edge, {
+ shape: {
+ parentPoint: [sourceLayout.x, sourceLayout.y],
+ childPoints: [[sourceLayout.x, sourceLayout.y]]
+ },
+ style: {
+ opacity: 0
+ }
+ }, seriesModel, function () {
+ group.remove(edge);
+ });
+ }
}
}
@@ -52994,6 +53441,7 @@ extendChartView({
var thisStorage = createStorage();
var oldStorage = this._storage;
var willInvisibleEls = [];
+
var doRenderNode = curry(
renderNode, seriesModel,
thisStorage, oldStorage, reRoot,
@@ -53492,6 +53940,11 @@ function renderNode(
// Start of closure variables available in "Procedures in renderNode".
var thisLayout = thisNode.getLayout();
+ var data = seriesModel.getData();
+
+ // Only for enabling highlight/downplay. Clear firstly.
+ // Because some node will not be rendered.
+ data.setItemGraphicEl(thisNode.dataIndex, null);
if (!thisLayout || !thisLayout.isInView) {
return;
@@ -53531,14 +53984,36 @@ function renderNode(
return group;
}
+ var nodeModel = thisNode.getModel();
+
// Background
var bg = giveGraphic('background', Rect$1, depth, Z_BG);
bg && renderBackground(group, bg, isParent && thisLayout.upperHeight);
// No children, render content.
- if (!isParent) {
+ if (isParent) {
+ // Because of the implementation about "traverse" in graphic hover style, we
+ // can not set hover listener on the "group" of non-leaf node. Otherwise the
+ // hover event from the descendents will be listenered.
+ if (isHighDownDispatcher(group)) {
+ setAsHighDownDispatcher(group, false);
+ }
+ if (bg) {
+ setAsHighDownDispatcher(bg, true);
+ // Only for enabling highlight/downplay.
+ data.setItemGraphicEl(thisNode.dataIndex, bg);
+ }
+ }
+ else {
var content = giveGraphic('content', Rect$1, depth, Z_CONTENT);
content && renderContent(group, content);
+
+ if (bg && isHighDownDispatcher(bg)) {
+ setAsHighDownDispatcher(bg, false);
+ }
+ setAsHighDownDispatcher(group, true);
+ // Only for enabling highlight/downplay.
+ data.setItemGraphicEl(thisNode.dataIndex, group);
}
return group;
@@ -53553,10 +54028,17 @@ function renderNode(
bg.seriesIndex = seriesModel.seriesIndex;
bg.setShape({x: 0, y: 0, width: thisWidth, height: thisHeight});
- var visualBorderColor = thisNode.getVisual('borderColor', true);
- var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
- updateStyle(bg, function () {
+ if (thisInvisible) {
+ // If invisible, do not set visual, otherwise the element will
+ // change immediately before animation. We think it is OK to
+ // remain its origin color when moving out of the view window.
+ processInvisible(bg);
+ }
+ else {
+ bg.invisible = false;
+ var visualBorderColor = thisNode.getVisual('borderColor', true);
+ var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
var normalStyle = getItemStyleNormal(itemStyleNormalModel);
normalStyle.fill = visualBorderColor;
var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
@@ -53576,8 +54058,8 @@ function renderNode(
}
bg.setStyle(normalStyle);
- setHoverStyle(bg, emphasisStyle);
- });
+ setElementHoverStyle(bg, emphasisStyle);
+ }
group.add(bg);
}
@@ -53598,8 +54080,15 @@ function renderNode(
height: contentHeight
});
- var visualColor = thisNode.getVisual('color', true);
- updateStyle(content, function () {
+ if (thisInvisible) {
+ // If invisible, do not set visual, otherwise the element will
+ // change immediately before animation. We think it is OK to
+ // remain its origin color when moving out of the view window.
+ processInvisible(content);
+ }
+ else {
+ content.invisible = false;
+ var visualColor = thisNode.getVisual('color', true);
var normalStyle = getItemStyleNormal(itemStyleNormalModel);
normalStyle.fill = visualColor;
var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
@@ -53607,32 +54096,19 @@ function renderNode(
prepareText(normalStyle, emphasisStyle, visualColor, contentWidth, contentHeight);
content.setStyle(normalStyle);
- setHoverStyle(content, emphasisStyle);
- });
+ setElementHoverStyle(content, emphasisStyle);
+ }
group.add(content);
}
- function updateStyle(element, cb) {
- if (!thisInvisible) {
- // If invisible, do not set visual, otherwise the element will
- // change immediately before animation. We think it is OK to
- // remain its origin color when moving out of the view window.
- cb();
-
- if (!element.__tmWillVisible) {
- element.invisible = false;
- }
- }
- else {
- // Delay invisible setting utill animation finished,
- // avoid element vanish suddenly before animation.
- !element.invisible && willInvisibleEls.push(element);
- }
+ function processInvisible(element) {
+ // Delay invisible setting utill animation finished,
+ // avoid element vanish suddenly before animation.
+ !element.invisible && willInvisibleEls.push(element);
}
function prepareText(normalStyle, emphasisStyle, visualColor, width, height, upperLabelRect) {
- var nodeModel = thisNode.getModel();
var text = retrieve(
seriesModel.getFormattedLabel(
thisNode.dataIndex, 'normal', null, null, upperLabelRect ? 'upperLabel' : 'label'
@@ -53729,6 +54205,7 @@ function renderNode(
// Fade in, user can be aware that these nodes are new.
lastCfg.fadein = storageName !== 'nodeGroup';
}
+
}
// We can not set all backgroud with the same z, Because the behaviour of
@@ -56144,7 +56621,8 @@ var GraphSeries = extendSeriesModel({
edgeSymbol: ['none', 'none'],
edgeSymbolSize: 10,
edgeLabel: {
- position: 'middle'
+ position: 'middle',
+ distance: 5
},
draggable: false,
@@ -56398,39 +56876,90 @@ function updateSymbolAndLabelBeforeLineUpdate() {
var textPosition;
var textAlign;
var textVerticalAlign;
-
- var distance$$1 = 5 * invScale;
- // End
- if (label.__position === 'end') {
- textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
- textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
- }
- // Middle
- else if (label.__position === 'middle') {
- var halfPercent = percent / 2;
- var tangent = line.tangentAt(halfPercent);
- var n = [tangent[1], -tangent[0]];
- var cp = line.pointAt(halfPercent);
- if (n[1] > 0) {
- n[0] = -n[0];
- n[1] = -n[1];
- }
- textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
- textAlign = 'center';
- textVerticalAlign = 'bottom';
+ var textOrigin;
+
+ var distance$$1 = label.__labelDistance;
+ var distanceX = distance$$1[0] * invScale;
+ var distanceY = distance$$1[1] * invScale;
+ var halfPercent = percent / 2;
+ var tangent = line.tangentAt(halfPercent);
+ var n = [tangent[1], -tangent[0]];
+ var cp = line.pointAt(halfPercent);
+ if (n[1] > 0) {
+ n[0] = -n[0];
+ n[1] = -n[1];
+ }
+ var dir = tangent[0] < 0 ? -1 : 1;
+
+ if (label.__position !== 'start' && label.__position !== 'end') {
var rotation = -Math.atan2(tangent[1], tangent[0]);
if (toPos[0] < fromPos[0]) {
rotation = Math.PI + rotation;
}
label.attr('rotation', rotation);
}
- // Start
- else {
- textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
- textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
- textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+
+ var dy;
+ switch (label.__position) {
+ case 'insideStartTop':
+ case 'insideMiddleTop':
+ case 'insideEndTop':
+ case 'middle':
+ dy = -distanceY;
+ textVerticalAlign = 'bottom';
+ break;
+
+ case 'insideStartBottom':
+ case 'insideMiddleBottom':
+ case 'insideEndBottom':
+ dy = distanceY;
+ textVerticalAlign = 'top';
+ break;
+
+ default:
+ dy = 0;
+ textVerticalAlign = 'middle';
+ }
+
+ switch (label.__position) {
+ case 'end':
+ textPosition = [d[0] * distanceX + toPos[0], d[1] * distanceY + toPos[1]];
+ textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+ break;
+
+ case 'start':
+ textPosition = [-d[0] * distanceX + fromPos[0], -d[1] * distanceY + fromPos[1]];
+ textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+ textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+ break;
+
+ case 'insideStartTop':
+ case 'insideStart':
+ case 'insideStartBottom':
+ textPosition = [distanceX * dir + fromPos[0], fromPos[1] + dy];
+ textAlign = tangent[0] < 0 ? 'right' : 'left';
+ textOrigin = [-distanceX * dir, -dy];
+ break;
+
+ case 'insideMiddleTop':
+ case 'insideMiddle':
+ case 'insideMiddleBottom':
+ case 'middle':
+ textPosition = [cp[0], cp[1] + dy];
+ textAlign = 'center';
+ textOrigin = [0, -dy];
+ break;
+
+ case 'insideEndTop':
+ case 'insideEnd':
+ case 'insideEndBottom':
+ textPosition = [-distanceX * dir + toPos[0], toPos[1] + dy];
+ textAlign = tangent[0] >= 0 ? 'right' : 'left';
+ textOrigin = [distanceX * dir, -dy];
+ break;
}
+
label.attr({
style: {
// Use the user specified text align and baseline first
@@ -56438,7 +56967,8 @@ function updateSymbolAndLabelBeforeLineUpdate() {
textAlign: label.__textAlign || textAlign
},
position: textPosition,
- scale: [invScale, invScale]
+ scale: [invScale, invScale],
+ origin: textOrigin
});
}
}
@@ -56614,6 +57144,12 @@ lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
label.__verticalAlign = labelStyle.textVerticalAlign;
// 'start', 'middle', 'end'
label.__position = labelModel.get('position') || 'middle';
+
+ var distance$$1 = labelModel.get('distance');
+ if (!isArray(distance$$1)) {
+ distance$$1 = [distance$$1, distance$$1];
+ }
+ label.__labelDistance = distance$$1;
}
if (emphasisText != null) {
@@ -57308,7 +57844,7 @@ extendChartView({
},
focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var data = this._model.getData();
+ var data = seriesModel.getData();
var graph = data.graph;
var dataIndex = payload.dataIndex;
var edgeDataIndex = payload.edgeDataIndex;
@@ -57346,7 +57882,7 @@ extendChartView({
},
unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var graph = this._model.getData().graph;
+ var graph = seriesModel.getData().graph;
graph.eachNode(function (node) {
fadeOutItem(node, nodeOpacityPath);
@@ -62862,6 +63398,17 @@ var SankeySeries = SeriesModel.extend({
}
},
+ // Override Series.getDataParams()
+ getDataParams: function (dataIndex, dataType) {
+ var params = SankeySeries.superCall(this, 'getDataParams', dataIndex, dataType);
+ if (params.value == null && dataType === 'node') {
+ var node = this.getGraph().getNodeByIndex(dataIndex);
+ var nodeValue = node.getLayout().value;
+ params.value = nodeValue;
+ }
+ return params;
+ },
+
defaultOption: {
zlevel: 0,
z: 2,
@@ -62922,7 +63469,7 @@ var SankeySeries = SeriesModel.extend({
show: true
},
lineStyle: {
- opacity: 0.6
+ opacity: 0.5
}
},
@@ -62953,7 +63500,9 @@ var SankeySeries = SeriesModel.extend({
*/
var nodeOpacityPath$1 = ['itemStyle', 'opacity'];
+var hoverNodeOpacityPath = ['emphasis', 'itemStyle', 'opacity'];
var lineOpacityPath$1 = ['lineStyle', 'opacity'];
+var hoverLineOpacityPath = ['emphasis', 'lineStyle', 'opacity'];
function getItemOpacity$1(item, opacityPath) {
return item.getVisual('opacity') || item.getModel().get(opacityPath);
@@ -62961,8 +63510,8 @@ function getItemOpacity$1(item, opacityPath) {
function fadeOutItem$1(item, opacityPath, opacityRatio) {
var el = item.getGraphicEl();
-
var opacity = getItemOpacity$1(item, opacityPath);
+
if (opacityRatio != null) {
opacity == null && (opacity = 1);
opacity *= opacityRatio;
@@ -62980,12 +63529,14 @@ function fadeInItem$1(item, opacityPath) {
var opacity = getItemOpacity$1(item, opacityPath);
var el = item.getGraphicEl();
- el.highlight && el.highlight();
el.traverse(function (child) {
if (child.type !== 'group') {
child.setStyle('opacity', opacity);
}
});
+
+ // Support emphasis here.
+ el.highlight && el.highlight();
}
var SankeyShape = extendShape({
@@ -63023,6 +63574,14 @@ var SankeyShape = extendShape({
);
}
ctx.closePath();
+ },
+
+ highlight: function () {
+ this.trigger('emphasis');
+ },
+
+ downplay: function () {
+ this.trigger('normal');
}
});
@@ -63205,8 +63764,19 @@ extendChartView({
el.cursor = 'move';
}
+ el.highlight = function () {
+ this.trigger('emphasis');
+ };
+
+ el.downplay = function () {
+ this.trigger('normal');
+ };
+
+ el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+ el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
+
if (itemModel.get('focusNodeAdjacency')) {
- el.off('mouseover').on('mouseover', function () {
+ el.on('mouseover', el.focusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._clearTimer();
api.dispatchAction({
@@ -63216,7 +63786,8 @@ extendChartView({
});
}
});
- el.off('mouseout').on('mouseout', function () {
+
+ el.on('mouseout', el.unfocusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._dispatchUnfocus(api);
}
@@ -63226,8 +63797,12 @@ extendChartView({
edgeData.eachItemGraphicEl(function (el, dataIndex) {
var edgeModel = edgeData.getItemModel(dataIndex);
+
+ el.focusNodeAdjHandler && el.off('mouseover', el.focusNodeAdjHandler);
+ el.unfocusNodeAdjHandler && el.off('mouseout', el.unfocusNodeAdjHandler);
+
if (edgeModel.get('focusNodeAdjacency')) {
- el.off('mouseover').on('mouseover', function () {
+ el.on('mouseover', el.focusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._clearTimer();
api.dispatchAction({
@@ -63237,7 +63812,8 @@ extendChartView({
});
}
});
- el.off('mouseout').on('mouseout', function () {
+
+ el.on('mouseout', el.unfocusNodeAdjHandler = function () {
if (!sankeyView._focusAdjacencyDisabled) {
sankeyView._dispatchUnfocus(api);
}
@@ -63278,7 +63854,7 @@ extendChartView({
},
focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var data = this._model.getData();
+ var data = seriesModel.getData();
var graph = data.graph;
var dataIndex = payload.dataIndex;
var itemModel = data.getItemModel(dataIndex);
@@ -63298,15 +63874,15 @@ extendChartView({
});
if (node) {
- fadeInItem$1(node, nodeOpacityPath$1);
+ fadeInItem$1(node, hoverNodeOpacityPath);
var focusNodeAdj = itemModel.get('focusNodeAdjacency');
if (focusNodeAdj === 'outEdges') {
each$1(node.outEdges, function (edge) {
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node2, hoverNodeOpacityPath);
});
}
else if (focusNodeAdj === 'inEdges') {
@@ -63314,8 +63890,8 @@ extendChartView({
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node1, hoverNodeOpacityPath);
});
}
else if (focusNodeAdj === 'allEdges') {
@@ -63323,21 +63899,21 @@ extendChartView({
if (edge.dataIndex < 0) {
return;
}
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ (edge.node1 !== node) && fadeInItem$1(edge.node1, hoverNodeOpacityPath);
+ (edge.node2 !== node) && fadeInItem$1(edge.node2, hoverNodeOpacityPath);
});
}
}
if (edge) {
- fadeInItem$1(edge, lineOpacityPath$1);
- fadeInItem$1(edge.node1, nodeOpacityPath$1);
- fadeInItem$1(edge.node2, nodeOpacityPath$1);
+ fadeInItem$1(edge, hoverLineOpacityPath);
+ fadeInItem$1(edge.node1, hoverNodeOpacityPath);
+ fadeInItem$1(edge.node2, hoverNodeOpacityPath);
}
},
unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
- var graph = this._model.getGraph();
+ var graph = seriesModel.getGraph();
graph.eachNode(function (node) {
fadeOutItem$1(node, nodeOpacityPath$1);
@@ -63360,8 +63936,7 @@ function createGridClipShape$1(rect, seriesModel, cb) {
});
initProps(rectEl, {
shape: {
- width: rect.width + 20,
- height: rect.height + 20
+ width: rect.width + 20
}
}, seriesModel, cb);
@@ -63483,7 +64058,8 @@ function computeNodeValues(nodes) {
each$1(nodes, function (node) {
var value1 = sum(node.outEdges, getEdgeValue);
var value2 = sum(node.inEdges, getEdgeValue);
- var value = Math.max(value1, value2);
+ var nodeRawValue = node.getValue() || 0;
+ var value = Math.max(value1, value2, nodeRawValue);
node.setLayout({value: value}, true);
});
}
@@ -63827,12 +64403,12 @@ function getEdgeValue(edge) {
return edge.getValue();
}
-function sum(array, f, orient) {
+function sum(array, cb, orient) {
var sum = 0;
var len = array.length;
var i = -1;
while (++i < len) {
- var value = +f.call(array, array[i], orient);
+ var value = +cb.call(array, array[i], orient);
if (!isNaN(value)) {
sum += value;
}
@@ -65133,7 +65709,6 @@ var candlestickVisual = {
reset: function (seriesModel, ecModel) {
var data = seriesModel.getData();
- var isLargeRender = seriesModel.pipelineContext.large;
data.setVisual({
legendSymbol: 'roundRect',
@@ -65148,6 +65723,7 @@ var candlestickVisual = {
return;
}
+ var isLargeRender = seriesModel.pipelineContext.large;
return !isLargeRender && {progress: progress};
@@ -66244,6 +66820,7 @@ effectLineProto._updateEffectSymbol = function (lineData, idx) {
symbol.attr('scale', size);
this._symbolType = symbolType;
+ this._symbolScale = size;
this._updateEffectAnimation(lineData, effectModel, idx);
};
@@ -66334,6 +66911,7 @@ effectLineProto.updateSymbolPosition = function (symbol) {
var cp1 = symbol.__cp1;
var t = symbol.__t;
var pos = symbol.position;
+ var lastPos = [pos[0], pos[1]];
var quadraticAt$$1 = quadraticAt;
var quadraticDerivativeAt$$1 = quadraticDerivativeAt;
pos[0] = quadraticAt$$1(p1[0], cp1[0], p2[0], t);
@@ -66344,7 +66922,27 @@ effectLineProto.updateSymbolPosition = function (symbol) {
var ty = quadraticDerivativeAt$$1(p1[1], cp1[1], p2[1], t);
symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
-
+ // enable continuity trail for 'line', 'rect', 'roundRect' symbolType
+ if (this._symbolType === 'line' || this._symbolType === 'rect' || this._symbolType === 'roundRect') {
+ if (symbol.__lastT !== undefined && symbol.__lastT < symbol.__t) {
+ var scaleY = dist(lastPos, pos) * 1.05;
+ symbol.attr('scale', [symbol.scale[0], scaleY]);
+ // make sure the last segment render within endPoint
+ if (t === 1) {
+ pos[0] = lastPos[0] + (pos[0] - lastPos[0]) / 2;
+ pos[1] = lastPos[1] + (pos[1] - lastPos[1]) / 2;
+ }
+ }
+ else if (symbol.__lastT === 1) {
+ // After first loop, symbol.__t does NOT start with 0, so connect p1 to pos directly.
+ var scaleY = 2 * dist(p1, pos);
+ symbol.attr('scale', [symbol.scale[0], scaleY ]);
+ }
+ else {
+ symbol.attr('scale', this._symbolScale);
+ }
+ }
+ symbol.__lastT = symbol.__t;
symbol.ignore = false;
};
@@ -69170,7 +69768,7 @@ var axisBuilderAttrs$2 = [
'axisLine', 'axisTickLabel', 'axisName'
];
-var selfBuilderAttr = 'splitLine';
+var selfBuilderAttrs$1 = ['splitArea', 'splitLine'];
var SingleAxisView = AxisView.extend({
@@ -69184,21 +69782,33 @@ var SingleAxisView = AxisView.extend({
group.removeAll();
+ var oldAxisGroup = this._axisGroup;
+ this._axisGroup = new Group();
+
var layout = layout$2(axisModel);
var axisBuilder = new AxisBuilder(axisModel, layout);
each$1(axisBuilderAttrs$2, axisBuilder.add, axisBuilder);
+ group.add(this._axisGroup);
group.add(axisBuilder.getGroup());
- if (axisModel.get(selfBuilderAttr + '.show')) {
- this['_' + selfBuilderAttr](axisModel);
- }
+ each$1(selfBuilderAttrs$1, function (name) {
+ if (axisModel.get(name + '.show')) {
+ this['_' + name](axisModel);
+ }
+ }, this);
+
+ groupTransition(oldAxisGroup, this._axisGroup, axisModel);
SingleAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
},
+ remove: function () {
+ rectCoordAxisHandleRemove(this);
+ },
+
_splitLine: function (axisModel) {
var axis = axisModel.axis;
@@ -69267,6 +69877,10 @@ var SingleAxisView = AxisView.extend({
silent: true
}));
}
+ },
+
+ _splitArea: function (axisModel) {
+ rectCoordAxisBuildSplitArea(this, this._axisGroup, axisModel, axisModel);
}
});
@@ -74293,10 +74907,6 @@ function barLayoutPolar(seriesType, ecModel, api) {
var value = data.get(valueDim, idx);
var baseValue = data.get(baseDim, idx);
- if (isNaN(value)) {
- continue;
- }
-
var sign = value >= 0 ? 'p' : 'n';
var baseCoord = valueAxisStart;
@@ -75685,7 +76295,7 @@ AxisView.extend({
var axisBuilderAttrs$3 = [
'axisLine', 'axisTickLabel', 'axisName'
];
-var selfBuilderAttrs$1 = [
+var selfBuilderAttrs$2 = [
'splitLine', 'splitArea', 'minorSplitLine'
];
@@ -75713,7 +76323,7 @@ AxisView.extend({
each$1(axisBuilderAttrs$3, axisBuilder.add, axisBuilder);
this.group.add(axisBuilder.getGroup());
- each$1(selfBuilderAttrs$1, function (name) {
+ each$1(selfBuilderAttrs$2, function (name) {
if (radiusAxisModel.get(name + '.show') && !radiusAxis.scale.isBlank()) {
this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords, minorTicksCoords);
}
@@ -82116,24 +82726,63 @@ function assembleCssText(tooltipModel) {
return cssText.join(';') + ';';
}
+// If not able to make, do not modify the input `out`.
+function makeStyleCoord(out, zr, appendToBody, zrX, zrY) {
+ var zrPainter = zr && zr.painter;
+
+ if (appendToBody) {
+ var zrViewportRoot = zrPainter && zrPainter.getViewportRoot();
+ if (zrViewportRoot) {
+ // Some APPs might use scale on body, so we support CSS transform here.
+ transformLocalCoord(out, zrViewportRoot, document.body, zrX, zrY);
+ }
+ }
+ else {
+ out[0] = zrX;
+ out[1] = zrY;
+ // xy should be based on canvas root. But tooltipContent is
+ // the sibling of canvas root. So padding of ec container
+ // should be considered here.
+ var viewportRootOffset = zrPainter && zrPainter.getViewportRootOffset();
+ if (viewportRootOffset) {
+ out[0] += viewportRootOffset.offsetLeft;
+ out[1] += viewportRootOffset.offsetTop;
+ }
+ }
+}
+
/**
* @alias module:echarts/component/tooltip/TooltipContent
+ * @param {HTMLElement} container
+ * @param {ExtensionAPI} api
+ * @param {Object} [opt]
+ * @param {boolean} [opt.appendToBody]
+ * `false`: the DOM element will be inside the container. Default value.
+ * `true`: the DOM element will be appended to HTML body, which avoid
+ * some overflow clip but intrude outside of the container.
* @constructor
*/
-function TooltipContent(container, api) {
+function TooltipContent(container, api, opt) {
if (env$1.wxa) {
return null;
}
var el = document.createElement('div');
+ el.domBelongToZr = true;
+ this.el = el;
var zr = this._zr = api.getZr();
+ var appendToBody = this._appendToBody = opt && opt.appendToBody;
- this.el = el;
+ this._styleCoord = [0, 0];
- this._x = api.getWidth() / 2;
- this._y = api.getHeight() / 2;
+ makeStyleCoord(this._styleCoord, zr, appendToBody, api.getWidth() / 2, api.getHeight() / 2);
- container.appendChild(el);
+ if (appendToBody) {
+ document.body.appendChild(el);
+ }
+ else {
+ container.appendChild(el);
+ }
this._container = container;
@@ -82167,7 +82816,8 @@ function TooltipContent(container, api) {
// Try trigger zrender event to avoid mouse
// in and out shape too frequently
var handler = zr.handler;
- normalizeEvent(container, e, true);
+ var zrViewportRoot = zr.painter.getViewportRoot();
+ normalizeEvent(zrViewportRoot, e, true);
handler.dispatch('mousemove', e);
}
};
@@ -82212,12 +82862,13 @@ TooltipContent.prototype = {
show: function (tooltipModel) {
clearTimeout(this._hideTimeout);
var el = this.el;
+ var styleCoord = this._styleCoord;
el.style.cssText = gCssText + assembleCssText(tooltipModel)
// Because of the reason described in:
// http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
// we should set initial value to `left` and `top`.
- + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+ + ';left:' + styleCoord[0] + 'px;top:' + styleCoord[1] + 'px;'
+ (tooltipModel.get('extraCssText') || '');
el.style.display = el.innerHTML ? 'block' : 'none';
@@ -82245,23 +82896,13 @@ TooltipContent.prototype = {
return [el.clientWidth, el.clientHeight];
},
- moveTo: function (x, y) {
- // xy should be based on canvas root. But tooltipContent is
- // the sibling of canvas root. So padding of ec container
- // should be considered here.
- var zr = this._zr;
- var viewportRootOffset;
- if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
- x += viewportRootOffset.offsetLeft;
- y += viewportRootOffset.offsetTop;
- }
+ moveTo: function (zrX, zrY) {
+ var styleCoord = this._styleCoord;
+ makeStyleCoord(styleCoord, this._zr, this._appendToBody, zrX, zrY);
var style = this.el.style;
- style.left = x + 'px';
- style.top = y + 'px';
-
- this._x = x;
- this._y = y;
+ style.left = styleCoord[0] + 'px';
+ style.top = styleCoord[1] + 'px';
},
hide: function () {
@@ -82287,6 +82928,10 @@ TooltipContent.prototype = {
return this._show;
},
+ dispose: function () {
+ this.el.parentNode.removeChild(this.el);
+ },
+
getOuterSize: function () {
var width = this.el.clientWidth;
var height = this.el.clientHeight;
@@ -82303,6 +82948,7 @@ TooltipContent.prototype = {
return {width: width, height: height};
}
+
};
/*
@@ -82534,7 +83180,9 @@ extendComponentView({
var tooltipContent;
if (this._renderMode === 'html') {
- tooltipContent = new TooltipContent(api.getDom(), api);
+ tooltipContent = new TooltipContent(api.getDom(), api, {
+ appendToBody: tooltipModel.get('appendToBody', true)
+ });
this._newLine = '<br/>';
}
else {
@@ -82687,7 +83335,6 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- event: {},
dataByCoordSys: payload.dataByCoordSys,
tooltipOption: payload.tooltipOption
}, dispatchAction);
@@ -82706,8 +83353,7 @@ extendComponentView({
offsetX: cx,
offsetY: cy,
position: payload.position,
- target: pointInfo.el,
- event: {}
+ target: pointInfo.el
}, dispatchAction);
}
}
@@ -82724,8 +83370,7 @@ extendComponentView({
offsetX: payload.x,
offsetY: payload.y,
position: payload.position,
- target: api.getZr().findHover(payload.x, payload.y).target,
- event: {}
+ target: api.getZr().findHover(payload.x, payload.y).target
}, dispatchAction);
}
},
@@ -82831,7 +83476,9 @@ extendComponentView({
_showAxisTooltip: function (dataByCoordSys, e) {
var ecModel = this._ecModel;
var globalTooltipModel = this._tooltipModel;
+
var point = [e.offsetX, e.offsetY];
+
var singleDefaultHTML = [];
var singleParamsList = [];
var singleTooltipModel = buildTooltipModel([
@@ -83087,6 +83734,7 @@ extendComponentView({
_updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
var viewWidth = this._api.getWidth();
var viewHeight = this._api.getHeight();
+
positionExpr = positionExpr || tooltipModel.get('position');
var contentSize = content.getSize();
@@ -83205,7 +83853,7 @@ extendComponentView({
if (env$1.node) {
return;
}
- this._tooltipContent.hide();
+ this._tooltipContent.dispose();
unregister('itemTooltip', api);
}
});
@@ -83790,16 +84438,19 @@ var PRIORITY_BRUSH = PRIORITY.VISUAL.BRUSH;
*/
registerLayout(PRIORITY_BRUSH, function (ecModel, api, payload) {
ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
-
payload && payload.type === 'takeGlobalCursor' && brushModel.setBrushOption(
payload.key === 'brush' ? payload.brushOption : {brushType: false}
);
+ });
+ layoutCovers(ecModel);
+});
+function layoutCovers(ecModel) {
+ ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
var brushTargetManager = brushModel.brushTargetManager = new BrushTargetManager(brushModel.option, ecModel);
-
brushTargetManager.setInputRanges(brushModel.areas, ecModel);
});
-});
+}
/**
* Register the visual encoding if this modules required.
@@ -84314,7 +84965,13 @@ extendComponentView({
/**
* @override
*/
- updateTransform: updateController,
+ updateTransform: function (brushModel, ecModel) {
+ // PENDING: `updateTransform` is a little tricky, whose layout need
+ // to be calculate mandatorily and other stages will not be performed.
+ // Take care the correctness of the logic. See #11754 .
+ layoutCovers(ecModel);
+ return updateController.apply(this, arguments);
+ },
/**
* @override
@@ -86406,8 +87063,8 @@ function markerTypeCalculatorWithExtent(
var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
- coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
-
+ coordArr[targetCoordIndex] = data.get(calcDataDim, dataIndex);
+ var coordArrValue = data.get(targetDataDim, dataIndex);
// Make it simple, do not visit all stacked value to count precision.
var precision = getPrecision(data.get(targetDataDim, dataIndex));
precision = Math.min(precision, 20);
@@ -86415,7 +87072,7 @@ function markerTypeCalculatorWithExtent(
coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
}
- return coordArr;
+ return [coordArr, coordArrValue];
}
var curry$5 = curry;
@@ -86478,12 +87135,15 @@ function dataTransform(seriesModel, item) {
var otherCoordIndex = indexOf$2(dims, axisInfo.baseAxis.dim);
var targetCoordIndex = indexOf$2(dims, axisInfo.valueAxis.dim);
- item.coord = markerTypeCalculator[item.type](
+ var coordInfo = markerTypeCalculator[item.type](
data, axisInfo.baseDataDim, axisInfo.valueDataDim,
otherCoordIndex, targetCoordIndex
);
+ item.coord = coordInfo[0];
// Force to use the value of calculated value.
- item.value = item.coord[targetCoordIndex];
+ // let item use the value without stack.
+ item.value = coordInfo[1];
+
}
else {
// FIXME Only has one of xAxis and yAxis.
@@ -86875,7 +87535,8 @@ MarkerModel.extend({
},
label: {
show: true,
- position: 'end'
+ position: 'end',
+ distance: 5
},
lineStyle: {
type: 'dashed'
@@ -89325,26 +89986,28 @@ var ScrollableLegendView = LegendView.extend({
},
_findTargetItemIndex: function (targetDataIndex) {
+ if (!this._showController) {
+ return 0;
+ }
+
var index;
var contentGroup = this.getContentGroup();
var defaultIndex;
- if (this._showController) {
- contentGroup.eachChild(function (child, idx) {
- var legendDataIdx = child.__legendDataIndex;
- // FIXME
- // If the given targetDataIndex (from model) is illegal,
- // we use defualtIndex. But the index on the legend model and
- // action payload is still illegal. That case will not be
- // changed until some scenario requires.
- if (defaultIndex == null && legendDataIdx != null) {
- defaultIndex = idx;
- }
- if (legendDataIdx === targetDataIndex) {
- index = idx;
- }
- });
- }
+ contentGroup.eachChild(function (child, idx) {
+ var legendDataIdx = child.__legendDataIndex;
+ // FIXME
+ // If the given targetDataIndex (from model) is illegal,
+ // we use defualtIndex. But the index on the legend model and
+ // action payload is still illegal. That case will not be
+ // changed until some scenario requires.
+ if (defaultIndex == null && legendDataIdx != null) {
+ defaultIndex = idx;
+ }
+ if (legendDataIdx === targetDataIndex) {
+ index = idx;
+ }
+ });
return index != null ? index : defaultIndex;
}
diff --git a/dist/echarts.js.map b/dist/echarts.js.map
index 64fe29f..d989128 100644
--- a/dist/echarts.js.map
+++ b/dist/echarts.js.map
@@ -1 +1 @@
-{"version":3,"file":"echarts.js","sources":["../src/config.js","../../zrender/src/core/guid.js","../../zrender/src/core/env.js","../../zrender/src/core/util.js","../../zrender/src/core/vector.js","../../zrender/src/mixin/Draggable.js","../../zrender/src/mixin/Eventful.js","../../zrender/src/core/fourPointsTransform.js","../../zrender/src/core/event.js","../../zrender/src/core/GestureMgr.js","../../zrender/src/Handler.js","../../zrender/src/core/matrix.js","../../zrender/src/mixin/Transfo [...]
\ No newline at end of file
+{"version":3,"file":"echarts.js","sources":["../src/config.js","../../zrender/src/core/guid.js","../../zrender/src/core/env.js","../../zrender/src/core/util.js","../../zrender/src/core/vector.js","../../zrender/src/mixin/Draggable.js","../../zrender/src/mixin/Eventful.js","../../zrender/src/core/fourPointsTransform.js","../../zrender/src/core/dom.js","../../zrender/src/core/event.js","../../zrender/src/core/GestureMgr.js","../../zrender/src/Handler.js","../../zrender/src/core/matrix.js", [...]
\ No newline at end of file
diff --git a/dist/echarts.min.js b/dist/echarts.min.js
index 68264a5..35d375c 100644
--- a/dist/echarts.min.js
+++ b/dist/echarts.min.js
@@ -19,4 +19,4 @@
*/
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(t.echarts={})}(this,function(t){"use strict";var e=2311,n=function(){return e++},v="object"==typeof wx&&"function"==typeof wx.getSystemInfoSync?{browser:{},os:{},node:!1,wxa:!0,canvasSupported:!0,svgSupported:!1,touchEventsSupported:!0,domSupported:!1}:"undefined"==typeof document&&"undefined"!=typeof self?{browser:{},os:{},node:!1,worker:!0,canvasS [...]
diff --git a/dist/echarts.simple.js b/dist/echarts.simple.js
index e094b11..23cb6d2 100644
--- a/dist/echarts.simple.js
+++ b/dist/echarts.simple.js
@@ -1172,7 +1172,11 @@ Draggable.prototype = {
_dragStart: function (e) {
var draggingTarget = e.target;
- if (draggingTarget && draggingTarget.draggable) {
+ // Find if there is draggable in the ancestor
+ while (draggingTarget && !draggingTarget.draggable) {
+ draggingTarget = draggingTarget.parent;
+ }
+ if (draggingTarget) {
this._draggingTarget = draggingTarget;
draggingTarget.dragging = true;
this._x = e.offsetX;
@@ -1601,6 +1605,8 @@ function buildTransformer(src, dest) {
var detCache = {};
var det = determinant(mA, 8, 0, 0, 0, detCache);
if (det === 0) {
+ // can not make transformer when and only when
+ // any three of the markers are collinear.
return;
}
@@ -1623,6 +1629,148 @@ function buildTransformer(src, dest) {
};
}
+var EVENT_SAVED_PROP = '___zrEVENTSAVED';
+/**
+ * Transform "local coord" from `elFrom` to `elTarget`.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support when CSS transform is used.
+ *
+ * Having the `out` (that is, `[outX, outY]`), we can create an DOM element
+ * and set the CSS style as "left: outX; top: outY;" and append it to `elTarge`
+ * to locate the element.
+ *
+ * For example, this code below positions a child of `document.body` on the event
+ * point, no matter whether `body` has `margin`/`paddin`/`transfrom`/... :
+ * ```js
+ * transformLocalCoord(out, container, document.body, event.offsetX, event.offsetY);
+ * if (!eqNaN(out[0])) {
+ * // Then locate the tip element on the event point.
+ * var tipEl = document.createElement('div');
+ * tipEl.style.cssText = 'position: absolute; left:' + out[0] + ';top:' + out[1] + ';';
+ * document.body.appendChild(tipEl);
+ * }
+ * ```
+ *
+ * Notice: In some env this method is not supported. If called, `out` will be `[NaN, NaN]`.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output..
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} elFrom The `[inX, inY]` is based on elFrom.
+ * @param {HTMLElement} elTarget The `out` is based on elTarget.
+ * @param {number} inX
+ * @param {number} inY
+ * @return {boolean} Whether transform successfully.
+ */
+
+
+/**
+ * Transform between a "viewport coord" and a "local coord".
+ * "viewport coord": the coord based on the left-top corner of the viewport
+ * of the browser.
+ * "local coord": the coord based on the input `el`. The origin point is at
+ * the position of "left: 0; top: 0;" in the `el`.
+ *
+ * Support the case when CSS transform is used on el.
+ *
+ * @param {Array.<number>} out [inX: number, inY: number] The output. If `inverse: false`,
+ * it represents "local coord", otherwise "vireport coord".
+ * If can not transform, `out` will not be modified but return `false`.
+ * @param {HTMLElement} el The "local coord" is based on the `el`, see comment above.
+ * @param {number} inX If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {number} inY If `inverse: false`,
+ * it represents "vireport coord", otherwise "local coord".
+ * @param {boolean} [inverse=false]
+ * `true`: from "viewport coord" to "local coord".
+ * `false`: from "local coord" to "viewport coord".
+ * @return {boolean} Whether transform successfully.
+ */
+function transformCoordWithViewport(out, el, inX, inY, inverse) {
+ if (el.getBoundingClientRect && env$1.domSupported && !isCanvasEl(el)) {
+ var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
+ var markers = prepareCoordMarkers(el, saved);
+ var transformer = preparePointerTransformer(markers, saved, inverse);
+ if (transformer) {
+ transformer(out, inX, inY);
+ return true;
+ }
+ }
+ return false;
+}
+
+function prepareCoordMarkers(el, saved) {
+ var markers = saved.markers;
+ if (markers) {
+ return markers;
+ }
+
+ markers = saved.markers = [];
+ var propLR = ['left', 'right'];
+ var propTB = ['top', 'bottom'];
+
+ for (var i = 0; i < 4; i++) {
+ var marker = document.createElement('div');
+ var stl = marker.style;
+ var idxLR = i % 2;
+ var idxTB = (i >> 1) % 2;
+ stl.cssText = [
+ 'position: absolute',
+ 'visibility: hidden',
+ 'padding: 0',
+ 'margin: 0',
+ 'border-width: 0',
+ 'user-select: none',
+ 'width:0',
+ 'height:0',
+ // 'width: 5px',
+ // 'height: 5px',
+ propLR[idxLR] + ':0',
+ propTB[idxTB] + ':0',
+ propLR[1 - idxLR] + ':auto',
+ propTB[1 - idxTB] + ':auto',
+ ''
+ ].join('!important;');
+ el.appendChild(marker);
+ markers.push(marker);
+ }
+
+ return markers;
+}
+
+function preparePointerTransformer(markers, saved, inverse) {
+ var transformerName = inverse ? 'invTrans' : 'trans';
+ var transformer = saved[transformerName];
+ var oldSrcCoords = saved.srcCoords;
+ var oldCoordTheSame = true;
+ var srcCoords = [];
+ var destCoords = [];
+
+ for (var i = 0; i < 4; i++) {
+ var rect = markers[i].getBoundingClientRect();
+ var ii = 2 * i;
+ var x = rect.left;
+ var y = rect.top;
+ srcCoords.push(x, y);
+ oldCoordTheSame = oldCoordTheSame && oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
+ destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
+ }
+ // Cache to avoid time consuming of `buildTransformer`.
+ return (oldCoordTheSame && transformer)
+ ? transformer
+ : (
+ saved.srcCoords = srcCoords,
+ saved[transformerName] = inverse
+ ? buildTransformer(destCoords, srcCoords)
+ : buildTransformer(srcCoords, destCoords)
+ );
+}
+
+function isCanvasEl(el) {
+ return el.nodeName.toUpperCase() === 'CANVAS';
+}
+
/**
* Utilities for mouse or touch events.
*/
@@ -1630,7 +1778,6 @@ function buildTransformer(src, dest) {
var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
-var EVENT_SAVED_PROP = '___zrEVENTSAVED';
var _calcOut = [];
/**
@@ -1695,11 +1842,11 @@ function clientToLocal(el, e, out, calculate) {
function calculateZrXY(el, e, out) {
// BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect.
- if (el.getBoundingClientRect && env$1.domSupported) {
+ if (env$1.domSupported && el.getBoundingClientRect) {
var ex = e.clientX;
var ey = e.clientY;
- if (el.nodeName.toUpperCase() === 'CANVAS') {
+ if (isCanvasEl(el)) {
// Original approach, which do not support CSS transform.
// marker can not be locationed in a canvas container
// (getBoundingClientRect is always 0). We do not support
@@ -1711,10 +1858,7 @@ function calculateZrXY(el, e, out) {
return;
}
else {
- var saved = el[EVENT_SAVED_PROP] || (el[EVENT_SAVED_PROP] = {});
- var transformer = preparePointerTransformer(prepareCoordMarkers(el, saved), saved);
- if (transformer) {
- transformer(_calcOut, ex, ey);
+ if (transformCoordWithViewport(_calcOut, el, ex, ey)) {
out.zrX = _calcOut[0];
out.zrY = _calcOut[1];
return;
@@ -1724,70 +1868,6 @@ function calculateZrXY(el, e, out) {
out.zrX = out.zrY = 0;
}
-function prepareCoordMarkers(el, saved) {
- var markers = saved.markers;
- if (markers) {
- return markers;
- }
-
- markers = saved.markers = [];
- var propLR = ['left', 'right'];
- var propTB = ['top', 'bottom'];
-
- for (var i = 0; i < 4; i++) {
- var marker = document.createElement('div');
- var stl = marker.style;
- var idxLR = i % 2;
- var idxTB = (i >> 1) % 2;
- stl.cssText = [
- 'position:absolute',
- 'visibility: hidden',
- 'padding: 0',
- 'margin: 0',
- 'border-width: 0',
- 'width:0',
- 'height:0',
- // 'width: 5px',
- // 'height: 5px',
- propLR[idxLR] + ':0',
- propTB[idxTB] + ':0',
- propLR[1 - idxLR] + ':auto',
- propTB[1 - idxTB] + ':auto',
- ''
- ].join('!important;');
- el.appendChild(marker);
- markers.push(marker);
- }
-
- return markers;
-}
-
-function preparePointerTransformer(markers, saved) {
- var transformer = saved.transformer;
- var oldSrcCoords = saved.srcCoords;
- var useOld = true;
- var srcCoords = [];
- var destCoords = [];
-
- for (var i = 0; i < 4; i++) {
- var rect = markers[i].getBoundingClientRect();
- var ii = 2 * i;
- var x = rect.left;
- var y = rect.top;
- srcCoords.push(x, y);
- useOld &= oldSrcCoords && x === oldSrcCoords[ii] && y === oldSrcCoords[ii + 1];
- destCoords.push(markers[i].offsetLeft, markers[i].offsetTop);
- }
-
- // Cache to avoid time consuming of `buildTransformer`.
- return useOld
- ? transformer
- : (
- saved.srcCoords = srcCoords,
- saved.transformer = buildTransformer(srcCoords, destCoords)
- );
-}
-
/**
* Find native event compat for legency IE.
* Should be called at the begining of a native event listener.
@@ -4473,7 +4553,7 @@ var Animator = function (target, loop, getter, setter) {
Animator.prototype = {
/**
- * 设置动画关键帧
+ * Set Animation keyframe
* @param {number} time 关键帧时间，单位是ms
* @param {Object} props 关键帧的属性值，key-value表示
* @return {module:zrender/animation/Animator}
@@ -4552,7 +4632,7 @@ Animator.prototype = {
}
},
/**
- * 开始执行动画
+ * Start the animation
* @param {string|Function} [easing]
* 动画缓动函数，详见{@link module:zrender/animation/easing}
* @param {boolean} forceAnimate
@@ -4613,7 +4693,7 @@ Animator.prototype = {
return this;
},
/**
- * 停止动画
+ * Stop animation
* @param {boolean} forwardToLast If move to last frame before stop
*/
stop: function (forwardToLast) {
@@ -4630,7 +4710,7 @@ Animator.prototype = {
clipList.length = 0;
},
/**
- * 设置动画延迟开始的时间
+ * Set when animation delay starts
* @param {number} time 单位ms
* @return {module:zrender/animation/Animator}
*/
@@ -4639,7 +4719,7 @@ Animator.prototype = {
return this;
},
/**
- * 添加动画结束的回调
+ * Add callback for animation end
* @param {Function} cb
* @return {module:zrender/animation/Animator}
*/
@@ -4691,7 +4771,7 @@ if (debugMode === 1) {
var logError$1 = logError;
/**
- * @alias modue:zrender/mixin/Animatable
+ * @alias module:zrender/mixin/Animatable
* @constructor
*/
var Animatable = function () {
@@ -10367,7 +10447,7 @@ Painter.prototype = {
};
/**
- * 动画主类, 调度和管理所有动画控制器
+ * Animation main class, dispatch and manage all animation controllers
*
* @module zrender/animation/Animation
* @author pissang(https://github.com/pissang)
@@ -10432,14 +10512,14 @@ Animation.prototype = {
constructor: Animation,
/**
- * 添加 clip
+ * Add clip
* @param {module:zrender/animation/Clip} clip
*/
addClip: function (clip) {
this._clips.push(clip);
},
/**
- * 添加 animator
+ * Add animator
* @param {module:zrender/animation/Animator} animator
*/
addAnimator: function (animator) {
@@ -10450,7 +10530,7 @@ Animation.prototype = {
}
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Clip} clip
*/
removeClip: function (clip) {
@@ -10461,7 +10541,7 @@ Animation.prototype = {
},
/**
- * 删除动画片段
+ * Delete animation clip
* @param {module:zrender/animation/Animator} animator
*/
removeAnimator: function (animator) {
@@ -10728,13 +10808,16 @@ function normalizeGlobalEvent(instance, event) {
* Detect whether the given el is in `painterRoot`.
*/
function isLocalEl(instance, el) {
+ var elTmp = el;
var isLocal = false;
- do {
- el = el && el.parentNode;
+ while (elTmp && elTmp.nodeType !== 9
+ && !(
+ isLocal = elTmp.domBelongToZr
+ || (elTmp !== el && elTmp === instance.painterRoot)
+ )
+ ) {
+ elTmp = elTmp.parentNode;
}
- while (el && el.nodeType !== 9 && !(
- isLocal = el === instance.painterRoot
- ));
return isLocal;
}
@@ -11187,7 +11270,7 @@ var painterCtors = {
/**
* @type {string}
*/
-var version$1 = '4.2.0';
+var version$1 = '4.3.0';
/**
* Initializing a zrender instance
@@ -16020,12 +16103,10 @@ var round = Math.round;
* @param {number} [inputShape.x2]
* @param {number} [inputShape.y2]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeLine$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
}
@@ -16034,20 +16115,22 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
var y1 = inputShape.y1;
var y2 = inputShape.y2;
+ outputShape.x1 = x1;
+ outputShape.x2 = x2;
+ outputShape.y1 = y1;
+ outputShape.y2 = y2;
+
+ var lineWidth = style && style.lineWidth;
+ if (!lineWidth) {
+ return;
+ }
+
if (round(x1 * 2) === round(x2 * 2)) {
outputShape.x1 = outputShape.x2 = subPixelOptimize$1(x1, lineWidth, true);
}
- else {
- outputShape.x1 = x1;
- outputShape.x2 = x2;
- }
if (round(y1 * 2) === round(y2 * 2)) {
outputShape.y1 = outputShape.y2 = subPixelOptimize$1(y1, lineWidth, true);
}
- else {
- outputShape.y1 = y1;
- outputShape.y2 = y2;
- }
}
/**
@@ -16063,12 +16146,10 @@ function subPixelOptimizeLine$1(outputShape, inputShape, style) {
* @param {number} [inputShape.width]
* @param {number} [inputShape.height]
* @param {Object} [style]
- * @param {number} [style.lineWidth]
+ * @param {number} [style.lineWidth] If `null`/`undefined`/`0`, do not optimize.
*/
function subPixelOptimizeRect$1(outputShape, inputShape, style) {
- var lineWidth = style && style.lineWidth;
-
- if (!inputShape || !lineWidth) {
+ if (!inputShape) {
return;
... 768 lines suppressed ...
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org