tradingview / lightweight-charts

Performant financial charts built with HTML5 canvas
https://www.tradingview.com/lightweight-charts/
Apache License 2.0
9.56k stars 1.64k forks source link

Allow AREA series to be "infinite" horizontally ( like price lines ) #1669

Open 0x33dm opened 3 months ago

0x33dm commented 3 months ago

Currently, the "PRICE LINE" is infinite on the chart, and it works perfectly.

Along with the 2 price lines i have i added an AREA series in order to "paint" it with a "rectangle", i would like it to be "infinite horizontally" the same way as the price lines.

So there would be no "gap" on the sides when using "rightOffset"

Is it possible?

image

SlicedSilver commented 3 months ago

I would suggest that you could implement this with a LWC plugin.

Plugins would allow you to define a rectangle that drawn completely across the screen.

The template example provided by create-lwc-plugin for a drawing primitive is a rectangle, and then you could add in some options to draw a gradient for the fill, and remove the logic for defining x coordinates and rather just plot from 0 until scope.mediaSize.width * scope.horizontalPixelRatio in the renderer code.

0x33dm commented 3 months ago

I would suggest that you could implement this with a LWC plugin.

Plugins would allow you to define a rectangle that drawn completely across the screen.

The template example provided by create-lwc-plugin for a drawing primitive is a rectangle, and then you could add in some options to draw a gradient for the fill, and remove the logic for defining x coordinates and rather just plot from 0 until scope.mediaSize.width * scope.horizontalPixelRatio in the renderer code.

The tricky part is that the rectangle would have to work like the area, as in, when the chart is resized and moved around, the rectangle would also have to resize and move around.

I remember seeing a list of plugins somewhere, I would assume if there is a plugin system than something like that is probably already done ( i.e. drawing shapes on the chart that resizes / adapts like the the price line and the area chart )

safaritrader commented 1 month ago

I would suggest that you could implement this with a LWC plugin.

Plugins would allow you to define a rectangle that drawn completely across the screen. The template example provided by create-lwc-plugin for a drawing primitive is a rectangle, and then you could add in some options to draw a gradient for the fill, and remove the logic for defining x coordinates and rather just plot from 0 until scope.mediaSize.width * scope.horizontalPixelRatio in the renderer code.

The tricky part is that the rectangle would have to work like the area, as in, when the chart is resized and moved around, the rectangle would also have to resize and move around.

I remember seeing a list of plugins somewhere, I would assume if there is a plugin system than something like that is probably already done ( i.e. drawing shapes on the chart that resizes / adapts like the the price line and the area chart )

im creating a full pure js plugin for lightweight chart. you can check this : https://github.com/safaritrader/lightweight-chart-plugin