I'm trying to add Trading view charts to my Vue.js project but I cant find a way to use it. Here's the html tag can anyone help me on how to use it?
<div class="tradingview-widget-container">
<div id="tradingview_bf88f"></div>
<div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/NASDAQ-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(
{
"width": 980,
"height": 610,
"symbol": "NASDAQ:AAPL",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "dark",
"style": "1",
"locale": "en",
"toolbar_bg": "#f1f3f6",
"enable_publishing": false,
"allow_symbol_change": true,
"container_id": "tradingview_bf88f"
}
);
</script>
</div>
You can use this vue js components for tradingview real-time chart widget. I think this is exactly what you want.
Updated Answer:
Please pay attention that in current version of this component (1.0.1) there is a bug in documentation. You should import this component like this:
import VueTradingView from 'vue-trading-view/src/vue-trading-view';