0

I've tried many things but I can't get this code to render. Unfortunately, it only appears as a string in the browser.

The variable "html code" contains the code that the Tradingview chart is displayed, but it only appears as a string.

Does somebody has any idea?

import dash
from dash import html
import dash_bootstrap_components as dbc

app = dash.Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

html_code = '''
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
  <div id="tradingview_8906e"></div>
  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-AAPL/" rel="noopener" target="_blank"><span class="blue-text">AAPL stock 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(
  {
  "autosize": true,
  "symbol": "NASDAQ:AAPL",
  "interval": "D",
  "timezone": "Etc/UTC",
  "theme": "light",
  "style": "1",
  "locale": "en",
  "toolbar_bg": "#f1f3f6",
  "enable_publishing": false,
  "allow_symbol_change": true,
  "container_id": "tradingview_8906e"
}
  );
  </script>
</div>
<!-- TradingView Widget END -->
'''

container = html.Div(html_code)

column = dbc.Col(
    [
        container
    ]
)

app.layout = html.Div([
    dbc.Container(
        [
            dbc.Row(
                [
                    column,
                ]
            ),
        ]
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)
Progman
  • 16,827
  • 6
  • 33
  • 48
Chris0815
  • 69
  • 6

2 Answers2

0

I've been researching and I think I've found the answer. The solution is a "html.Iframe" Object. Looks like it is working, just have to mess around with the size.

Chris0815
  • 69
  • 6
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 26 '22 at 20:23
-1

To render HTML in Python Dash using Bootstrap components, you can use the dbc.Jumbotron component provided by the dash-bootstrap-components library.

python
  • 1