在特定 div 中打开脚本.不是整个窗口

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 中。交易视图小部件似乎不允许您以编程方式仅更改图表的交易品种。

因此，要从不同的交易品种加载新数据，似乎我必须销毁图表并重新加载它。 通过做可以正常工作

     $('.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。它似乎取代了整个页面的整个正文，并制作了图表的整页视图。 虽然品种变化很好，但我需要它来替换div 内的当前图表。

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

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);
});