@progress/kendo-angular-charts
Version:
Kendo UI Charts for Angular - A comprehensive package for creating beautiful and interactive data visualization. Every chart type, stock charts, and sparklines are included.
116 lines (115 loc) • 4.99 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Component, ViewChildren, QueryList, Input } from '@angular/core';
import { CrosshairTooltipComponent } from './crosshair-tooltip.component';
import * as i0 from "@angular/core";
const AXES = ["categoryAxis", "valueAxis", "xAxis", "yAxis"];
/**
* @hidden
*/
export class CrosshairTooltipsContainerComponent {
popupSettings;
crossahairTooltipComponents;
tooltipKeys = [];
tooltipsMap = {};
show(e) {
const tooltipComponents = this.crossahairTooltipComponents.toArray();
const axisName = e.axisName;
const axisIndex = e.axisIndex;
for (let idx = 0; idx < tooltipComponents.length; idx++) {
if (tooltipComponents[idx].key === axisName + axisIndex) {
tooltipComponents[idx].show(e);
break;
}
}
}
hide() {
const tooltipComponents = this.crossahairTooltipComponents.toArray();
for (let idx = 0; idx < tooltipComponents.length; idx++) {
tooltipComponents[idx].hide();
}
}
get active() {
return this.tooltipKeys.length > 0;
}
createCrosshairTooltips(options) {
const newMap = this.mapTooltips(options);
const map = this.tooltipsMap;
for (const key in map) {
if (!newMap[key]) {
this.removeTooltip(key);
delete map[key];
}
}
for (const key in newMap) {
if (!map[key] && key !== 'constructor' && key !== '__proto__' && key !== 'prototype') {
map[key] = newMap[key];
this.tooltipKeys.push(key);
}
}
}
removeTooltip(key) {
const keys = this.tooltipKeys;
for (let idx = 0; idx < keys.length; idx++) {
if (keys[idx] === key) {
keys.splice(idx, 1);
break;
}
}
}
mapTooltips(options) {
const map = {};
for (let idx = 0; idx < AXES.length; idx++) {
const tooltips = this.axesCrosshairTooltipOptions(options, AXES[idx]);
for (let tooltipIdx = 0; tooltipIdx < tooltips.length; tooltipIdx++) {
const tooltip = tooltips[tooltipIdx];
map[tooltip.name + tooltip.index] = tooltip;
}
}
return map;
}
axesCrosshairTooltipOptions(options, name) {
const result = [];
if (options[name]) {
const axes = [].concat(options[name]);
for (let idx = 0; idx < axes.length; idx++) {
const tooltip = axes[idx].crosshair?.tooltip;
if (tooltip?.visible) {
result.push({
index: idx,
name: name
});
}
}
}
return result;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CrosshairTooltipsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CrosshairTooltipsContainerComponent, isStandalone: true, selector: "kendo-chart-crosshair-tooltips-container", inputs: { popupSettings: "popupSettings" }, viewQueries: [{ propertyName: "crossahairTooltipComponents", predicate: CrosshairTooltipComponent, descendants: true }], ngImport: i0, template: `
@for (key of tooltipKeys; track key) {
<kendo-chart-crosshair-tooltip [key]="key" [popupSettings]="popupSettings">
</kendo-chart-crosshair-tooltip>
}
`, isInline: true, dependencies: [{ kind: "component", type: CrosshairTooltipComponent, selector: "kendo-chart-crosshair-tooltip", inputs: ["key"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CrosshairTooltipsContainerComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-chart-crosshair-tooltips-container',
template: `
@for (key of tooltipKeys; track key) {
<kendo-chart-crosshair-tooltip [key]="key" [popupSettings]="popupSettings">
</kendo-chart-crosshair-tooltip>
}
`,
standalone: true,
imports: [CrosshairTooltipComponent]
}]
}], propDecorators: { popupSettings: [{
type: Input
}], crossahairTooltipComponents: [{
type: ViewChildren,
args: [CrosshairTooltipComponent]
}] } });