在特定 div 中打开脚本。不完整 window

Question

我有一个在页面加载时加载的脚本，并将图表加载到 div。脚本直接放在 div 中，就像文档显示的那样。

               <div id="chart2" style='height:100%;'>
                  <script type="text/javascript">
                    var chart2 = new TradingView.widget({
                    "autosize": true,
                    "interval": "60",
                    "timezone": "Etc/UTC",
                    "locale": "en",
                    "toolbar_bg": "rgba(255, 255, 255, 1)",
                   });
                </script>
               </div>

图表直接加载到 div#chart2。 TradingView 小部件似乎不允许您以编程方式仅更改图表的符号。

所以要从不同的交易品种加载新数据，看来我必须销毁图表并重新加载它。通过

可以正常工作

     $('.chooseSymbol').click(function(){
           $('#chart2').html("");
           var symbol = $(this).data('symbol');
           var sc = '<script>var chart2 = new TradingView.widget({"autosize": true,"symbol": "POLONIEX:'+symbol+'","interval": "60","timezone": "Etc/UTC","theme": "White","style": "1","locale": "en","toolbar_bg": "rgba(255, 255, 255, 1)","enable_publishing": false,"hideideas": true});<\/script>';
           $("#chart2").append(sc);
      });

但是，这似乎并没有将其仅附加到#chart2。仿佛将整个页面的body全部替换掉，做成一个完整的页面视图的图表。虽然符号变化很好，但我需要它来替换 div.

内的当前图表

PS 我知道我可以允许交易视图下拉菜单，因此用户可以 select 他们的符号。但我希望用户只选择我在网站上允许的符号。因此我隐藏了符号输入并选择了这个选项。

Answer 1

该小部件似乎有一个 container_id 选项可以将图表嵌入特定的 DIV。所以尝试：

$('.chooseSymbol').click(function() {
    var symbol = $(this).data('symbol');
    var chart2 = new TradingView.widget({
        container_id: 'chart2',
        symbol: "POLONIEX:"+symbol, 
        "autosize": true,
        "interval": "60",
        "timezone": "Etc/UTC",
        "locale": "en",
        "toolbar_bg": "rgba(255, 255, 255, 1)",
    });
});

如果您不使用此选项，它会使用 document.write() 将小部件放置在当前位置，如果在加载文档后使用它，则会清除页面。

如果您只想更改现有图表中的交易品种，我认为有一种 setSymbol 方法。

$('.chooseSymbol').click(function() {
    var symbol = $(this).data('symbol');
    chart2.setSymbol("POLONIX:" + symbol);
});

在特定 div 中打开脚本。不完整 window

Opening a script in a specific div. Not whole window

javascript

tradingview-api