不能在異步 Function 中使用變量？

Question

所以，我知道這一定是一個非常愚蠢的問題，但在 javascript 中並不是很好，所以我試圖在我的網站上插入 Tradingview 免費小部件，但問題是我不能在其中使用變量，因為它是異步的 function。

這是代碼

<script>var coinName = "XRP"</script>

所以我使用了 Tradingview 的 2 個腳本，第一個就是這個，它工作得很好。

<div class="tradingview-widget-container">
  <div id="tradingview_8e4c9"></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": "BINANCE:" + coinName + "USD",
  "interval": "D",
  "timezone": "Etc/UTC",
  "theme": "dark",
  "style": "1",
  "locale": "en",
  "toolbar_bg": "#f1f3f6",
  "enable_publishing": false,
  "allow_symbol_change": true,
  "container_id": "tradingview_8e4c9"

}
  );
  </script>
</div>

這是第二個代碼，我正在嘗試與上面的腳本完全相同，但它不起作用

<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
  <div class="tradingview-widget-container__widget"></div>
  <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/symbols/BTCUSD/technicals/" rel="noopener" target="_blank"><span class="blue-text">Technical Analysis for BTCUSD</span></a> by TradingView</div>
  <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-technical-analysis.js" async>
  {
  "interval": "1M",
  "width": 425,
  "isTransparent": false,
  "height": 450,
  "symbol": "BINANCE:" + coinName + "USD",
  "showIntervalTabs": true,
  "locale": "en",
  "colorTheme": "dark",
  "largeChartUrl": "http://#"
}
  </script>
</div>
<!-- TradingView Widget END -->

第二個代碼在控制台中給出 2 個錯誤，

小部件設置解析錯誤：SyntaxError: Unexpected token + in JSON at position 105

和

提供的設置無效，回退到默認值

那么我該如何實現呢？

Answer 1

@CrisG 的回答解決了這個問題

讓它工作：jsfiddle.net/khrismuc/3s5rn1bg