@alauda-fe/common/view-zchart/view-zchart.component.d.ts

Alauda frontend team common codes.

import { BarColumnParams, ChartData, Percentage, ScaleType, TooltipContext } from '@alauda/chart';
import { ThemeService } from '@alauda/ui';
import { AfterViewInit, ApplicationRef, ChangeDetectorRef, ComponentFactoryResolver, ComponentRef, ElementRef, EmbeddedViewRef, EventEmitter, Injector, OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core';
import { CurveFactory, CurveFactoryLineOnly } from 'd3';
import { BehaviorSubject, Observable } from 'rxjs';
import { Chart, Options, TooltipValue, ChartOption, Data } from 'zz-chart';
import { AreaPosition } from '../chart/public-api';
import { StringMap } from '../core/public-api';
import { TranslateService } from '../translate/public-api';
import { XPlotLines } from '../view-chart/public-api';
import { LegendComponent } from './legend/legend.component';
import { ChartDataItem, ChartStatus } from './types';
import * as i0 from "@angular/core";
export interface BrushContext {
    start: number;
    end: number;
}
export type ChartType = 'line' | 'area' | 'bar' | 'point' | 'pie' | 'stat';
export declare class ViewZChartComponent implements AfterViewInit, OnDestroy {
    private readonly componentFactoryResolver;
    private readonly injector;
    private readonly appRef;
    private readonly translate;
    private readonly cdr;
    private readonly viewContainerRef;
    private readonly theme;
    private readonly el;
    backgroundColor: string;
    hideHeader: boolean;
    chartContainer: ElementRef;
    titleContainer: TemplateRef<unknown>;
    tooltipItemVirtual: ElementRef;
    tooltipTitleVirtual: ElementRef;
    tooltipNameVirtual: ElementRef;
    pieLabelContainer: TemplateRef<unknown>;
    mode: 'card' | 'default';
    customNoDataTitle: TemplateRef<unknown> | string;
    customErrorContainer: TemplateRef<unknown>;
    marginLeft: number;
    gridOffsetTop: number;
    rotated: boolean;
    rotated$: Observable<boolean>;
    chartType: ChartType;
    chartType$: Observable<ChartType>;
    series: ChartData[];
    series$: Observable<ChartData[]>;
    xAccessor: (d: ChartDataItem) => string | number | Date;
    yAccessor: (d: ChartDataItem) => number;
    unit: string;
    unit$: Observable<string>;
    callbackFirst: boolean;
    contextCallbackFunction: (context: Chart) => void;
    title: string | TemplateRef<unknown>;
    hideTitle: boolean;
    titleDescription: string | TemplateRef<unknown>;
    titleDescriptionContext: StringMap;
    titleOffsetX: number;
    hideLegend: boolean;
    hideLegend$: Observable<boolean>;
    legendTemplate: TemplateRef<unknown> | string;
    legendTemplate$: Observable<TemplateRef<unknown> | string>;
    leftOperation: TemplateRef<unknown>;
    leftOperationContext: StringMap;
    leftOperationContext$: Observable<StringMap>;
    leftOperation$: Observable<TemplateRef<unknown>>;
    rightOperation: TemplateRef<unknown>;
    rightOperation$: Observable<TemplateRef<unknown>>;
    legendSelectAllOperation: boolean;
    legendSelectAllName: string;
    scaleYMin: number;
    scaleYMax: number;
    yAxisTickSuffix: string;
    dateAxisLabelFormats: string;
    xAxisLabelTranslation: boolean;
    xScaleType: ScaleType;
    xAxisTickFormatter: string | ((value: string) => string);
    ticks: unknown;
    yAxisTickFormatter: string | ((value: number | string) => string);
    yAxisMinStep?: number;
    tooltipHide: boolean;
    tooltipHide$: Observable<boolean>;
    tooltipAutoSort: boolean;
    tooltipSortMethod: (a: TooltipValue, b: TooltipValue) => number;
    tooltipSortMethod$: Observable<(a: TooltipValue, b: TooltipValue) => number>;
    tooltipHideTitle: boolean;
    tooltipAppendToBody: boolean;
    tooltipColumnLayout: boolean;
    tooltipTitleTemplate: TemplateRef<unknown>;
    tooltipPointNameTemplate: TemplateRef<unknown>;
    tooltipTranslation: boolean;
    tooltipTitleTranslation: boolean;
    hideTooltipUnit: boolean;
    tooltipPointFormat: (d: number) => number | string;
    tooltipPointTemplate: TemplateRef<unknown>;
    tooltipPointTemplateContext: unknown;
    bandWidth: number;
    minHeight: number;
    stepLine: boolean;
    stepLine$: Observable<boolean>;
    curveType: CurveFactory | CurveFactoryLineOnly;
    barType: 'standard' | 'stacked';
    startOpacity: number;
    endOpacity: number;
    lineWidth?: number;
    isGroup: boolean;
    barRadius: number;
    closeRadiusLadder: boolean;
    columnClick: (data: BarColumnParams) => void;
    enableZoom: boolean;
    enableZoom$: Observable<boolean>;
    chartStatus: ChartStatus;
    yPlotLinesHide: boolean;
    yPlotLines: TooltipContext;
    pieInnerRadius: number | Percentage;
    pieOuterRadius: number | Percentage;
    pieStartAngle: number;
    pieEndAngle: number;
    pieBackgroundColor: string;
    pieTotal: number;
    pieInnerDisc: boolean;
    pieLabelText: string | TemplateRef<unknown>;
    pieLabelPosition: {
        x: string;
        y: string;
    };
    pieItemStyle?: {
        borderRadius?: number;
    };
    scatterType: 'bubble';
    scatterOpacity: number;
    scatterSize: number;
    scatterThreshold: {
        minSize: number;
        maxSize: number;
    };
    yPlotLines$: Observable<TooltipContext>;
    xPlotLines: XPlotLines;
    xPlotEmpty: boolean;
    xPlotLines$: Observable<XPlotLines>;
    chartStatus$: Observable<ChartStatus>;
    mouseUpEvent: EventEmitter<AreaPosition>;
    markClickEvent: EventEmitter<TooltipContext>;
    refreshEvent: EventEmitter<any>;
    private readonly onDestroy$;
    _chartStatus$$: BehaviorSubject<ChartStatus>;
    _status: ChartStatus;
    chart: Chart;
    chartReactive: ChartOption;
    areaPosition: AreaPosition;
    status$: Observable<{
        loading?: boolean;
        noData?: boolean;
        failed?: boolean;
        noLegend?: boolean;
    }>;
    get background(): string;
    isTemplateRef: (label: any) => label is TemplateRef<unknown>;
    customLegendRef: ComponentRef<LegendComponent>;
    customTitleRef: EmbeddedViewRef<unknown>;
    customPieLabelTextRef: EmbeddedViewRef<unknown>;
    tooltipItemContext: {
        context: TooltipValue[];
    };
    tooltipTitleContext: {
        context: {
            title: string;
            values: TooltipValue[];
        };
    };
    get isCardMode(): boolean;
    get scaleType(): ScaleType;
    get isScaleTime(): boolean;
    get chartEl(): HTMLElement;
    get options(): Options;
    cacheData: Data;
    constructor(componentFactoryResolver: ComponentFactoryResolver, injector: Injector, appRef: ApplicationRef, translate: TranslateService, cdr: ChangeDetectorRef, viewContainerRef: ViewContainerRef, theme: ThemeService, el: ElementRef<HTMLElement>);
    ngAfterViewInit(): void;
    reInit(): void;
    chartInit(): void;
    handelData(data: ChartData[]): {
        values: ({
            x: string | number | Date;
            y: number;
            name?: string;
            size?: number;
            color?: string;
            value?: number;
        } | {
            x: string | number | Date;
            y: number;
            name?: string;
            size?: number;
            color?: string;
        })[];
        name: string;
        color?: string;
        value?: number;
    }[];
    addCustomLegend(): void;
    addCustomTitle(): void;
    addPieLabelText(chartUId: string): void;
    private handleOptionsReactive;
    refresh(): void;
    ngOnDestroy(): void;
    private readonly mergePointContext;
    private handelChartStatus;
    private limitMaxContext;
    private readonly defaultPointFormat;
    private conversionMaximum;
    private readonly titleFormatter;
    private readonly valueFormatter;
    static ɵfac: i0.ɵɵFactoryDeclaration<ViewZChartComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ViewZChartComponent, "acl-view-zchart", never, { "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "hideHeader": { "alias": "hideHeader"; "required": false; }; "mode": { "alias": "mode"; "required": false; }; "customNoDataTitle": { "alias": "customNoDataTitle"; "required": false; }; "customErrorContainer": { "alias": "customErrorContainer"; "required": false; }; "marginLeft": { "alias": "marginLeft"; "required": false; }; "gridOffsetTop": { "alias": "gridOffsetTop"; "required": false; }; "rotated": { "alias": "rotated"; "required": false; }; "chartType": { "alias": "chartType"; "required": false; }; "series": { "alias": "series"; "required": false; }; "xAccessor": { "alias": "xAccessor"; "required": false; }; "yAccessor": { "alias": "yAccessor"; "required": false; }; "unit": { "alias": "unit"; "required": false; }; "contextCallbackFunction": { "alias": "contextCallbackFunction"; "required": false; }; "title": { "alias": "title"; "required": false; }; "hideTitle": { "alias": "hideTitle"; "required": false; }; "titleDescription": { "alias": "titleDescription"; "required": false; }; "titleDescriptionContext": { "alias": "titleDescriptionContext"; "required": false; }; "titleOffsetX": { "alias": "titleOffsetX"; "required": false; }; "hideLegend": { "alias": "hideLegend"; "required": false; }; "legendTemplate": { "alias": "legendTemplate"; "required": false; }; "leftOperation": { "alias": "leftOperation"; "required": false; }; "leftOperationContext": { "alias": "leftOperationContext"; "required": false; }; "rightOperation": { "alias": "rightOperation"; "required": false; }; "legendSelectAllOperation": { "alias": "legendSelectAllOperation"; "required": false; }; "legendSelectAllName": { "alias": "legendSelectAllName"; "required": false; }; "scaleYMin": { "alias": "scaleYMin"; "required": false; }; "scaleYMax": { "alias": "scaleYMax"; "required": false; }; "yAxisTickSuffix": { "alias": "yAxisTickSuffix"; "required": false; }; "dateAxisLabelFormats": { "alias": "dateAxisLabelFormats"; "required": false; }; "xAxisLabelTranslation": { "alias": "xAxisLabelTranslation"; "required": false; }; "xScaleType": { "alias": "xScaleType"; "required": false; }; "xAxisTickFormatter": { "alias": "xAxisTickFormatter"; "required": false; }; "ticks": { "alias": "ticks"; "required": false; }; "yAxisTickFormatter": { "alias": "yAxisTickFormatter"; "required": false; }; "yAxisMinStep": { "alias": "yAxisMinStep"; "required": false; }; "tooltipHide": { "alias": "tooltipHide"; "required": false; }; "tooltipAutoSort": { "alias": "tooltipAutoSort"; "required": false; }; "tooltipSortMethod": { "alias": "tooltipSortMethod"; "required": false; }; "tooltipHideTitle": { "alias": "tooltipHideTitle"; "required": false; }; "tooltipAppendToBody": { "alias": "tooltipAppendToBody"; "required": false; }; "tooltipColumnLayout": { "alias": "tooltipColumnLayout"; "required": false; }; "tooltipTitleTemplate": { "alias": "tooltipTitleTemplate"; "required": false; }; "tooltipPointNameTemplate": { "alias": "tooltipPointNameTemplate"; "required": false; }; "tooltipTranslation": { "alias": "tooltipTranslation"; "required": false; }; "tooltipTitleTranslation": { "alias": "tooltipTitleTranslation"; "required": false; }; "hideTooltipUnit": { "alias": "hideTooltipUnit"; "required": false; }; "tooltipPointFormat": { "alias": "tooltipPointFormat"; "required": false; }; "tooltipPointTemplate": { "alias": "tooltipPointTemplate"; "required": false; }; "tooltipPointTemplateContext": { "alias": "tooltipPointTemplateContext"; "required": false; }; "bandWidth": { "alias": "bandWidth"; "required": false; }; "minHeight": { "alias": "minHeight"; "required": false; }; "stepLine": { "alias": "stepLine"; "required": false; }; "curveType": { "alias": "curveType"; "required": false; }; "barType": { "alias": "barType"; "required": false; }; "startOpacity": { "alias": "startOpacity"; "required": false; }; "endOpacity": { "alias": "endOpacity"; "required": false; }; "lineWidth": { "alias": "lineWidth"; "required": false; }; "isGroup": { "alias": "isGroup"; "required": false; }; "barRadius": { "alias": "barRadius"; "required": false; }; "closeRadiusLadder": { "alias": "closeRadiusLadder"; "required": false; }; "columnClick": { "alias": "columnClick"; "required": false; }; "enableZoom": { "alias": "enableZoom"; "required": false; }; "chartStatus": { "alias": "chartStatus"; "required": false; }; "yPlotLinesHide": { "alias": "yPlotLinesHide"; "required": false; }; "yPlotLines": { "alias": "yPlotLines"; "required": false; }; "pieInnerRadius": { "alias": "pieInnerRadius"; "required": false; }; "pieOuterRadius": { "alias": "pieOuterRadius"; "required": false; }; "pieStartAngle": { "alias": "pieStartAngle"; "required": false; }; "pieEndAngle": { "alias": "pieEndAngle"; "required": false; }; "pieBackgroundColor": { "alias": "pieBackgroundColor"; "required": false; }; "pieTotal": { "alias": "pieTotal"; "required": false; }; "pieInnerDisc": { "alias": "pieInnerDisc"; "required": false; }; "pieLabelText": { "alias": "pieLabelText"; "required": false; }; "pieLabelPosition": { "alias": "pieLabelPosition"; "required": false; }; "pieItemStyle": { "alias": "pieItemStyle"; "required": false; }; "scatterType": { "alias": "scatterType"; "required": false; }; "scatterOpacity": { "alias": "scatterOpacity"; "required": false; }; "scatterSize": { "alias": "scatterSize"; "required": false; }; "scatterThreshold": { "alias": "scatterThreshold"; "required": false; }; "xPlotLines": { "alias": "xPlotLines"; "required": false; }; "xPlotEmpty": { "alias": "xPlotEmpty"; "required": false; }; }, { "mouseUpEvent": "mouseUpEvent"; "markClickEvent": "markClickEvent"; "refreshEvent": "refreshEvent"; }, never, never, false, never>;
}