Skip to content

Commit bfc307a

Browse files
authored
Merge pull request #1720 from tradingview/feature/series-thee-shaking-test
addSeries test and website changes
2 parents 140a653 + 2c785db commit bfc307a

File tree

450 files changed

+1471
-1144
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

450 files changed

+1471
-1144
lines changed

packages/create-lwc-plugin/template-primitive/src/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../sample-data';
33
import { _CLASSNAME_ } from '../template-entry';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries({
9+
const lineSeries = chart.addSeries(LineSeries, {
1010
color: '#000000',
1111
});
1212
const data = generateLineData();

plugin-examples/src/plugins/anchored-text/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, LineSeries } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { AnchoredText } from '../anchored-text';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010

1111
lineSeries.setData(generateLineData());
1212

plugin-examples/src/plugins/background-shade-series/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, LineSeries } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { BackgroundShadeSeries } from '../background-shade-series';
44

@@ -16,5 +16,5 @@ const myCustomSeries = chart.addCustomSeries(customSeriesView, {
1616

1717
myCustomSeries.setData(data);
1818

19-
const lineSeries = chart.addLineSeries({ color: 'black' });
19+
const lineSeries = chart.addSeries(LineSeries, { color: 'black' });
2020
lineSeries.setData(data);

plugin-examples/src/plugins/bands-indicator/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, LineSeries } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { BandsIndicator } from '../bands-indicator';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

plugin-examples/src/plugins/delta-tooltip/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, AreaSeries } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { DeltaTooltipPrimitive } from '../delta-tooltip';
44

@@ -22,7 +22,7 @@ const chart = ((window as unknown as any).chart = createChart('chart', {
2222
handleScroll: false,
2323
}));
2424

