diff --git a/src/component/marker/MarkerView.ts b/src/component/marker/MarkerView.ts index 9af63e3760..751dd9f97e 100644 --- a/src/component/marker/MarkerView.ts +++ b/src/component/marker/MarkerView.ts @@ -25,7 +25,7 @@ import ExtensionAPI from '../../core/ExtensionAPI'; import { makeInner } from '../../util/model'; import SeriesModel from '../../model/Series'; import Group from 'zrender/src/graphic/Group'; -import { enterBlur } from '../../util/states'; +import { enterBlur, leaveBlur } from '../../util/states'; const inner = makeInner<{ keep: boolean @@ -71,7 +71,7 @@ abstract class MarkerView extends ComponentView { inner(drawGroup).keep = true; } - blurSeries(seriesModelList: SeriesModel[]) { + toggleBlurSeries(seriesModelList: SeriesModel[], isBlur: boolean) { each(seriesModelList, seriesModel => { const markerModel = MarkerModel.getMarkerModelFromSeries( seriesModel, @@ -81,7 +81,7 @@ abstract class MarkerView extends ComponentView { const data = markerModel.getData(); data.eachItemGraphicEl(function (el) { if (el) { - enterBlur(el); + isBlur ? enterBlur(el) : leaveBlur(el); } }); } diff --git a/src/util/states.ts b/src/util/states.ts index d247cb62b4..f3886cd78a 100644 --- a/src/util/states.ts +++ b/src/util/states.ts @@ -61,6 +61,7 @@ import GlobalModel from '../model/Global'; import ExtensionAPI from '../core/ExtensionAPI'; import ComponentModel from '../model/Component'; import { error } from './log'; +import type ComponentView from '../view/Component'; // Reserve 0 as default. let _highlightNextDigit = 1; @@ -427,19 +428,28 @@ function shouldSilent(el: Element, e: ElementEvent) { export function allLeaveBlur(api: ExtensionAPI) { const model = api.getModel(); + const leaveBlurredSeries: SeriesModel[] = []; + const allComponentViews: ComponentView[] = []; model.eachComponent(function (componentType, componentModel) { const componentStates = getComponentStates(componentModel); + const isSeries = componentType === 'series'; + const view = isSeries ? api.getViewOfSeriesModel(componentModel as SeriesModel) + : api.getViewOfComponentModel(componentModel); + !isSeries && allComponentViews.push(view as ComponentView); if (componentStates.isBlured) { - const view = componentType === 'series' - ? api.getViewOfSeriesModel(componentModel as SeriesModel) - : api.getViewOfComponentModel(componentModel); // Leave blur anyway view.group.traverse(function (child) { singleLeaveBlur(child); }); + isSeries && leaveBlurredSeries.push(componentModel as SeriesModel); } componentStates.isBlured = false; }); + each(allComponentViews, function (view) { + if (view && view.toggleBlurSeries) { + view.toggleBlurSeries(leaveBlurredSeries, false, model); + } + }); } export function blurSeries( @@ -519,8 +529,8 @@ export function blurSeries( return; } const view = api.getViewOfComponentModel(componentModel); - if (view && view.blurSeries) { - view.blurSeries(blurredSeries, ecModel); + if (view && view.toggleBlurSeries) { + view.toggleBlurSeries(blurredSeries, true, ecModel); } }); } diff --git a/src/view/Component.ts b/src/view/Component.ts index 1c729a1ee3..ed7fa8ef37 100644 --- a/src/view/Component.ts +++ b/src/view/Component.ts @@ -107,11 +107,11 @@ class ComponentView { } /** - * Hook for blur target series. - * Can be used in marker for blur the markers + * Hook for toggle blur target series. + * Can be used in marker for blur or leave blur the markers */ - blurSeries(seriesModels: SeriesModel[], ecModel: GlobalModel): void { - // Do nothing; + toggleBlurSeries(seriesModels: SeriesModel[], isBlur: boolean, ecModel: GlobalModel): void { + // Do nothing; } /** diff --git a/test/markPoint.html b/test/markPoint.html index bf42fbaa07..f4ca85f12f 100644 --- a/test/markPoint.html +++ b/test/markPoint.html @@ -89,7 +89,9 @@ symbolSize: 6, areaStyle: {normal: {}}, data: data1, - + emphasis: { + focus: 'series' + }, markPoint: { data: [ {