is it possible to add another candle or rectangle series

[pannet1]

Question

i want to plot a renko brick on top regular candlestick. i see there is a box drawing. can the box (rectangle) be plotted as a series (just like a candle) from a streaming data. (ticks). i understand renko is not dependent on time. just for our purpose, we will assume that the renko width will stretch till it is complete. Also we will still be able to plot the same if the candles have grown and the chart is auto refreshed.

Code example

import pandas as pd
from time import sleep
from lightweight_charts import Chart
import streaming_indicators as si

if __name__ == "__main__":
    df1 = pd.read_csv("ohlc.csv", parse_dates=["time"])
    df2 = pd.read_csv("ticks.csv", parse_dates=["time"])

    # For brick size using ATR
    atr_period = 11
    ATR = si.ATR(atr_period)
    brick_size = 2
    Renko = si.Renko()

    chart = Chart()
    chart.set(df1)
    chart.show()

    last_bar_time = df1["time"].max()  # Get the last OHLC bar time

    for _, tick in df2.iterrows():
        if tick["time"] < last_bar_time:
            print(f"Skipping tick {tick['time']} (before last bar {last_bar_time})")
            continue  # Avoid early ticks

        chart.update_from_tick(tick)
        """
        atr_period = ATR.update(tick)
        print(atr)
        """
        bricks = Renko.update(tick["price"], brick_size)
        print(bricks)
        sleep(0.5)

[emma-uw]

You can try using CustomCandlestick implementation from @EsIstJosh's fork https://github.com/EsIstJosh/lightweight-charts-python/tree/main. I use variation of it to highlight different sessions for example.

[pannet1]

thank you so much for the interim help. i could not even complete ohlc for lightweight-charts (js) with the examples given. the learning curve seems to be too much. moved forward with this python version, but somehow got struck up again. i will post my solution here for the benefit of the community.

thanks once again. its very kind of you.

[EsIstJosh]

You could do this pretty easily actually, by editing my dynamic aggregation logic/method

(for the "BarDataAggregator" class : https://github.com/EsIstJosh/lightweight-charts-python/blob/main/src/ohlc-series/renderer.ts )

to include logic for how renko style charts operate in typescript.

You could get the projection candle rendering to work by adding a new shape ( ./shapes.ts ) and the options to style them separately ( ./ohlc-series.ts ).

[pannet1]

You could do this pretty easily actually, by editing my dynamic aggregation logic/method

(for the "BarDataAggregator" class : https://github.com/EsIstJosh/lightweight-charts-python/blob/main/src/ohlc-series/renderer.ts )

to include logic for how renko style charts operate in typescript.

You could get the projection candle rendering to work by adding a new shape ( ./shapes.ts ) and the options to style them separately ( ./ohlc-series.ts ).

looks awesome bro. looks lot like lack of skill issue on my side. let me see.

[EsIstJosh]

Thanks man, appreciate it. I'm sure u can figure it out; I'm new to this too so I relied on chatGPT pretty heavily for that portion of the project. slowly getting more familiar with it.

If you get stuck or run into issues I'm glad to help

[pannet1]

@emma-uw @EsIstJosh if you could add one example of how the ts classes are converted into javascript, then called into webview, which inturn is rendered with python, it will be of great help.

[emma-uw]

@emma-uw @EsIstJosh if you could add one example of how the ts classes are converted into javascript, then called into webview, which inturn is rendered with python, it will be of great help.

Hey, for my project I cloned the repo, then installed it with pip install -e path/to/lightweight-charts-python/lightweight_charts/. Then I think you need to run npm install to install the modules. Then you can use build.sh to compile the library sources (ts -> js) after making changes to it. I am on windows so I use this powershell script that does the same thing

Remove-Item dist/bundle.js -Recurse
Remove-Item dist/typings/ -Recurse
npx rollup -c rollup.config.js
Copy-Item dist/bundle.js lightweight_charts/js
Copy-Item src/general/styles.css lightweight_charts/js

I think there was something else as well to make it work like putting pre-built ligthweight-charts files into lightweight-charts-python\node_modules\lightweight-charts\dist, but maybe it was related to adjusting ligthweight-charts itself and not the python lib. Sadly I don't remember atm. Also maybe there is an easier way to do all of that, but I just went with whatever worked for me when 2.0 released.

[pannet1]

@emma-uw @EsIstJosh if you could add one example of how the ts classes are converted into javascript, then called into webview, which inturn is rendered with python, it will be of great help.

Hey, for my project I cloned the repo, then installed it with pip install -e path/to/lightweight-charts-python/lightweight_charts/. Then I think you need to run npm install to install the modules. Then you can use build.sh to compile the library sources (ts -> js) after making changes to it. I am on windows so I use this powershell script that does the same thing

Remove-Item dist/bundle.js -Recurse
Remove-Item dist/typings/ -Recurse
npx rollup -c rollup.config.js
Copy-Item dist/bundle.js lightweight_charts/js
Copy-Item src/general/styles.css lightweight_charts/js

I think there was something else as well to make it work like putting pre-built ligthweight-charts files into lightweight-charts-python\node_modules\lightweight-charts\dist, but maybe it was related to adjusting ligthweight-charts itself and not the python lib. Sadly I don't remember atm. Also maybe there is an easier way to do all of that, but I just went with whatever worked for me when 2.0 released.

thank you aain. i will figure it out and let know how it goes.