渲染在bootstrap旋转木马里面的散景控制

Question

我在自举旋转木马上有散景图，但散景控件显示在旋转木马控件的右侧。如果没有自举旋转木马，散景图可以根据需要渲染，散景控件可以直接绘制到图中。

如何强制散景控件位于旋转木马内部，向右冲洗到情节？

这是一个屏幕截图，显示右上方的散景控件（红色矩形和箭头覆盖显示我希望控件的位置）：

以下是一个例子：

http://htmlpreview.github.io/?https://github.com/jdimatteo/flask_bokeh_app/blob/carousel/bokeh_carousel.html

小提琴：https://jsfiddle.net/ddrh3tx9/

这是旋转木马内部：

        <div class="carousel-inner" role="listbox">
            <div class="item active" align="center">
                <h1>1</h1>
                <div class="bk-root">
                    <div class="plotdiv" id="327a612d-5699-4f1e-80bb-5acab5228f0a"></div>
                </div>
            </div>
            <div class="item" align="center">
                <h1>2</h1>
            </div>
        </div>

Answer 1

一种方法是添加：

<强> CSS ：

.bk-toolbar-wrapper.bk-layout-null{
      left: 100% !important;
      position: absolute;
}

小提琴：https://jsfiddle.net/znqwu0c0/

根据屏幕尺寸的不同，有时候，散景控件可以在旋转木马控制下，所以为了让它们可以点击，你可以将它添加到你的旋转木马内部类：

<强> CSS

.carousel-inner{z-index: 1000;}

小提琴：https://jsfiddle.net/znqwu0c0/1/