diff --git a/src/chart/components/pane/pane-manager.component.ts b/src/chart/components/pane/pane-manager.component.ts index f1c141c..14fb3cd 100644 --- a/src/chart/components/pane/pane-manager.component.ts +++ b/src/chart/components/pane/pane-manager.component.ts @@ -34,6 +34,8 @@ import { HitTestCanvasModel } from '../../model/hit-test-canvas.model'; import { firstOf, flatMap, lastOf } from '../../utils/array.utils'; import { ChartResizeHandler } from '../../inputhandlers/chart-resize.handler'; +export type MoveDataSeriesToPaneDirection = 'above' | 'below'; + export class PaneManager extends ChartBaseElement { public panes: Record = {}; public paneRemovedSubject: Subject = new Subject(); @@ -287,17 +289,32 @@ export class PaneManager extends ChartBaseElement { } /** - * Moves data series to a certain pane, or creates a new one if no pane is found + * Move data series to a certain pane, or create a new one if no pane is found */ - public moveDataSeriesToPane(dataSeries: DataSeriesModel, paneUUID?: string) { - const initialPane = dataSeries.extentComponent.paneComponent; + public moveDataSeriesToPane( + dataSeries: DataSeriesModel[], + initialPane: PaneComponent, + initialExtent: YExtentComponent, + paneUUID?: string, + extent?: YExtentComponent, + direction?: MoveDataSeriesToPaneDirection, + ) { + const pane = paneUUID && this.panes[paneUUID]; - const pane = paneUUID && this.panes[paneUUID] ? this.panes[paneUUID] : this.createPane(); - pane.moveDataSeriesToExistingExtentComponent(dataSeries, pane.mainExtent); + if (!pane) { + const order = direction && direction === 'above' ? 0 : this.panesOrder.length; + const newPane = this.createPane(undefined, { order }); + newPane.moveDataSeriesToExistingExtentComponent(dataSeries, initialPane, initialExtent, newPane.mainExtent); + initialPane.yExtentComponents.length === 0 && this.removePane(initialPane.uuid); + return; + } - if (initialPane.yExtentComponents.length === 0) { - this.removePane(initialPane.uuid); + if (extent) { + pane.moveDataSeriesToExistingExtentComponent(dataSeries, initialPane, initialExtent, extent); + } else { + pane.moveDataSeriesToNewExtentComponent(dataSeries, initialPane, initialExtent); } + initialPane.yExtentComponents.length === 0 && this.removePane(initialPane.uuid); } /** diff --git a/src/chart/components/pane/pane.component.ts b/src/chart/components/pane/pane.component.ts index 71e51bb..c964f4e 100644 --- a/src/chart/components/pane/pane.component.ts +++ b/src/chart/components/pane/pane.component.ts @@ -267,21 +267,32 @@ export class PaneComponent extends ChartBaseElement { this.canvasBoundsContainer.updateYAxisWidths(); } - public moveDataSeriesToNewExtentComponent(dataSeries: DataSeriesModel, align: YAxisAlign = 'right') { + /** + * Create new pane extent and attach data series to it + */ + public moveDataSeriesToNewExtentComponent( + dataSeries: DataSeriesModel[], + initialPane: PaneComponent, + initialExtent: YExtentComponent, + align: YAxisAlign = 'right', + ) { const extent = this.createExtentComponent(); extent.yAxis.setYAxisAlign(align); - dataSeries.moveToExtent(extent); + dataSeries.forEach(series => series.moveToExtent(extent)); + initialExtent.dataSeries.size === 0 && initialPane.removeExtentComponent(initialExtent); } - public moveDataSeriesToExistingExtentComponent(dataSeries: DataSeriesModel, extentComponent: YExtentComponent) { - const initialPane = dataSeries.extentComponent.paneComponent; - const initialExtent = dataSeries.extentComponent; - dataSeries.moveToExtent(extentComponent); - - const initialExtentDataSeriesSize = initialExtent.dataSeries.size; - if (initialExtentDataSeriesSize === 0) { - initialPane.removeExtentComponent(initialExtent); - } + /** + * Attach data series to existing y axis extent + */ + public moveDataSeriesToExistingExtentComponent( + dataSeries: DataSeriesModel[], + initialPane: PaneComponent, + initialExtent: YExtentComponent, + extentComponent: YExtentComponent, + ) { + dataSeries.forEach(series => series.moveToExtent(extentComponent)); + initialExtent.dataSeries.size === 0 && initialPane.removeExtentComponent(initialExtent); } /**