igniteui-angular-charts

import { IgDataTemplate } from "igniteui-angular-core"; import { MarkerType } from "./MarkerType"; import { MarkerOutlineMode } from "./MarkerOutlineMode"; import { MarkerFillMode } from "./MarkerFillMode"; import { LegendItemBadgeMarkerSizeScaling } from "igniteui-angular-core"; import { IgxSeriesComponent } from "./igx-series-component"; import { MarkerSeries } from "./MarkerSeries"; import * as i0 from "@angular/core"; /** * Represents the base class for series containing markers. * * MarkerSeries represents the base class for series containing markers. * * Example: * * ```html * <igx-data-chart * [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis * > * </igx-category-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-column-series * #series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value"> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * let series: IgxMarkerSeriesComponent = new IgxMarkerSeriesComponent(); * series.xAxis = this.xAxis; * series.yAxis = this.yAxis; * series.valueMemberPath = "value"; * this.chart.series.add(series); * ``` */ export declare abstract class IgxMarkerSeriesComponent extends IgxSeriesComponent { /** * @hidden */ get i(): MarkerSeries; constructor(); /** * Returns whether the current series supports visual markers. * * `HasMarkers` property is overriden, it returns whether the current series supports visual markers. You can use it like this: * * ```ts * let gotMarkers: boolean = this.series.hasMarkers; * ``` */ get hasMarkers(): boolean; static ngAcceptInputType_hasMarkers: boolean | string; get hasVisibleMarkers(): boolean; static ngAcceptInputType_hasVisibleMarkers: boolean | string; /** * Gets or sets the marker type for the current series object. * This property is ignored when the MarkerTemplate property is set * * `MarkerType` property gets or sets the marker type for the current series object. For example, you can set it like this: * * ```html * <igx-data-chart * [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * #yAxis> * </igx-numeric-y-axis> * <igx-column-series * #series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType = "circle"> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * this.series.markerType = "circle"; * ``` */ get markerType(): MarkerType; set markerType(v: MarkerType); static ngAcceptInputType_markerType: MarkerType | string; /** * Represents the resolved marker type for the series. */ get actualMarkerType(): MarkerType; set actualMarkerType(v: MarkerType); static ngAcceptInputType_actualMarkerType: MarkerType | string; /** * Gets or sets whether the marker for the current series object should be treated as circular. */ get isCustomMarkerCircular(): boolean; set isCustomMarkerCircular(v: boolean); static ngAcceptInputType_isCustomMarkerCircular: boolean | string; /** * Gets whether the markers for the current series are in circular shape */ get effectiveIsMarkerCircular(): boolean; static ngAcceptInputType_effectiveIsMarkerCircular: boolean | string; /** * Gets or sets whether the marker outline is based on the marker brush of the series rather than the marker outlines collection. */ get markerOutlineMode(): MarkerOutlineMode; set markerOutlineMode(v: MarkerOutlineMode); static ngAcceptInputType_markerOutlineMode: MarkerOutlineMode | string; /** * Gets or sets whether the marker fill is based on the marker outline of the series rather than the marker brushes collection. */ get markerFillMode(): MarkerFillMode; set markerFillMode(v: MarkerFillMode); static ngAcceptInputType_markerFillMode: MarkerFillMode | string; /** * Gets or sets the MarkerTemplate for the current series object. * * `MarkerTemplate` property gets or sets the MarkerTemplate for the current series object. For example, you can use it like this: * * ```html * <igx-data-chart * [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * <igx-column-series * #series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerTemplate="circleMarkerTemplate"> * </igx-column-series> * </igx-data-chart> * ``` */ get markerTemplate(): IgDataTemplate; set markerTemplate(v: IgDataTemplate); /** * Gets or sets thickness of the marker outline */ get markerThickness(): number; set markerThickness(v: number); static ngAcceptInputType_markerThickness: number | string; /** * Gets or sets the size in device-independent pixels (dp) of the data point markers. Set to NaN to use the template's default size. */ get markerSize(): number; set markerSize(v: number); static ngAcceptInputType_markerSize: number | string; /** * Gets or sets how the legend badge size scales with the series' MarkerSize. Applies when the * resolved badge shape draws a marker — that's Marker (always) and Line/LineWithMarker when * LegendItemBadgeMode is MatchSeries (the overlaid-marker variant). No effect on shape-only * badges (Circle, Square, Bar, Column) or on Line in Simplified mode. * Scaling only takes effect when MarkerSize is set to a non-default value. */ get legendItemBadgeMarkerSizeScaling(): LegendItemBadgeMarkerSizeScaling; set legendItemBadgeMarkerSizeScaling(v: LegendItemBadgeMarkerSizeScaling); static ngAcceptInputType_legendItemBadgeMarkerSizeScaling: LegendItemBadgeMarkerSizeScaling | string; /** * Gets the actual width (in device-independent pixels) of the marker drawn in the legend badge for this series. Reflects scaling * applied via LegendItemBadgeMarkerSizeScaling when MarkerSize is non-default; otherwise equals the platform default. */ get actualLegendItemBadgeMarkerWidth(): number; set actualLegendItemBadgeMarkerWidth(v: number); static ngAcceptInputType_actualLegendItemBadgeMarkerWidth: number | string; /** * Gets the actual height (in device-independent pixels) of the marker drawn in the legend badge for this series. Reflects scaling * applied via LegendItemBadgeMarkerSizeScaling when MarkerSize is non-default; otherwise equals the platform default. */ get actualLegendItemBadgeMarkerHeight(): number; set actualLegendItemBadgeMarkerHeight(v: number); static ngAcceptInputType_actualLegendItemBadgeMarkerHeight: number | string; /** * Gets the actual width (in device-independent pixels) of the marker overlay used inside a line-with-marker legend badge. * Defaults to the platform's inset marker size and scales with MarkerSize and LegendItemBadgeMarkerSizeScaling. * Kept smaller than the cell so the underlying line stays visible behind the marker. */ get actualLegendItemBadgeOverlaidMarkerWidth(): number; set actualLegendItemBadgeOverlaidMarkerWidth(v: number); static ngAcceptInputType_actualLegendItemBadgeOverlaidMarkerWidth: number | string; /** * Gets the actual height (in device-independent pixels) of the marker overlay used inside a line-with-marker legend badge. * Defaults to the platform's inset marker size and scales with MarkerSize and LegendItemBadgeMarkerSizeScaling. */ get actualLegendItemBadgeOverlaidMarkerHeight(): number; set actualLegendItemBadgeOverlaidMarkerHeight(v: number); static ngAcceptInputType_actualLegendItemBadgeOverlaidMarkerHeight: number | string; /** * Gets the effective marker template for the current series object. * * `ActualMarkerTemplate` property gets the effective marker template for the current series object. You can use it like this: * * ```ts * let effectiveMarkerTemplate: IgxDataTemplate = this.series.actualMarkerTemplate; * ``` */ get actualMarkerTemplate(): IgDataTemplate; set actualMarkerTemplate(v: IgDataTemplate); /** * Gets or sets the brush that specifies how the current series object's marker interiors are painted. * * `MarkerBrush` property gets or sets the brush that specifies how the current series object's marker interiors are painted. You can use it like this: * * ```html * <igx-data-chart * [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * <igx-column-series * #series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerBrush = "blue"> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * this.series.markerBrush = "red"; * ``` */ get markerBrush(): string; set markerBrush(v: string); /** * Gets the effective marker brush for the current series object. * * `ActualMarkerBrush` property gets the effective marker brush for the current series object. For example, you can use it like this: * * ```ts * let effectiveMarkerBrush: string = this.series.actualMarkerBrush; * * ``` */ get actualMarkerBrush(): string; set actualMarkerBrush(v: string); /** * Gets or sets the brush that specifies how the current series object's marker outlines are painted. * * `MarkerOutline` property gets or sets the brush that specifies how the current series object's marker outlines are painted. You can use it like this: * * ```html * <igx-data-chart * [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * <igx-column-series * #series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerOutline = "blue"> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * this.series.markerOutline = "red"; * ``` */ get markerOutline(): string; set markerOutline(v: string); /** * Gets the effective marker outline for the current series object. * * `ActualMarkerOutline` property gets the effective marker outline for the current series object. You can use it like this: * * ```ts * let effectiveMarkerOutline: string = this.series.actualMarkerOutline; * * ``` */ get actualMarkerOutline(): string; set actualMarkerOutline(v: string); static ɵfac: i0.ɵɵFactoryDeclaration<IgxMarkerSeriesComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxMarkerSeriesComponent, "ng-component", never, { "markerType": { "alias": "markerType"; "required": false; }; "actualMarkerType": { "alias": "actualMarkerType"; "required": false; }; "isCustomMarkerCircular": { "alias": "isCustomMarkerCircular"; "required": false; }; "markerOutlineMode": { "alias": "markerOutlineMode"; "required": false; }; "markerFillMode": { "alias": "markerFillMode"; "required": false; }; "markerTemplate": { "alias": "markerTemplate"; "required": false; }; "markerThickness": { "alias": "markerThickness"; "required": false; }; "markerSize": { "alias": "markerSize"; "required": false; }; "legendItemBadgeMarkerSizeScaling": { "alias": "legendItemBadgeMarkerSizeScaling"; "required": false; }; "actualLegendItemBadgeMarkerWidth": { "alias": "actualLegendItemBadgeMarkerWidth"; "required": false; }; "actualLegendItemBadgeMarkerHeight": { "alias": "actualLegendItemBadgeMarkerHeight"; "required": false; }; "actualLegendItemBadgeOverlaidMarkerWidth": { "alias": "actualLegendItemBadgeOverlaidMarkerWidth"; "required": false; }; "actualLegendItemBadgeOverlaidMarkerHeight": { "alias": "actualLegendItemBadgeOverlaidMarkerHeight"; "required": false; }; "actualMarkerTemplate": { "alias": "actualMarkerTemplate"; "required": false; }; "markerBrush": { "alias": "markerBrush"; "required": false; }; "actualMarkerBrush": { "alias": "actualMarkerBrush"; "required": false; }; "markerOutline": { "alias": "markerOutline"; "required": false; }; "actualMarkerOutline": { "alias": "actualMarkerOutline"; "required": false; }; }, {}, never, never, true, never>; }