javascriptlightweight-charts

TradingView Lightweight Charts add pane

I want to add multiple panes to my TV-Lightweight Chart, but I can't make it work.

There is this SO question: LightWeightChart: How can i add chart which look like this way?

which leads to this github issue https://github.com/tradingview/lightweight-charts/issues/50

in the hidden comments, there is a custom solution https://jsfiddle.net/adrianntf/6qea5ytv/ but I can't make it work. (I don't know what to do with the provided code, I tried to copy it, removed/replaced the chart creation at the end of the file with mine, but the chart doesn't show up while there are no errors and the chart object get initialized)

However, then there is this guy https://www.youtube.com/watch?v=NlHjhmIe1EI&t=424s who tells at 16:50 that one can add a pane by simply doing something like this:

const chart = LightweightCharts.createChart(domElement, {pane: 0});
const seriesOnNewPane = chart.addLineSeries({pane: 1});

He uses, just as me, the official lightweight-charts package:

<script
        type="text/javascript"
        src="https://unpkg.com/lightweight-charts/dist/lightweight-charts.standalone.production.js">
</script>

But it's not working, it ignores the pane kwargs and plots it on the main chart, not unlike in his video, where it adds a pane..

Does someone know how to make this work?

Solution

  • The youtuber is not using the official Lightweight Charts release. He is using a fork which has implemented support of multiple panes. He also talks about this in the end of the video.

    You need to use the same version as in the jsfiddle. I am using it and it works for me