25-
const areaSeries = chart.addAreaSeries({
25+
const areaSeries = chart.addSeries(AreaSeries, {
2626
lineColor: 'rgb(40,98,255)',
2727
topColor: 'rgba(40,98,255, 0.4)',
2828
bottomColor: 'rgba(40,98,255, 0)',

plugin-examples/src/plugins/expiring-price-alerts/example/example.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {
33
LineData,
44
Time,
55
createChart,
6+
LineSeries,
67
} from 'lightweight-charts';
78
import { ExpiringPriceAlerts } from '../expiring-price-alerts';
89
import { sampleAlertLineData } from '../sample-data';
@@ -17,7 +18,7 @@ const chart = createChart('chart', {
1718
},
1819
});
1920

20-
const lineSeries = chart.addLineSeries({
21+
const lineSeries = chart.addSeries(LineSeries, {
2122
lastPriceAnimation: LastPriceAnimationMode.OnDataUpdate,
2223
});
2324
const data = sampleAlertLineData(); // 622 items

plugin-examples/src/plugins/heatmap-series/example/example2.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, LineSeries } from 'lightweight-charts';
22
import { HeatMapSeries } from '../heatmap-series';
33
import { HeatMapData, HeatmapCell } from '../data';
44
import { generateLineData } from '../../../sample-data';
@@ -57,7 +57,7 @@ const myCustomSeries = chart.addCustomSeries(customSeriesView, {
5757

5858
myCustomSeries.setData(heatmapData);
5959

60-
const lineSeries = chart.addLineSeries({
60+
const lineSeries = chart.addSeries(LineSeries, {
6161
color: 'black',
6262
});
6363
lineSeries.setData(lineData);

plugin-examples/src/plugins/highlight-bar-crosshair/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { CandlestickSeries, createChart } from 'lightweight-charts';
22
import { generateAlternativeCandleData } from '../../../sample-data';
33
import { CrosshairHighlightPrimitive } from '../highlight-bar-crosshair';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const candleSeries = chart.addCandlestickSeries();
9+
const candleSeries = chart.addSeries(CandlestickSeries);
1010
candleSeries.setData(generateAlternativeCandleData());
1111

1212
const highlightPrimitive = new CrosshairHighlightPrimitive({

plugin-examples/src/plugins/image-watermark/example/example.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33

44
import imgUrl from './image.svg';
@@ -27,10 +27,10 @@ const watermark = new ImageWatermark(imgUrl, {
2727
* series to be useful. Maybe if they are dynamically adding and removing series
2828
* but would like some primitives to always be visible (i.e. a 'chart primitive').
2929
*/
30-
// const chartSeries = chart.addLineSeries();
30+
// const chartSeries = chart.addSeries(LineSeries);
3131
// chartSeries.attachPrimitive(watermark);
3232

33-
const lineSeries = chart.addLineSeries();
33+
const lineSeries = chart.addSeries(LineSeries);
3434
const data = generateLineData();
3535
lineSeries.setData(data);
3636

plugin-examples/src/plugins/overlay-price-scale/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { createChart, LineSeries } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { OverlayPriceScale } from '../overlay-price-scale';
44

@@ -14,7 +14,7 @@ const chart = ((window as unknown as any).chart = createChart('chart', {
1414
},
1515
}));
1616

17-
const lineSeries = chart.addAreaSeries({
17+
const lineSeries = chart.addSeries(LineSeries, {
1818
priceScaleId: 'overlay',
1919
});
2020

plugin-examples/src/plugins/partial-price-line/example/example.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,17 @@
1-
import { LastPriceAnimationMode, LineData, createChart } from 'lightweight-charts';
1+
import {
2+
LastPriceAnimationMode,
3+
LineData,
4+
LineSeries,
5+
createChart,
6+
} from 'lightweight-charts';
27
import { generateLineData } from '../../../sample-data';
38
import { PartialPriceLine } from '../partial-price-line';
49

510
const chart = ((window as unknown as any).chart = createChart('chart', {
611
autoSize: true,
712
}));
813

9-
const lineSeries = chart.addLineSeries({
14+
const lineSeries = chart.addSeries(LineSeries, {
1015
lastPriceAnimation: LastPriceAnimationMode.OnDataUpdate,
1116
});
1217

plugin-examples/src/plugins/rectangle-drawing-tool/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { RectangleDrawingTool } from '../rectangle-drawing-tool';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

plugin-examples/src/plugins/tooltip/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { AreaSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { TooltipPrimitive } from '../tooltip';
44

@@ -20,7 +20,7 @@ const chart = ((window as unknown as any).chart = createChart('chart', {
2020
},
2121
}));
2222

23-
const areaSeries = chart.addAreaSeries({
23+
const areaSeries = chart.addSeries(AreaSeries, {
2424
lineColor: 'rgb(4,153,129)',
2525
topColor: 'rgba(4,153,129, 0.4)',
2626
bottomColor: 'rgba(4,153,129, 0)',

plugin-examples/src/plugins/trend-line/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { TrendLine } from '../trend-line';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

plugin-examples/src/plugins/user-price-alerts/example/example.ts

+7-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
import { LastPriceAnimationMode, LineStyle, createChart } from 'lightweight-charts';
1+
import {
2+
LastPriceAnimationMode,
3+
LineStyle,
4+
AreaSeries,
5+
createChart,
6+
} from 'lightweight-charts';
27
import { generateLineData } from '../../../sample-data';
38
import { UserAlertInfo } from '../state';
49
import { UserPriceAlerts } from '../user-price-alerts';
@@ -36,7 +41,7 @@ const chart = createChart('chart', {
3641
handleScroll: false,
3742
});
3843

39-
const areaSeries = chart.addAreaSeries({
44+
const areaSeries = chart.addSeries(AreaSeries, {
4045
lineColor: 'rgb(4,153,129)',
4146
topColor: 'rgba(4,153,129, 0.4)',
4247
bottomColor: 'rgba(4,153,129, 0)',

plugin-examples/src/plugins/user-price-lines/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { UserPriceLines } from '../user-price-lines';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

plugin-examples/src/plugins/vertical-line/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { VertLine } from '../vertical-line';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

plugin-examples/src/plugins/volume-profile/example/example.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
import { createChart } from 'lightweight-charts';
1+
import { LineSeries, createChart } from 'lightweight-charts';
22
import { generateLineData } from '../../../sample-data';
33
import { VolumeProfile } from '../volume-profile';
44

55
const chart = ((window as unknown as any).chart = createChart('chart', {
66
autoSize: true,
77
}));
88

9-
const lineSeries = chart.addLineSeries();
9+
const lineSeries = chart.addSeries(LineSeries);
1010
const data = generateLineData();
1111
lineSeries.setData(data);
1212

src/api/chart-api.ts

+16
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/// <reference types="_build-time-constants" />
12
import { ChartWidget, MouseEventParamsImpl, MouseEventParamsImplSupplier } from '../gui/chart-widget';
23

34
import { assert, ensure, ensureDefined } from '../helpers/assertions';
@@ -14,8 +15,10 @@ import { Pane } from '../model/pane';
1415
import { Series } from '../model/series';
1516
import { SeriesPlotRow } from '../model/series-data';
1617
import {
18+
CandlestickStyleOptions,
1719
CustomSeriesOptions,
1820
CustomSeriesPartialOptions,
21+
fillUpDownCandlesticksColors,
1922
precisionByMinMove,
2023
PriceFormat,
2124
PriceFormatBuiltIn,
@@ -264,6 +267,16 @@ export class ChartApi<HorzScaleItem> implements IChartApiBase<HorzScaleItem>, Da
264267
}
265268

266269
public applyOptions(options: DeepPartial<ChartOptionsImpl<HorzScaleItem>>): void {
270+
if (process.env.NODE_ENV === 'development') {
271+
const colorSpace = options.layout?.colorSpace;
272+
if (colorSpace !== undefined && colorSpace !== this.options().layout.colorSpace) {
273+
throw new Error(`colorSpace option should not be changed once the chart has been created.`);
274+
}
275+
const colorParsers = options.layout?.colorParsers;
276+
if (colorParsers !== undefined && colorParsers !== this.options().layout.colorParsers) {
277+
throw new Error(`colorParsers option should not be changed once the chart has been created.`);
278+
}
279+
}
267280
this._chartWidget.applyOptions(toInternalOptions(options));
268281
}
269282

@@ -335,6 +348,9 @@ export class ChartApi<HorzScaleItem> implements IChartApiBase<HorzScaleItem>, Da
335348
): ISeriesApi<TSeries, HorzScaleItem, TData, TOptions, TPartialOptions> {
336349
assert(isSeriesDefinition<TSeries>(definition));
337350
patchPriceFormat(options.priceFormat);
351+
if (definition.type === 'Candlestick') {
352+
fillUpDownCandlesticksColors(options as DeepPartial<CandlestickStyleOptions>);
353+
}
338354
const strictOptions = merge(clone(seriesOptionsDefaults), clone(definition.defaultOptions), options) as SeriesOptionsMap[TSeries];
339355
const createPaneView = definition.createPaneView;
340356
const series = new Series(this._chartWidget.model(), definition.type, strictOptions, createPaneView, definition.customPaneView);

src/api/options/layout-options-defaults.ts

+2
Original file line numberDiff line numberDiff line change
@@ -16,4 +16,6 @@ export const layoutOptionsDefaults: LayoutOptions = {
1616
separatorHoverColor: 'rgba(178, 181, 189, 0.2)',
1717
},
1818
attributionLogo: true,
19+
colorSpace: 'srgb',
20+
colorParsers: [],
1921
};

src/gui/attribution-logo-widget.ts

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
import { colorStringToGrayscale } from '../helpers/color';
2-
31
import { IChartWidgetBase } from './chart-widget';
42

53
type LogoTheme = 'dark' | 'light';
@@ -44,7 +42,12 @@ export class AttributionLogoWidget {
4442
}
4543

4644
private _themeToUse(): LogoTheme {
47-
return colorStringToGrayscale(this._chart.options()['layout'].textColor) > 160 ? 'dark' : 'light';
45+
return this._chart
46+
.model()
47+
.colorParser()
48+
.colorStringToGrayscale(this._chart.options()['layout'].textColor) > 160
49+
? 'dark'
50+
: 'light';
4851
}
4952

5053
private _shouldBeVisible(): boolean {

src/gui/pane-widget.ts

+6-2
Original file line numberDiff line numberDiff line change
@@ -484,9 +484,13 @@ export class PaneWidget implements IDestroyable, MouseEventHandlers {
484484
this._rightPriceAxisWidget.paint(type);
485485
}
486486

487+
const canvasOptions: CanvasRenderingContext2DSettings = {
488+
colorSpace: this._chart.options().layout.colorSpace,
489+
};
490+
487491
if (type !== InvalidationLevel.Cursor) {
488492
this._canvasBinding.applySuggestedBitmapSize();
489-
const target = tryCreateCanvasRenderingTarget2D(this._canvasBinding);
493+
const target = tryCreateCanvasRenderingTarget2D(this._canvasBinding, canvasOptions);
490494
if (target !== null) {
491495
target.useBitmapCoordinateSpace((scope: BitmapCoordinatesRenderingScope) => {
492496
this._drawBackground(scope);
@@ -501,7 +505,7 @@ export class PaneWidget implements IDestroyable, MouseEventHandlers {
501505
}
502506

503507
this._topCanvasBinding.applySuggestedBitmapSize();
504-
const topTarget = tryCreateCanvasRenderingTarget2D(this._topCanvasBinding);
508+
const topTarget = tryCreateCanvasRenderingTarget2D(this._topCanvasBinding, canvasOptions);
505509
if (topTarget !== null) {
506510
topTarget.useBitmapCoordinateSpace(({ context: ctx, bitmapSize }: BitmapCoordinatesRenderingScope) => {
507511
ctx.clearRect(0, 0, bitmapSize.width, bitmapSize.height);

src/gui/price-axis-stub.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,9 @@ export class PriceAxisStub implements IDestroyable {
101101
this._invalidated = false;
102102

103103
this._canvasBinding.applySuggestedBitmapSize();
104-
const target = tryCreateCanvasRenderingTarget2D(this._canvasBinding);
104+
const target = tryCreateCanvasRenderingTarget2D(this._canvasBinding, {
105+
colorSpace: this._options.layout.colorSpace,
106+
});
105107
if (target !== null) {
106108
target.useBitmapCoordinateSpace((scope: BitmapCoordinatesRenderingScope) => {
107109
this._drawBackground(scope);

0 commit comments

Comments
 (0)