我正在创建D3树。随着树节点的拖动,自动滚动在Firefox中不起作用。拖动树节点的自动滚动在Firefox中正常工作。它在Chrome中运行良好。
HTML代码
<div class="row">
<div class="tree-container" id="treeId"></div>
</div>
D3.js代码
var nodeEnter = node.enter().append("g").call(dragListener).attr(
"class", "node").attr("transform", function(d) {
return "translate(" + source.y0 + "," + source.x0 + ")";
}).on("mouseenter", nodeMouseEnter).on("mouseleave", nodeMouseLeave)
.on('click', click).attr('id', function(d) {
return d.nodeId;
});
$('.tree-container').css('overflow', 'auto');
Bootstrap.css
svg:not(:root) {
overflow: visible;
}
答案 0 :(得分:0)
var svg_scroll = d3.select("svg").node(),
$parent = $('.tree-container'),
$parent_document_height=$(document),
w = $parent.width(),
h = $parent_document_height.height(),
sL = $parent.scrollLeft(),
sT = $parent_document_height.scrollTop();
var coordinates = d3.mouse(svg_scroll),
x = coordinates[0],
y = coordinates[1];
if (x > w + sL) {
$parent.scrollLeft(x - w);
} else if (x < sL) {
$parent.scrollLeft(x);
}
if (y > sT) {
$parent_document_height.scrollTop(y);
} else if (y < sT) {
$parent_document_height.scrollTop(y);
}
d3.select(this).attr({
x: x - 50,
y: y - 25
});