D3 - 在svg中将滚动应用于图例容器的问题

时间:2017-07-21 20:28:00

标签: javascript angularjs d3.js

我是d3.js的新手,请帮助,我想将滚动应用到div,其中有svg和传说下面的图例,将根据多线图动态添加图例,用于演示我通过单个趋势线进行演示但实时在单个图表中会有10到20个趋势线。问题是传说,正在切断,我知道这是因为svg有高度限制,如何克服这个问题?,我试过应用overflow-y:滚动到svg但是没有工作,试过把foreignObject元素中的图例工作正常,但在IE中不起作用,我正在使用的应用程序主要在IE中运行。

非常感谢任何帮助。Plunker

1 个答案:

答案 0 :(得分:0)

看起来你的问题在于SVG本身的高度。尝试将SVG调整为更大的值,如:

d3.select('svg').attr('height', 600);

即使在控制台中尝试此操作。

SVG并没有真正的最大高度(据我所知)。问题是你的div比你的SVG(~370px)更高(400像素)。如果SVG大于div,根据您的y-overflow: scroll,它将是可滚动的,但会保留400 px高的外观(因为div)。但是,如果div大于SVG,则无法滚动。