我正在尝试实现以下示例

http://bl.ocks.org/mbostock/4566102

对于大型图形,我只希望图形一旦用户将其拖动到当前边框之外就不会被截断并允许滚动。

我尝试将overflow:scroll属性添加到svg元素,但这似乎不起作用。
我是这个javascript / d3.js编程的新手,如果有人可以指出错误或只是向正确的方向指导我,我将非常高兴。

最佳答案

怎样使svg足够大,但是将其包装到带有overflow的smalle div中:自动?

html

<div class="outer">
    <div class="inner">
        <svg></svg>
    </div>
</div>


CSS:

.outer {
    width: 400px;
    height: 300px;
    overflow: auto;
}
.inner {
    width: 800px;
    height: 600px;
}
svg {
    display: block;
    width: 100%;
    height: 100%;
}


Demo

您可以将红色圆圈拖出可见区域。

10-05 20:33
查看更多