From 13177430235f99ca566741b35f06614f4332eec2 Mon Sep 17 00:00:00 2001 From: plainheart Date: Mon, 11 Jul 2022 16:32:44 +0800 Subject: [PATCH 1/3] fix(visualMap): fix the indicator doesn't show when hovering on map label. --- src/component/visualMap/ContinuousView.ts | 20 ++++++++++++++------ test/runTest/actions/__meta__.json | 2 +- test/runTest/actions/geo-map.json | 2 +- 3 files changed, 16 insertions(+), 8 deletions(-) diff --git a/src/component/visualMap/ContinuousView.ts b/src/component/visualMap/ContinuousView.ts index ac31cd0943..68ad343171 100644 --- a/src/component/visualMap/ContinuousView.ts +++ b/src/component/visualMap/ContinuousView.ts @@ -32,13 +32,14 @@ import GlobalModel from '../../model/Global'; import ExtensionAPI from '../../core/ExtensionAPI'; import Element, { ElementEvent } from 'zrender/src/Element'; import { TextVerticalAlign, TextAlign } from 'zrender/src/core/types'; -import { ColorString, Payload } from '../../util/types'; +import { ColorString, ECEventData, Payload } from '../../util/types'; import { parsePercent } from 'zrender/src/contain/text'; import { setAsHighDownDispatcher } from '../../util/states'; import { createSymbol } from '../../util/symbol'; import ZRImage from 'zrender/src/graphic/Image'; import { getECData } from '../../util/innerStore'; import { createTextStyle } from '../../label/labelStyle'; +import { findEventDispatcher } from '../../util/event'; const linearMap = numberUtil.linearMap; const each = zrUtil.each; @@ -816,16 +817,23 @@ class ContinuousView extends VisualMapView { } private _hoverLinkFromSeriesMouseOver(e: ElementEvent) { - const el = e.target; - const visualMapModel = this.visualMapModel; + let ecData: ECEventData; + + findEventDispatcher(e.target, target => { + const currECData = getECData(target); + if (currECData.dataIndex != null) { + ecData = currECData; + return true; + } + }, true); - if (!el || getECData(el).dataIndex == null) { + if (!ecData) { return; } - const ecData = getECData(el); const dataModel = this.ecModel.getSeriesByIndex(ecData.seriesIndex); + const visualMapModel = this.visualMapModel; if (!visualMapModel.isTargetSeries(dataModel)) { return; } @@ -947,4 +955,4 @@ function getCursor(orient: Orient) { return orient === 'vertical' ? 'ns-resize' : 'ew-resize'; } -export default ContinuousView; \ No newline at end of file +export default ContinuousView; diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json index baadde9800..ae9e2a6992 100644 --- a/test/runTest/actions/__meta__.json +++ b/test/runTest/actions/__meta__.json @@ -88,7 +88,7 @@ "emphasis-inherit": 1, "funnel": 2, "gauge-simple": 2, - "geo-map": 3, + "geo-map": 4, "geo-map-features": 3, "geo-svg": 8, "geo-svg-demo": 6, diff --git a/test/runTest/actions/geo-map.json b/test/runTest/actions/geo-map.json index ffbe5bcc13..b9f1566534 100644 --- a/test/runTest/actions/geo-map.json +++ b/test/runTest/actions/geo-map.json @@ -1 +1 @@ -[{"name":"Action 1","ops":[{"type":"mousedown","time":750,"x":67,"y":8},{"type":"mouseup","time":835,"x":67,"y":8},{"time":836,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1086,"x":67,"y":8},{"type":"mousemove","time":1291,"x":65,"y":29},{"type":"mousemove","time":1491,"x":65,"y":30},{"type":"mousedown","time":1667,"x":65,"y":30},{"type":"mouseup","time":1785,"x":65,"y":30},{"time":1786,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":2142,"x":65,"y":31},{"type":"mousemove","time":2342,"x":61,"y":61},{"type":"mousemove","time":2568,"x":61,"y":61},{"type":"mousedown","time":2652,"x":61,"y":61},{"type":"mouseup","time":2725,"x":61,"y":61},{"time":2726,"delay":400,"type":"screenshot-auto"},{"type":"mousedown","time":3702,"x":61,"y":61},{"type":"mouseup","time":3775,"x":61,"y":61},{"time":3776,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3955,"x":61,"y":61},{"type":"mousemove","time":4155,"x":68,"y":46},{"type":"mousemove","time":4362,"x":71,"y":37},{"type":"mousedown","time":4510,"x":71,"y":37},{"type":"mouseup","time":4605,"x":71,"y":37},{"time":4606,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":5004,"x":71,"y":36},{"type":"mousemove","time":5226,"x":72,"y":16},{"type":"mousedown","time":5406,"x":72,"y":15},{"type":"mousemove","time":5426,"x":72,"y":15},{"type":"mouseup","time":5493,"x":72,"y":15},{"time":5494,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":6071,"x":72,"y":16},{"type":"mousemove","time":6272,"x":69,"y":35},{"type":"mousemove","time":6486,"x":69,"y":35},{"type":"mousedown","time":6614,"x":69,"y":35},{"type":"mouseup","time":6697,"x":69,"y":35},{"time":6698,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":7099,"x":69,"y":36},{"type":"mousemove","time":7299,"x":66,"y":56},{"type":"mousemove","time":7499,"x":62,"y":65},{"type":"mousedown","time":7766,"x":62,"y":65},{"type":"mouseup","time":7841,"x":62,"y":65},{"time":7842,"delay":400,"type":"screenshot-auto"}],"scrollY":0,"scrollX":0,"timestamp":1568040771612},{"name":"Action 2","ops":[{"type":"mousedown","time":465,"x":18,"y":430},{"type":"mousemove","time":578,"x":18,"y":432},{"type":"mousemove","time":914,"x":24,"y":475},{"type":"mouseup","time":1111,"x":23,"y":477},{"time":1112,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1140,"x":23,"y":477},{"type":"mousemove","time":1357,"x":19,"y":571},{"type":"mousemove","time":1603,"x":21,"y":579},{"type":"mousemove","time":1807,"x":21,"y":576},{"type":"mousemove","time":2020,"x":21,"y":574},{"type":"mousedown","time":2170,"x":21,"y":573},{"type":"mousemove","time":2228,"x":21,"y":573},{"type":"mousemove","time":2277,"x":21,"y":573},{"type":"mousemove","time":2493,"x":23,"y":549},{"type":"mousemove","time":2715,"x":23,"y":543},{"type":"mousemove","time":2929,"x":23,"y":543},{"type":"mouseup","time":3233,"x":23,"y":543},{"time":3234,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3327,"x":23,"y":542},{"type":"mousemove","time":3549,"x":18,"y":516},{"type":"mousemove","time":3768,"x":14,"y":510},{"type":"mousedown","time":4021,"x":14,"y":510},{"type":"mouseup","time":4111,"x":14,"y":510},{"time":4112,"delay":400,"type":"screenshot-auto"}],"scrollY":0,"scrollX":0,"timestamp":1603890244262},{"name":"Action 3","ops":[{"type":"mousemove","time":550,"x":429,"y":336},{"type":"mousedown","time":674,"x":431,"y":335},{"type":"mousemove","time":793,"x":431,"y":336},{"type":"mousemove","time":1006,"x":346,"y":462},{"type":"mousemove","time":1207,"x":350,"y":458},{"type":"mouseup","time":1343,"x":350,"y":458},{"time":1344,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1410,"x":350,"y":458},{"type":"mousemove","time":1603,"x":350,"y":457},{"type":"mousewheel","time":1686,"x":350,"y":457,"deltaY":4.000244140625},{"type":"mousewheel","time":1719,"x":350,"y":457,"deltaY":40.41015625},{"type":"mousewheel","time":1748,"x":350,"y":457,"deltaY":377.4566650390625},{"type":"mousewheel","time":1775,"x":350,"y":457,"deltaY":252.0208740234375},{"type":"mousewheel","time":1801,"x":350,"y":457,"deltaY":274.16015625},{"type":"mousewheel","time":1901,"x":350,"y":457,"deltaY":263.7664794921875},{"type":"mousemove","time":2236,"x":347,"y":454},{"type":"mousemove","time":2441,"x":308,"y":411},{"type":"mousedown","time":2514,"x":308,"y":411},{"type":"mousemove","time":2644,"x":443,"y":385},{"type":"mousemove","time":2855,"x":648,"y":301},{"type":"mousemove","time":3059,"x":670,"y":288},{"type":"mouseup","time":3161,"x":670,"y":288},{"time":3162,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3270,"x":662,"y":291},{"type":"mousemove","time":3476,"x":581,"y":308},{"type":"mousewheel","time":3521,"x":581,"y":308,"deltaY":-4.000244140625},{"type":"mousewheel","time":3545,"x":581,"y":308,"deltaY":-37.410888671875},{"type":"mousewheel","time":3570,"x":581,"y":308,"deltaY":-385.2349853515625},{"type":"mousewheel","time":3602,"x":581,"y":308,"deltaY":-252.042236328125},{"type":"mousewheel","time":3627,"x":581,"y":308,"deltaY":-271.1181640625}],"scrollY":0,"scrollX":0,"timestamp":1568969626016}] \ No newline at end of file +[{"name":"Action 1","ops":[{"type":"mousemove","time":461,"x":229,"y":419},{"type":"mousemove","time":735,"x":246,"y":350},{"type":"mousemove","time":1019,"x":249,"y":366},{"type":"screenshot","time":2182}],"scrollY":0,"scrollX":0,"timestamp":1657527803250},{"name":"Action 2","ops":[{"type":"mousedown","time":750,"x":67,"y":8},{"type":"mouseup","time":835,"x":67,"y":8},{"time":836,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1086,"x":67,"y":8},{"type":"mousemove","time":1291,"x":65,"y":29},{"type":"mousemove","time":1491,"x":65,"y":30},{"type":"mousedown","time":1667,"x":65,"y":30},{"type":"mouseup","time":1785,"x":65,"y":30},{"time":1786,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":2142,"x":65,"y":31},{"type":"mousemove","time":2342,"x":61,"y":61},{"type":"mousemove","time":2568,"x":61,"y":61},{"type":"mousedown","time":2652,"x":61,"y":61},{"type":"mouseup","time":2725,"x":61,"y":61},{"time":2726,"delay":400,"type":"screenshot-auto"},{"type":"mousedown","time":3702,"x":61,"y":61},{"type":"mouseup","time":3775,"x":61,"y":61},{"time":3776,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3955,"x":61,"y":61},{"type":"mousemove","time":4155,"x":68,"y":46},{"type":"mousemove","time":4362,"x":71,"y":37},{"type":"mousedown","time":4510,"x":71,"y":37},{"type":"mouseup","time":4605,"x":71,"y":37},{"time":4606,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":5004,"x":71,"y":36},{"type":"mousemove","time":5226,"x":72,"y":16},{"type":"mousedown","time":5406,"x":72,"y":15},{"type":"mousemove","time":5426,"x":72,"y":15},{"type":"mouseup","time":5493,"x":72,"y":15},{"time":5494,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":6071,"x":72,"y":16},{"type":"mousemove","time":6272,"x":69,"y":35},{"type":"mousemove","time":6486,"x":69,"y":35},{"type":"mousedown","time":6614,"x":69,"y":35},{"type":"mouseup","time":6697,"x":69,"y":35},{"time":6698,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":7099,"x":69,"y":36},{"type":"mousemove","time":7299,"x":66,"y":56},{"type":"mousemove","time":7499,"x":62,"y":65},{"type":"mousedown","time":7766,"x":62,"y":65},{"type":"mouseup","time":7841,"x":62,"y":65},{"time":7842,"delay":400,"type":"screenshot-auto"}],"scrollY":0,"scrollX":0,"timestamp":1568040771612},{"name":"Action 3","ops":[{"type":"mousedown","time":465,"x":18,"y":430},{"type":"mousemove","time":578,"x":18,"y":432},{"type":"mousemove","time":914,"x":24,"y":475},{"type":"mouseup","time":1111,"x":23,"y":477},{"time":1112,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1140,"x":23,"y":477},{"type":"mousemove","time":1357,"x":19,"y":571},{"type":"mousemove","time":1603,"x":21,"y":579},{"type":"mousemove","time":1807,"x":21,"y":576},{"type":"mousemove","time":2020,"x":21,"y":574},{"type":"mousedown","time":2170,"x":21,"y":573},{"type":"mousemove","time":2228,"x":21,"y":573},{"type":"mousemove","time":2277,"x":21,"y":573},{"type":"mousemove","time":2493,"x":23,"y":549},{"type":"mousemove","time":2715,"x":23,"y":543},{"type":"mousemove","time":2929,"x":23,"y":543},{"type":"mouseup","time":3233,"x":23,"y":543},{"time":3234,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3327,"x":23,"y":542},{"type":"mousemove","time":3549,"x":18,"y":516},{"type":"mousemove","time":3768,"x":14,"y":510},{"type":"mousedown","time":4021,"x":14,"y":510},{"type":"mouseup","time":4111,"x":14,"y":510},{"time":4112,"delay":400,"type":"screenshot-auto"}],"scrollY":0,"scrollX":0,"timestamp":1603890244262},{"name":"Action 4","ops":[{"type":"mousemove","time":550,"x":429,"y":336},{"type":"mousedown","time":674,"x":431,"y":335},{"type":"mousemove","time":793,"x":431,"y":336},{"type":"mousemove","time":1006,"x":346,"y":462},{"type":"mousemove","time":1207,"x":350,"y":458},{"type":"mouseup","time":1343,"x":350,"y":458},{"time":1344,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":1410,"x":350,"y":458},{"type":"mousemove","time":1603,"x":350,"y":457},{"type":"mousewheel","time":1686,"x":350,"y":457,"deltaY":4.000244140625},{"type":"mousewheel","time":1719,"x":350,"y":457,"deltaY":40.41015625},{"type":"mousewheel","time":1748,"x":350,"y":457,"deltaY":377.4566650390625},{"type":"mousewheel","time":1775,"x":350,"y":457,"deltaY":252.0208740234375},{"type":"mousewheel","time":1801,"x":350,"y":457,"deltaY":274.16015625},{"type":"mousewheel","time":1901,"x":350,"y":457,"deltaY":263.7664794921875},{"type":"mousemove","time":2236,"x":347,"y":454},{"type":"mousemove","time":2441,"x":308,"y":411},{"type":"mousedown","time":2514,"x":308,"y":411},{"type":"mousemove","time":2644,"x":443,"y":385},{"type":"mousemove","time":2855,"x":648,"y":301},{"type":"mousemove","time":3059,"x":670,"y":288},{"type":"mouseup","time":3161,"x":670,"y":288},{"time":3162,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3270,"x":662,"y":291},{"type":"mousemove","time":3476,"x":581,"y":308},{"type":"mousewheel","time":3521,"x":581,"y":308,"deltaY":-4.000244140625},{"type":"mousewheel","time":3545,"x":581,"y":308,"deltaY":-37.410888671875},{"type":"mousewheel","time":3570,"x":581,"y":308,"deltaY":-385.2349853515625},{"type":"mousewheel","time":3602,"x":581,"y":308,"deltaY":-252.042236328125},{"type":"mousewheel","time":3627,"x":581,"y":308,"deltaY":-271.1181640625}],"scrollY":0,"scrollX":0,"timestamp":1568969626016}] \ No newline at end of file From 71bdec63c10f8a6fa2253505b3957a24b39447aa Mon Sep 17 00:00:00 2001 From: plainheart Date: Mon, 11 Jul 2022 16:35:11 +0800 Subject: [PATCH 2/3] chore: fix some typos --- src/component/helper/MapDraw.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/component/helper/MapDraw.ts b/src/component/helper/MapDraw.ts index 5915619411..5296014546 100644 --- a/src/component/helper/MapDraw.ts +++ b/src/component/helper/MapDraw.ts @@ -820,7 +820,7 @@ function resetEventTriggerForRegion( dataIdx: number ): void { // setItemGraphicEl, setHoverStyle after all polygons and labels - // are added to the rigionGroup + // are added to the regionGroup if (viewBuildCtx.data) { // FIXME: when series-map use a SVG map, and there are duplicated name specified // on different SVG elements, after `data.setItemGraphicEl(...)`: @@ -832,7 +832,7 @@ function resetEventTriggerForRegion( viewBuildCtx.data.setItemGraphicEl(dataIdx, eventTrigger); } // series-map will not trigger "geoselectchange" no matter it is - // based on a declared geo component. Becuause series-map will + // based on a declared geo component. Because series-map will // trigger "selectchange". If it trigger both the two events, // If users call `chart.dispatchAction({type: 'toggleSelect'})`, // it not easy to also fire event "geoselectchanged". From 2f29323e10311aebf646eb5458271bd5cfbe088b Mon Sep 17 00:00:00 2001 From: plainheart Date: Mon, 11 Jul 2022 16:38:02 +0800 Subject: [PATCH 3/3] fix(visualMap): fix wrong type of ecData. --- src/component/visualMap/ContinuousView.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/component/visualMap/ContinuousView.ts b/src/component/visualMap/ContinuousView.ts index 68ad343171..9886945161 100644 --- a/src/component/visualMap/ContinuousView.ts +++ b/src/component/visualMap/ContinuousView.ts @@ -32,12 +32,12 @@ import GlobalModel from '../../model/Global'; import ExtensionAPI from '../../core/ExtensionAPI'; import Element, { ElementEvent } from 'zrender/src/Element'; import { TextVerticalAlign, TextAlign } from 'zrender/src/core/types'; -import { ColorString, ECEventData, Payload } from '../../util/types'; +import { ColorString, Payload } from '../../util/types'; import { parsePercent } from 'zrender/src/contain/text'; import { setAsHighDownDispatcher } from '../../util/states'; import { createSymbol } from '../../util/symbol'; import ZRImage from 'zrender/src/graphic/Image'; -import { getECData } from '../../util/innerStore'; +import { ECData, getECData } from '../../util/innerStore'; import { createTextStyle } from '../../label/labelStyle'; import { findEventDispatcher } from '../../util/event'; @@ -817,7 +817,7 @@ class ContinuousView extends VisualMapView { } private _hoverLinkFromSeriesMouseOver(e: ElementEvent) { - let ecData: ECEventData; + let ecData: ECData; findEventDispatcher(e.target, target => { const currECData = getECData(target);