import { ISciChart2DDefinition } from "../../Builder/buildSurface"; import { TEasingFn } from "../../Core/Animations/EasingFunctions"; import { IGenericAnimation } from "../../Core/Animations/GenericAnimation"; import { EventHandler } from "../../Core/EventHandler"; import { ObservableArray } from "../../Core/ObservableArray"; import { Rect } from "../../Core/Rect"; import { Thickness } from "../../Core/Thickness"; import { EAutoColorMode } from "../../types/AutoColorMode"; import { TBorder } from "../../types/TBorder"; import { TSciChart as TWasmContext } from "../../types/TSciChart"; import { TSciChartSurfaceCanvases } from "../../types/TSciChartSurfaceCanvases"; import { EZoomState } from "../../types/ZoomState"; import { IChartModifierBase } from "../ChartModifiers/ChartModifierBase"; import { RenderSurface } from "../Drawing/RenderSurface"; import { WebGlRenderContext2D } from "../Drawing/WebGlRenderContext2D"; import { LayoutManager } from "../LayoutManager/LayoutManager"; import { SciChartRenderer } from "../Services/SciChartRenderer"; import { IThemeProvider } from "../Themes/IThemeProvider"; import { AxisBase2D } from "./Axis/AxisBase2D"; import { I2DSurfaceOptions } from "./I2DSurfaceOptions"; import { IDataLabelLayoutManager } from "./RenderableSeries/DataLabels/DataLabelLayoutManager"; import { IRenderableSeries } from "./RenderableSeries/IRenderableSeries"; import { SciChartSurfaceBase, TSciChartConfig } from "./SciChartSurfaceBase"; import { TDpiChangedEventArgs } from "./TextureManager/DpiHelper"; import { Point } from "../../Core/Point"; import { EWatermarkPosition } from "../../types/WatermarkPosition"; import { TChartTitleStyle } from "../../types/TextStyle"; import { IChartTitleRenderer } from "../Services/TitleRenderer"; import { ESurfaceType } from "../../types/SurfaceType"; import { IIncludable } from "../../Core/IIncludable"; import { ISciChartSubSurface } from "./ISciChartSubSurface"; import { ISciChartSurface } from "./ISciChartSurface"; import { ESciChartSurfaceType } from "../../types/SciChartSurfaceType"; export declare type TSciChart = TWasmContext; export declare type TWebAssemblyChart = { wasmContext: TSciChart; sciChartSurface: T; }; export interface ISciChartSurfaceOptions { canvases?: TSciChartSurfaceCanvases; masterCanvas?: HTMLCanvasElement; } export declare const sciChartConfig: TSciChartConfig; /** * @summary The {@link SciChartSurface} is the root 2D Chart control in SciChart's High Performance Real-time * {@link https://www.scichart.com/javascript-chart-features | JavaScript Chart Library} * @description * To create a chart using SciChart, declare a {@link SciChartSurface} using {@link SciChartSurface.create}, * add X and Y axes to the {@link SciChartSurface.xAxes} {@link SciChartSurface.yAxes} collection. * * Next, add a series or chart type by adding a {@link BaseRenderableSeries} to the {@link SciChartSurface.renderableSeries} collection. * * You can add annotations and markers using the {@link SciChartSurface.annotations} property, and you can add zoom and pan behaviours, * tooltips and more by using the {@link SciChartSurface.chartModifiers} property. * * To redraw a {@link SciChartSurface} at any time, call {@link SciChartSurface.invalidateElement}, however all properties are reactive and the * chart will automatically redraw if data or properties change. * @remarks * It is possible to have more than one {@link SciChartSurface} on screen at the same time. * {@link SciChartSurface | SciChartSurfaces} scale to fit the parent DIV where they are hosted. Use CSS to position the DIV. */ export declare class SciChartSurface extends SciChartSurfaceBase implements ISciChartSurface { /** * Creates a {@link SciChartSurface} and {@link TSciChart | WebAssembly Context} to occupy the div by element ID in your DOM. * @remarks This method is async and must be awaited * @param divElement The Div Element ID or reference where the {@link SciChartSurface} will reside * @param options Optional - Optional parameters for chart creation. See {@link I2DSurfaceOptions} for more details */ static create(divElement: string | HTMLDivElement, options?: I2DSurfaceOptions): Promise; static disposeSharedWasmContext(): void; /** * Performs a similar operation to {@link SciChartSurface.create} but uses a dedicated WebAssembly context for this chart, and draws directly to the target canvas * This provides better performance for a single chart, but there is a limit (16) to how many you can have on one page. * If you need large numbers of charts all updating at the same time, use this, together with {@link addSubChart} to create many charts on one surface. * @param divElement The Div Element ID or reference where the {@link SciChartSurface} will reside * @param options - optional parameters for chart creation. See {@link I2DSurfaceOptions} for more details */ static createSingle(divElement: string | HTMLDivElement, options?: I2DSurfaceOptions): Promise; /** * Allows setting of web URL for Wasm files, in the case you are loading SciChart outside of npm/webpack environment. * Note the version number of wasm Url must match the version number of SciChart.js you are using. * To use the default CDN, just call SciChart.SciChartSurface.useWasmFromCDN(); * @example * ```ts * import { libraryVersion } from "scichart/Core/BuildStamp"; * * SciChart.SciChartSurface.configure({ * wasmUrl: `https://cdn.jsdelivr.net/npm/scichart@${libraryVersion}/_wasm/scichart2d.wasm` * }); * ``` * @param config */ static configure(config: TSciChartConfig): void; /** * Tell SciChart to load the Wasm files from CDN, rather than expecting them to be served by the host server. * @deprecated the method name breaks [eslint react-hooks/rules-of-hooks](https://legacy.reactjs.org/docs/hooks-rules.html). * To avoid this error in React, use {@link loadWasmFromCDN} instead. * */ static useWasmFromCDN(): void; /** * Tell SciChart to load the Wasm files from the local server, rather than from CDN. * @deprecated the method name breaks [eslint react-hooks/rules-of-hooks](https://legacy.reactjs.org/docs/hooks-rules.html). * To avoid this error in React, use {@link loadWasmLocal} instead. * */ static useWasmLocal(): void; /** * Tell SciChart to load the Wasm files from CDN, rather than expecting them to be served by the host server. */ static loadWasmFromCDN(): void; /** * Tell SciChart to load the Wasm files from the local server, rather than from CDN. */ static loadWasmLocal(): void; static isSubSurface(surface: ISciChartSurface): surface is ISciChartSubSurface; private static createTest; renderSurface: RenderSurface; /** * @inheritDoc */ readonly renderableSeries: ObservableArray; /** * @inheritDoc */ readonly xAxes: ObservableArray; /** * @inheritDoc */ readonly yAxes: ObservableArray; /** * A ViewRect defining the bounds of the Annotation surface under the chart */ annotationUnderlaySurfaceViewRect: Rect; /** * A ViewRect defining the bounds of the Annotation surface over the chart */ annotationOverlaySurfaceViewRect: Rect; /** * A ViewRect defining the bounds of the Chart Modifier Surface (an area for placing tooltips and overlays during mouse interaction) */ chartModifierSurfaceViewRect: Rect; /** * Used internally - the {@link RenderContext2D} for drawing */ /** * An event handler which notifies its subscribers when a render operation starts for this specific surface (or sub-surface). Use this * to update elements of the chart for the current render. Any updates made here will not trigger a subsequent render. */ preRender: EventHandler; /** * An event handler which notifies its subscribers when a render operation starts ignoring the surface order. Use this * to update elements of the chart for the current render. Any updates made here will not trigger a subsequent render. */ preRenderAll: EventHandler; stepBetweenLayers: number; readonly isSubSurface: boolean; /** * Normally, native labels are drawn all at once at the end of the render cycle to improve performance. * In circumstances where you want to draw over the labels, eg with a subchart, set this true to have them drawn earlier. */ renderNativeAxisLabelsImmediately: boolean; /** * @inheritDoc */ readonly webAssemblyContext2D: TSciChart; /** The position of the watermark for trials and community licenses */ watermarkPosition: EWatermarkPosition; /** Set true to position the watermark relative to the overall canvas, rather than the series area. */ watermarkRelativeToCanvas: boolean; sciChartRenderer: SciChartRenderer; protected animationList: IGenericAnimation[]; protected titleProperty: string | string[]; protected titleStyleProperty: Readonly>; protected chartTitleRendererProperty: IChartTitleRenderer; private getPaddingProxy; protected paddingProperty: Thickness; protected currentWebGlRenderContextProperty: WebGlRenderContext2D; private layoutManagerProperty; private dataLabelLayoutManagerProperty; private zoomStateProperty; private watermarkProperties; private watermarkPropertyPosition; private debugRenderingProperty; private solidBrushCacheViewportBorder; private solidBrushCacheCanvasBorder; private viewportBorderProperty; private canvasBorderProperty; private subChartsProperty; private drawSeriesBehindAxisProperty; private autoColorModeProperty; private autoColorRequired; private xCoordSvgTrans; private yCoordSvgTrans; private subChartCounterProperty; protected surfaceRenderOrderProperty: number; protected resolvedSurfaceRenderOrder: number; /** * Creates an instance of the {@link SciChartSurface} * @param webAssemblyContext The {@link TSciChart | SciChart 2D WebAssembly Context} containing native methods and * access to our WebGL2 Engine and WebAssembly numerical methods * @param options optional parameters of type {@link ISciChartSurfaceOptions} used to configure the {@link SciChartSurface} */ constructor(webAssemblyContext: TSciChart, options?: ISciChartSurfaceOptions); /** * @inheritDoc */ get subChartCounter(): number; /** * @inheritDoc */ addSubChartInternal(subSurface: ISciChartSubSurface): void; /** * Remove an existing subChart from a parent surface. See {@link addSubChart} */ removeSubChart(subChart: ISciChartSubSurface): void; /** * The list of subCharts on this surface. See {@link addSubChart} */ get subCharts(): ReadonlyArray; /** * @inheritDoc */ get surfaceType(): ESurfaceType; /** * Used internally - gets or sets the {@link LayoutManager} */ get layoutManager(): LayoutManager; set layoutManager(value: LayoutManager); /** * @inheritDoc */ get chartTitleRenderer(): IChartTitleRenderer; set chartTitleRenderer(value: IChartTitleRenderer); /** * Gets or sets the {@link ISeriesTextLayoutManager} for performing text layout across multiple series */ get dataLabelLayoutManager(): IDataLabelLayoutManager; /** * Used internally - gets or sets the {@link ISeriesTextLayoutManager} for performing text layout across multiple series */ set dataLabelLayoutManager(value: IDataLabelLayoutManager); /** * Gets or sets the title for the SciChartSurface */ get title(): string | string[]; /** * Gets or sets the title for the SciChartSurface */ set title(value: string | string[]); /** * Gets or sets the title text style and placement for the SciChartSurface as {@link TChartTitleStyle} */ get titleStyle(): TChartTitleStyle; /** * Gets or sets the title text style and placement for the SciChartSurface as {@link TChartTitleStyle} * @remarks if updating, should be set as an object (or partial object) of type {@link TChartTitleStyle}, * instead of directly setting individual properties */ set titleStyle(value: TChartTitleStyle); /** * Gets or sets the Padding between the SciChartSurface and its inner elements, in order top, right, bottom, left */ get padding(): Thickness; set padding(padding: Thickness); /** * Gets the adjusted padding between the SciChartSurface and its inner elements, in order top, right, bottom, left * Defines a resulting padding accordingly to DPI scaling. */ get adjustedPadding(): Thickness; /** An offset of the surface position. INTERNAL USE. */ offset: Thickness | undefined; /** * Gets or sets a property whether rendering should be debugged. This will draw rectangles around key boxes and areas on the chart. * Used internally for development purposes */ get debugRendering(): boolean; /** * Gets or sets a property whether rendering should be debugged. This will draw rectangles around key boxes and areas on the chart. * Used internally for development purposes */ set debugRendering(debugRendering: boolean); /** * Gets or sets the {@link EAutoColorMode} which determines when resolution of AUTO_COLOR should occur */ get autoColorMode(): EAutoColorMode; /** * Gets or sets the {@link EAutoColorMode} which determines when resolution of AUTO_COLOR should occur */ set autoColorMode(autoColorMode: EAutoColorMode); get isInvalidated(): boolean; /** * @inheritDoc */ applyTheme(themeProvider: IThemeProvider): void; /** * @inheritDoc */ changeViewportSize(pixelWidth: number, pixelHeight: number): void; /** * @inheritDoc */ invalidateElement(options?: { force?: boolean; svgOnly?: boolean; }): void; doDrawingLoop(context?: WebGlRenderContext2D): void; /** * @inheritDoc */ delete(clearHtml?: boolean): void; /** * @inheritDoc */ onDpiChanged(args: TDpiChangedEventArgs): void; /** * @inheritDoc */ getXAxisById(axisId: string): AxisBase2D | undefined; /** * @inheritDoc */ getDefaultXAxis(): AxisBase2D | undefined; /** * @inheritDoc */ getYAxisById(axisId: string): AxisBase2D; /** * @inheritDoc */ getDefaultYAxis(): AxisBase2D; /** * Update accumulated vectors for all stacked collections */ updateStackedCollectionAccumulatedVectors(): void; /** * @summary Zooms the {@link SciChartSurface} in the X and Y direction to extents of all data (zoom to fit) * @description * @param animationDurationMs An optional animation duration. Default value is 0, which means 'no animation' * @param easingFunction An optional easing function for animations. See {@link TEasingFn} for a list of values * @param onCompleted the callback function */ zoomExtents(animationDurationMs?: number, easingFunction?: TEasingFn, onCompleted?: () => void, xAxisSelectorFn?: (t: IIncludable) => boolean, yAxisSelectorFn?: (t: IIncludable) => boolean): void; /** * @summary Zooms the {@link SciChartSurface} in the X direction to extents of all data (zoom to fit) * @description * @param animationDurationMs An optional animation duration. Default value is 0, which means 'no animation' * @param easingFunction An optional easing function for animations. See {@link TEasingFn} for a list of values */ zoomExtentsX(animationDurationMs?: number, easingFunction?: TEasingFn, axisSelectorFn?: (t: IIncludable) => boolean): void; /** * @inheritDoc */ zoomExtentsY(animationDurationMs?: number, easingFunction?: TEasingFn, axisSelectorFn?: (t: IIncludable) => boolean): void; /** * @inheritDoc */ updateWatermark(left: number, bottom: number): void; /** * Sets zoomStateProperty * @param zoomState */ setZoomState(zoomState: EZoomState): void; /** * Gets zoomStateProperty */ get zoomState(): EZoomState; /** * Gets or sets the SciChartSurface Viewport Border properties */ get viewportBorder(): TBorder; /** * Gets or sets the SciChartSurface Viewport Border properties */ set viewportBorder(value: TBorder); /** * Gets or sets the SciChartSurface Canvas Border properties */ get canvasBorder(): TBorder; /** * Gets or sets the SciChartSurface Canvas Border properties */ set canvasBorder(value: TBorder); /** * Gets or sets the drawing order for surfaces and their subsurfaces. * This allows for a parent surface to draw over a subsurface. * This does not affect the drawing order of separate surfaces - use z-index on the container div to control that. */ getSurfaceRenderOrder(): number; /** * Gets or sets the drawing order for surfaces and their subsurfaces. * This allows for a parent surface to draw over a subsurface. * This does not affect the drawing order of separate surfaces - use z-index on the container div to control that. */ setSurfaceRenderOrder(value: number): void; /** * Used internally - draws SciChartSurface borders */ drawBorder(renderContext: WebGlRenderContext2D): void; /** * Gets the SciChartSurface Viewport Left Border */ get leftViewportBorder(): number; /** * Gets the SciChartSurface Viewport Right Border */ get rightViewportBorder(): number; /** * Gets the SciChartSurface Viewport Top Border */ get topViewportBorder(): number; /** * Gets the SciChartSurface Viewport Bottom Border */ get bottomViewportBorder(): number; /** * Gets the SciChartSurface Canvas Left Border */ get leftCanvasBorder(): number; /** * Gets the SciChartSurface Canvas Right Border */ get rightCanvasBorder(): number; /** * Gets the SciChartSurface Canvas Top Border */ get topCanvasBorder(): number; /** * Gets the SciChartSurface Canvas Bottom Border */ get bottomCanvasBorder(): number; get currentWebGlRenderContext(): WebGlRenderContext2D; get chartViewRect(): Rect; /** * Used internally, updates background after switching between different SciChartSurfaces * @remarks INTERNAL USE. Check the {@link SciChartSurface.background} property for setting a background. */ updateBackground(renderContext: WebGlRenderContext2D): void; /** * Is being called on each render, to run animations * @param timeElapsed */ onAnimate(timeElapsed: number): void; /** * Gets the generic animations currently on the surface. Do not manipulate this array directly. * To add, use addAnimation. To remove, find an animation and call .cancel() on it. */ getAnimations(): ReadonlyArray; /** * Add a {@link GenericAnimation} to the surface. * Multiple animations will be run in parallel, so if you want to run one after another, use the onCompleted callback * to add another animation after the first completes */ addAnimation(...animations: IGenericAnimation[]): void; /** * Returns true if an animation is running */ get isRunningAnimation(): boolean; /** * Returns the seriesViewRect padding relative to the canvas * @param scaled If True returns scaled values, if False divided by {@link DpiHelper.PIXEL_RATIO} * Use not scaled values for SVG annotations and the Legend */ getSeriesViewRectPadding(scaled?: boolean): Thickness; /** * A filter function to apply during {@link ScichartSurface.resolveAutoColors} to determine which series it applies to. * Note that if this is set, you will need to call resolveAutoColors yourself whn the things this filter depends on change */ autoColorFilter: (rs: IRenderableSeries) => boolean; /** * Calls resolveAutoColors on each series to resolve colors marked as auto based on the seriesColorPalette * To configure which series this applies to, set a filter funtion on {@link ScichartSurface.autoColorFilter} */ resolveAutoColors(): void; /** * * @param fontName Register a font to be used with native text. * @param url * @returns */ registerFont(fontName: string, url: string): Promise; /** * Used internally - sets SVG Canvas Translation * @param x * @param y */ setCoordSvgTranslation(x: number, y: number): void; /** * Gets SVG Canvas Translation, used to draw on SVG Canvas using different clipping modes */ getCoordSvgTranslation(): Point; protected getOptions(): I2DSurfaceOptions; /** * Convert the object to a definition that can be serialized to JSON, or used directly with the builder api * @param excludeData if set true, data values will not be included in the json. */ toJSON(excludeData?: boolean): { type: ESciChartSurfaceType; } & ISciChart2DDefinition; /** * Triggers the rerendering of the surface and after the chart rerendering is completed, * returns its serialized state retrieved with {@link SciChartSurface.toJSON}. * * @param excludeData - if set true, data values will not be included in the json. * @returns JSON-like object {@link ISciChart2DDefinition} */ getNextState(excludeData?: boolean): Promise<{ type: ESciChartSurfaceType; } & ISciChart2DDefinition>; /** * Validates {@link SciChartSurface} and links {@link RenderableSeries} to axes * @returns List of errors if there are any */ validateAndLink(): string[]; /** * Returns wasm Id */ getWasmId(): string; protected applyOptions(options: I2DSurfaceOptions | undefined): void; protected resolveSurfaceOrders(): ISciChartSurface[]; /** * @inheritDoc */ protected detachChartModifier(chartModifier: IChartModifierBase): void; /** * @inheritDoc */ protected attachChartModifier(chartModifier: IChartModifierBase): void; /** * @inheritDoc */ protected applySciChartBackground(background: string, renderContext: WebGlRenderContext2D): void; /** * @inheritDoc */ protected setClearAlphaParams(enabled: boolean, alpha: number): void; private zoomExtentsYInternal; private zoomExtentsXInternal; private onRenderSurfaceDraw; private detachSeries; private attachSeries; private detachAxis; private checkAxisIdUniqueness; private attachAxis; protected onAttachSubSurface(subSurface: ISciChartSubSurface): void; protected onDetachSubSurface(subSurface: ISciChartSubSurface): void; /** * Gets or sets the boolean flag for switching behaviour of Axises rendering */ get drawSeriesBehindAxis(): boolean; /** * Gets or sets the boolean flag for switching behaviour of Axises rendering */ set drawSeriesBehindAxis(value: boolean); }