ruby-on-rails - rails timelinejs 未在引导选项卡中正确加载

Question

我已将时间线编码（跟随https://github.com/NUKnightLab/TimelineJS）放置在引导选项卡中，如果将其放置在第一个选项卡（活动选项卡）中，则会正确加载，但如果将其放置在其余选项卡中，则其未正确加载，我已放置在第六个选项卡中

请帮我做什么

这是我的代码

<div class="tab-pane " id="tab6">
<script>
    $(document).ready(function() {
      createStoryJS({
            type:       'timeline',
            width:      '600',
            height:     '700',
            source:     '<%= @orbituarysite.id %>',
            embed_id:   'my-timeline'
        });
    });
</script>

 <div id="my-timeline"></div>
 </div>

如果我调整窗口大小或打开浏览器控制台，其加载正确

我尝试为此选项卡提供活动，并在页面末尾使用 jquery 隐藏和显示，但它没有用

请建议我一个解决方案。

Answer 1

这个问题目前在 TimelineJS 项目中有一个未解决的问题：https ://github.com/NUKnightLab/TimelineJS/issues/496

引用@gregorleban：

有同样的问题。在调用 createStoryJS 之前，您必须确保该选项卡可见。最好是有类似的东西：

setTimeout(function () {
    createStorylineJS();
    // make sure we create a storyline after the ui has actually updated and the sizes of the controls will be right
}, 100);

这种解决方法对我有用。您可能需要增加计时器。