Merge pull request #1411 from tradingview/pane-size-getter

add `paneSize` getter to IChartApi

.size-limit.js

@@ -4,21 +4,21 @@ module.exports = [
 	{
 		name: 'CJS',
 		path: 'dist/lightweight-charts.production.cjs',
-		limit: '47.66 KB',
+		limit: '47.70 KB',
 	},
 	{
 		name: 'ESM',
 		path: 'dist/lightweight-charts.production.mjs',
-		limit: '47.60 KB',
+		limit: '47.64 KB',
 	},
 	{
 		name: 'Standalone-ESM',
 		path: 'dist/lightweight-charts.standalone.production.mjs',
-		limit: '49.32 KB',
+		limit: '49.36 KB',
 	},
 	{
 		name: 'Standalone',
 		path: 'dist/lightweight-charts.standalone.production.js',
-		limit: '49.37 KB',
+		limit: '49.41 KB',
 	},
 ];

src/api/chart-api.ts

@@ -34,7 +34,7 @@ import {
 import { Logical } from '../model/time-data';
 
 import { getSeriesDataCreator } from './get-series-data-creator';
-import { IChartApiBase, MouseEventHandler, MouseEventParams } from './ichart-api';
+import { IChartApiBase, MouseEventHandler, MouseEventParams, PaneSize } from './ichart-api';
 import { IPriceScaleApi } from './iprice-scale-api';
 import { ISeriesApi } from './iseries-api';
 import { ITimeScaleApi } from './itime-scale-api';
@@ -312,6 +312,14 @@ export class ChartApi<HorzScaleItem> implements IChartApiBase<HorzScaleItem>, Da
 		return this._chartWidget.element();
 	}
 
+	public paneSize(): PaneSize {
+		const size = this._chartWidget.paneSize();
+		return {
+			height: size.height,
+			width: size.width,
+		};
+	}
+
 	private _addSeriesImpl<
 		TSeries extends SeriesType,
 		TData extends WhitespaceData<HorzScaleItem> = SeriesDataItemTypeMap<HorzScaleItem>[TSeries],

src/api/ichart-api.ts

@@ -23,6 +23,17 @@ import { IPriceScaleApi } from './iprice-scale-api';
 import { ISeriesApi } from './iseries-api';
 import { ITimeScaleApi } from './itime-scale-api';
 
+/**
+ * Dimensions of the Chart Pane
+ * (the main chart area which excludes the time and price scales).
+ */
+export interface PaneSize {
+	/** Height of the Chart Pane (pixels) */
+	height: number;
+	/** Width of the Chart Pane (pixels) */
+	width: number;
+}
+
 /**
  * Represents a mouse event.
  */
@@ -334,4 +345,12 @@ export interface IChartApiBase<HorzScaleItem = Time> {
 	 * @returns generated div element containing the chart.
 	 */
 	chartElement(): HTMLDivElement;
+
+	/**
+	 * Returns the dimensions of the chart pane (the plot surface which excludes time and price scales).
+	 * This would typically only be useful for plugin development.
+	 *
+	 * @returns Dimensions of the chart pane
+	 */
+	paneSize(): PaneSize;
 }

src/gui/chart-widget.ts

@@ -317,6 +317,11 @@ export class ChartWidget<HorzScaleItem> implements IDestroyable, IChartWidgetBas
 		return this._cursorStyleOverride;
 	}
 
+	public paneSize(): Size {
+		// we currently only support a single pane.
+		return ensureDefined(this._paneWidgets[0]).getSize();
+	}
+
 	// eslint-disable-next-line complexity
 	private _applyAutoSizeOptions(options: DeepPartial<ChartOptionsInternal<HorzScaleItem>>): void {
 		if (options.autoSize === undefined && this._observer && (options.width !== undefined || options.height !== undefined)) {