-
Notifications
You must be signed in to change notification settings - Fork 1.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1348 from tradingview/line_bases_series_point_mar…
…kers Implemented line-based series' point markers support
- Loading branch information
Showing
19 changed files
with
472 additions
and
221 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,28 @@ | ||
| import { MediaCoordinatesRenderingScope } from 'fancy-canvas'; | ||
| import { BitmapCoordinatesRenderingScope } from 'fancy-canvas'; | ||
|
|
||
| import { Coordinate } from '../model/coordinate'; | ||
| import { AreaFillColorerStyle } from '../model/series-bar-colorer'; | ||
|
|
||
| import { AreaFillItemBase, PaneRendererAreaBase, PaneRendererAreaDataBase } from './area-renderer-base'; | ||
| import { GradientStyleCache } from './gradient-style-cache'; | ||
|
|
||
| export type AreaFillItem = AreaFillItemBase & AreaFillColorerStyle; | ||
| export interface PaneRendererAreaData extends PaneRendererAreaDataBase<AreaFillItem> { | ||
| } | ||
|
|
||
| interface AreaFillCache extends Record<keyof AreaFillColorerStyle, string> { | ||
| fillStyle: CanvasRenderingContext2D['fillStyle']; | ||
| bottom: Coordinate; | ||
| } | ||
|
|
||
| export class PaneRendererArea extends PaneRendererAreaBase<PaneRendererAreaData> { | ||
| private _fillCache: AreaFillCache | null = null; | ||
|
|
||
| protected override _fillStyle(renderingScope: MediaCoordinatesRenderingScope, item: AreaFillItem): CanvasRenderingContext2D['fillStyle'] { | ||
| const { context: ctx, mediaSize } = renderingScope; | ||
|
|
||
| const { topColor, bottomColor } = item; | ||
| const bottom = mediaSize.height as Coordinate; | ||
|
|
||
| if ( | ||
| this._fillCache !== null && | ||
| this._fillCache.topColor === topColor && | ||
| this._fillCache.bottomColor === bottomColor && | ||
| this._fillCache.bottom === bottom | ||
| ) { | ||
| return this._fillCache.fillStyle; | ||
| } | ||
|
|
||
| const fillStyle = ctx.createLinearGradient(0, 0, 0, bottom); | ||
| fillStyle.addColorStop(0, topColor); | ||
| fillStyle.addColorStop(1, bottomColor); | ||
|
|
||
| this._fillCache = { topColor, bottomColor, fillStyle, bottom }; | ||
|
|
||
| return fillStyle; | ||
| private readonly _fillCache: GradientStyleCache = new GradientStyleCache(); | ||
|
|
||
| protected override _fillStyle(renderingScope: BitmapCoordinatesRenderingScope, item: AreaFillItem): CanvasRenderingContext2D['fillStyle'] { | ||
| return this._fillCache.get( | ||
| renderingScope, | ||
| { | ||
| topColor1: item.topColor, | ||
| topColor2: '', | ||
| bottomColor1: '', | ||
| bottomColor2: item.bottomColor, | ||
| bottom: renderingScope.bitmapSize.height as Coordinate, | ||
| } | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,63 +1,31 @@ | ||
| import { MediaCoordinatesRenderingScope } from 'fancy-canvas'; | ||
|
|
||
| import { clamp } from '../helpers/mathex'; | ||
| import { BitmapCoordinatesRenderingScope } from 'fancy-canvas'; | ||
|
|
||
| import { Coordinate } from '../model/coordinate'; | ||
| import { BaselineFillColorerStyle } from '../model/series-bar-colorer'; | ||
|
|
||
| import { AreaFillItemBase, PaneRendererAreaBase, PaneRendererAreaDataBase } from './area-renderer-base'; | ||
| import { GradientStyleCache } from './gradient-style-cache'; | ||
|
|
||
| export type BaselineFillItem = AreaFillItemBase & BaselineFillColorerStyle; | ||
| export interface PaneRendererBaselineData extends PaneRendererAreaDataBase<BaselineFillItem> { | ||
| } | ||
|
|
||
| interface BaselineFillCache extends Record<keyof BaselineFillColorerStyle, string> { | ||
| fillStyle: CanvasRenderingContext2D['fillStyle']; | ||
| baseLevelCoordinate: Coordinate; | ||
| bottom: Coordinate; | ||
| } | ||
| export class PaneRendererBaselineArea extends PaneRendererAreaBase<PaneRendererBaselineData> { | ||
| private _fillCache: BaselineFillCache | null = null; | ||
| private readonly _fillCache: GradientStyleCache = new GradientStyleCache(); | ||
|
|
||
| protected override _fillStyle(renderingScope: MediaCoordinatesRenderingScope, item: BaselineFillItem): CanvasRenderingContext2D['fillStyle'] { | ||
| const { context: ctx, mediaSize } = renderingScope; | ||
| protected override _fillStyle(renderingScope: BitmapCoordinatesRenderingScope, item: BaselineFillItem): CanvasRenderingContext2D['fillStyle'] { | ||
| // eslint-disable-next-line @typescript-eslint/no-non-null-assertion | ||
| const data = this._data!; | ||
|
|
||
| const { topFillColor1, topFillColor2, bottomFillColor1, bottomFillColor2 } = item; | ||
| const baseLevelCoordinate = data.baseLevelCoordinate ?? mediaSize.height as Coordinate; | ||
| const bottom = mediaSize.height as Coordinate; | ||
|
|
||
| if ( | ||
| this._fillCache !== null && | ||
| this._fillCache.topFillColor1 === topFillColor1 && | ||
| this._fillCache.topFillColor2 === topFillColor2 && | ||
| this._fillCache.bottomFillColor1 === bottomFillColor1 && | ||
| this._fillCache.bottomFillColor2 === bottomFillColor2 && | ||
| this._fillCache.baseLevelCoordinate === baseLevelCoordinate && | ||
| this._fillCache.bottom === bottom | ||
| ) { | ||
| return this._fillCache.fillStyle; | ||
| } | ||
|
|
||
| const fillStyle = ctx.createLinearGradient(0, 0, 0, bottom); | ||
| const baselinePercent = clamp(baseLevelCoordinate / bottom, 0, 1); | ||
|
|
||
| fillStyle.addColorStop(0, topFillColor1); | ||
| fillStyle.addColorStop(baselinePercent, topFillColor2); | ||
| fillStyle.addColorStop(baselinePercent, bottomFillColor1); | ||
| fillStyle.addColorStop(1, bottomFillColor2); | ||
|
|
||
| this._fillCache = { | ||
| topFillColor1, | ||
| topFillColor2, | ||
| bottomFillColor1, | ||
| bottomFillColor2, | ||
| fillStyle, | ||
| baseLevelCoordinate, | ||
| bottom, | ||
| }; | ||
|
|
||
| return fillStyle; | ||
| return this._fillCache.get( | ||
| renderingScope, | ||
| { | ||
| topColor1: item.topFillColor1, | ||
| topColor2: item.topFillColor2, | ||
| bottomColor1: item.bottomFillColor1, | ||
| bottomColor2: item.bottomFillColor2, | ||
| bottom: renderingScope.bitmapSize.height as Coordinate, | ||
| baseLevelCoordinate: data.baseLevelCoordinate, | ||
| } | ||
| ); | ||
| } | ||
| } |
Oops, something went wrong.