Very serious bug in streamlit

I want to render tradingview html widget code in streamlit. I tried rendering throught various methods but the same problem is coming. The problem is that the half part of the chart is displayed. I tried changing width & height of both chart and streamlit html container but nothing happended the result was same. Can anyone pls help on this issue
Sample screenshot of how the half chart is displayed is below ::

Hi @Ashdeep_Singh, welcome to the Streamlit community!! :wave: :partying_face:

Could you please share a code snippet showing how you’ve tried to increase the height of the html container? That will help us in reproducing the issue.

Using the Technical Analysis “embed code” demo from the tradingview website, I was able embed the chart successfully in a Streamlit app with streamlit.components.v1.html(). Here’s the code and what the output looks like:

import streamlit as st
import streamlit.components.v1 as components

components.html(
    """
    <!-- TradingView Widget BEGIN -->
    <div class="tradingview-widget-container">
    <div id="technical-analysis"></div>
    <div class="tradingview-widget-copyright"><a href="https://in.tradingview.com/symbols/AAPL/" rel="noopener" target="_blank"><span class="blue-text">AAPL Chart</span></a> by TradingView</div>
    <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
    <script type="text/javascript">
    new TradingView.widget(
    {
    "container_id": "technical-analysis",
    "width": 998,
    "height": 610,
    "symbol": "AAPL",
    "interval": "D",
    "timezone": "exchange",
    "theme": "light",
    "style": "1",
    "toolbar_bg": "#f1f3f6",
    "withdateranges": true,
    "hide_side_toolbar": false,
    "allow_symbol_change": true,
    "save_image": false,
    "studies": [
        "ROC@tv-basicstudies",
        "StochasticRSI@tv-basicstudies",
        "MASimple@tv-basicstudies"
    ],
    "show_popup_button": true,
    "popup_width": "1000",
    "popup_height": "650",
    "locale": "in"
    }
    );
    </script>
    </div>
    <!-- TradingView Widget END -->
    """,
    height=1080, width=1920
)

Output:

Best, :balloon:
Snehan

2 Likes