123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
/** * Copyright (c) 2017 ~ present NAVER Corp. * billboard.js project is licensed under the MIT license */import {select as d3Select} from "d3-selection";import {$FOCUS, $GAUGE} from "../../config/classes";
type FocusParam = string | string[];
export default {	/**	 * This API highlights specified targets and fade out the others.<br><br>	 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be highlighted.	 * @function focus	 * @instance	 * @memberof Chart	 * @param {string|Array} targetIdsValue Target ids to be highlighted.	 * @example	 *  // data1 will be highlighted and the others will be faded out	 *  chart.focus("data1");	 *	 * // data1 and data2 will be highlighted and the others will be faded out	 * chart.focus(["data1", "data2"]);	 *	 * // all targets will be highlighted	 * chart.focus();	 */	focus(targetIdsValue?: FocusParam): void {		const $$ = this.internal;		const {state} = $$;		const targetIds = $$.mapToTargetIds(targetIdsValue);		const candidates = $$.$el.svg.selectAll(			$$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))		);
		this.revert();		this.defocus();
		candidates.classed($FOCUS.focused, true).classed($FOCUS.defocused, false);
		if ($$.hasArcType() && !state.hasRadar) {			$$.expandArc(targetIds);
			$$.hasType("gauge") &&				$$.markOverlapped(targetIdsValue, $$, `.${$GAUGE.gaugeValue}`);		}
		$$.toggleFocusLegend(targetIds, true);
		state.focusedTargetIds = targetIds;		state.defocusedTargetIds = state.defocusedTargetIds.filter(id => targetIds.indexOf(id) < 0);	},
	/**	 * This API fades out specified targets and reverts the others.<br><br>	 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be faded out.	 * @function defocus	 * @instance	 * @memberof Chart	 * @param {string|Array} targetIdsValue Target ids to be faded out.	 * @example	 * // data1 will be faded out and the others will be reverted.	 * chart.defocus("data1");	 *	 * // data1 and data2 will be faded out and the others will be reverted.	 * chart.defocus(["data1", "data2"]);	 *	 * // all targets will be faded out.	 * chart.defocus();	 */	defocus(targetIdsValue?: FocusParam): void {		const $$ = this.internal;		const {state} = $$;		const targetIds = $$.mapToTargetIds(targetIdsValue);		const candidates = $$.$el.svg.selectAll(			$$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))		);
		candidates.classed($FOCUS.focused, false).classed($FOCUS.defocused, true);
		if ($$.hasArcType(null, ["polar"])) {			$$.unexpandArc(targetIds);
			$$.hasType("gauge") &&				$$.undoMarkOverlapped($$, `.${$GAUGE.gaugeValue}`);		}
		$$.toggleFocusLegend(targetIds, false);
		state.focusedTargetIds = state.focusedTargetIds.filter(id => targetIds.indexOf(id) < 0);		state.defocusedTargetIds = targetIds;	},
	/**	 * This API reverts specified targets.<br><br>	 * You can specify multiple targets by giving an array that includes id as String. If no argument is given, all of targets will be reverted.	 * @function revert	 * @instance	 * @memberof Chart	 * @param {string|Array} targetIdsValue Target ids to be reverted	 * @example	 * // data1 will be reverted.	 * chart.revert("data1");	 *	 * // data1 and data2 will be reverted.	 * chart.revert(["data1", "data2"]);	 *	 * // all targets will be reverted.	 * chart.revert();	 */	revert(targetIdsValue?: FocusParam): void {		const $$ = this.internal;		const {config, state, $el} = $$;		const targetIds = $$.mapToTargetIds(targetIdsValue);		const candidates = $el.svg.selectAll($$.selectorTargets(targetIds)); // should be for all targets
		candidates.classed($FOCUS.focused, false).classed($FOCUS.defocused, false);
		$$.hasArcType(null, ["polar"]) && $$.unexpandArc(targetIds);
		if (config.legend_show) {			$$.showLegend(targetIds.filter($$.isLegendToShow.bind($$)));			$el.legend.selectAll($$.selectorLegends(targetIds))				.filter(function() {					return d3Select(this).classed($FOCUS.legendItemFocused);				})				.classed($FOCUS.legendItemFocused, false);		}
		state.focusedTargetIds = [];		state.defocusedTargetIds = [];	}};