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 2019/01/12 17:28:40 UTC
[incubator-echarts] 02/03: Fix that emphasis listener added
repeatly.
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch release
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
commit 066d7c4128dd6f1de80512bf084b9d37ea1e3d07
Author: sushuang <su...@gmail.com>
AuthorDate: Sun Jan 13 01:07:21 2019 +0800
Fix that emphasis listener added repeatly.
---
src/chart/map/MapView.js | 100 +++++++++++++++++++++++++++++++++--------------
test/map.html | 11 +++++-
2 files changed, 79 insertions(+), 32 deletions(-)
diff --git a/src/chart/map/MapView.js b/src/chart/map/MapView.js
index 5260f8a..b128f6a 100644
--- a/src/chart/map/MapView.js
+++ b/src/chart/map/MapView.js
@@ -22,6 +22,9 @@ import * as zrUtil from 'zrender/src/core/util';
import * as graphic from '../../util/graphic';
import MapDraw from '../../component/helper/MapDraw';
+var HIGH_DOWN_PROP = '__seriesMapHighDown';
+var RECORD_VERSION_PROP = '__seriesMapCallKey';
+
export default echarts.extendChartView({
type: 'map',
@@ -139,7 +142,7 @@ export default echarts.extendChartView({
var labelModel = itemModel.getModel('label');
var hoverLabelModel = itemModel.getModel('emphasis.label');
- var polygonGroups = fullData.getItemGraphicEl(fullIndex);
+ var regionGroup = fullData.getItemGraphicEl(fullIndex);
// `getFormattedLabel` needs to use `getData` inside. Here
// `mapModel.getData()` is shallow cloned from `mainSeries.getData()`.
@@ -157,37 +160,74 @@ export default echarts.extendChartView({
normalText
);
- var onEmphasis = function () {
- var hoverStyle = graphic.setTextStyle({}, hoverLabelModel, {
- text: hoverLabelModel.get('show') ? emphasisText : null
- }, {isRectText: true, useInsideStyle: false}, true);
- circle.style.extendFrom(hoverStyle);
- // Make label upper than others if overlaps.
- circle.__mapOriginalZ2 = circle.z2;
- circle.z2 += graphic.Z2_EMPHASIS_LIFT;
- };
-
- var onNormal = function () {
- graphic.setTextStyle(circle.style, labelModel, {
- text: labelModel.get('show') ? normalText : null,
- textPosition: labelModel.getShallow('position') || 'bottom'
- }, {isRectText: true, useInsideStyle: false});
-
- if (circle.__mapOriginalZ2 != null) {
- circle.z2 = circle.__mapOriginalZ2;
- circle.__mapOriginalZ2 = null;
- }
- };
-
- polygonGroups.on('mouseover', onEmphasis)
- .on('mouseout', onNormal)
- .on('emphasis', onEmphasis)
- .on('normal', onNormal);
-
- onNormal();
+ var highDownRecord = regionGroup[HIGH_DOWN_PROP];
+ var recordVersion = Math.random();
+
+ // Prevent from register listeners duplicatedly when roaming.
+ if (!highDownRecord) {
+ highDownRecord = regionGroup[HIGH_DOWN_PROP] = {};
+ var onEmphasis = zrUtil.curry(onRegionHighDown, true);
+ var onNormal = zrUtil.curry(onRegionHighDown, false);
+ regionGroup.on('mouseover', onEmphasis)
+ .on('mouseout', onNormal)
+ .on('emphasis', onEmphasis)
+ .on('normal', onNormal);
+ }
+
+ // Prevent removed regions effect current grapics.
+ regionGroup[RECORD_VERSION_PROP] = recordVersion;
+ zrUtil.extend(highDownRecord, {
+ recordVersion: recordVersion,
+ circle: circle,
+ labelModel: labelModel,
+ hoverLabelModel: hoverLabelModel,
+ emphasisText: emphasisText,
+ normalText: normalText
+ });
+
+ // FIXME
+ // Consider set option when emphasis.
+ enterRegionHighDown(highDownRecord, false);
}
group.add(circle);
});
}
-});
\ No newline at end of file
+});
+
+function onRegionHighDown(toHighOrDown) {
+ var highDownRecord = this[HIGH_DOWN_PROP];
+ if (highDownRecord && highDownRecord.recordVersion === this[RECORD_VERSION_PROP]) {
+ enterRegionHighDown(highDownRecord, toHighOrDown);
+ }
+}
+
+function enterRegionHighDown(highDownRecord, toHighOrDown) {
+ var circle = highDownRecord.circle;
+ var labelModel = highDownRecord.labelModel;
+ var hoverLabelModel = highDownRecord.hoverLabelModel;
+ var emphasisText = highDownRecord.emphasisText;
+ var normalText = highDownRecord.normalText;
+
+ if (toHighOrDown) {
+ circle.style.extendFrom(
+ graphic.setTextStyle({}, hoverLabelModel, {
+ text: hoverLabelModel.get('show') ? emphasisText : null
+ }, {isRectText: true, useInsideStyle: false}, true)
+ );
+ // Make label upper than others if overlaps.
+ circle.__mapOriginalZ2 = circle.z2;
+ circle.z2 += graphic.Z2_EMPHASIS_LIFT;
+ }
+ else {
+ graphic.setTextStyle(circle.style, labelModel, {
+ text: labelModel.get('show') ? normalText : null,
+ textPosition: labelModel.getShallow('position') || 'bottom'
+ }, {isRectText: true, useInsideStyle: false});
+
+ if (circle.__mapOriginalZ2 != null) {
+ circle.z2 = circle.__mapOriginalZ2;
+ circle.__mapOriginalZ2 = null;
+ }
+ }
+}
diff --git a/test/map.html b/test/map.html
index ab1d216..52ce549 100644
--- a/test/map.html
+++ b/test/map.html
@@ -310,7 +310,10 @@ under the License.
}
},
emphasis: {
- label: {show: true}
+ label: {
+ show: true,
+ backgroundColor: '#fcf'
+ },
},
data:[
{name: '北京',value: 234},
@@ -341,7 +344,10 @@ under the License.
}
},
emphasis: {
- label: {show: true}
+ label: {
+ show: true,
+ backgroundColor: '#ccc'
+ }
},
data:[
{name: '北京',value: 567},
@@ -357,6 +363,7 @@ under the License.
title: [
'1. 北京、天津、河北 rich text 正常倾斜（河北竖直）（其他 region 都没数据，显示 NaN）',
'2. selectedMode: "multiple"',
+ '3. hover 时标签底色变红',
'所有 label 样式一致（例外：没数据的 label 并不 rotate，因为这还没支持）'
]
});
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org