如何在D3中创建可调整大小且可移动的TitleWindow?

时间:2013-11-15 03:23:16

标签: javascript html css d3.js crossfilter

我想在Flex中创建一个类似于Panel / TitleWindow的组件,但是使用D3。它应该是可调整大小和可移动的。

我想在其中包含一个条形图,其中我有左边的条形图和右边的条形图。但是,我希望能够通过拖动顶部的控件(标题区域)来更改标签的宽度。调整面板大小时,如果所有条形的高度都大于容器的高度(面板),则条形将相应地缩放(宽度)并显示垂直卷轴(如果需要)。

我使用SVG在D3中创建了一个可调整大小的可移动面板,但是如果我在里面包含条形图,我将无法在需要时包含滚动条(垂直)。因此,我正在寻找如何解决问题的想法。一种可能性是使用div制作panle。我不熟悉CSS,所以我不知道如何用div创建它。

satckoverflow不允许我在帖子中添加另一个链接,因此我没有将jsfiddle的链接包含在当前SVG实现中。

我需要这个,因为我正在创造一个D3& Crossfilter应用程序,其中每个维度将托管在面板上。而且由于每个维度的类别数量可以改变,甚至可以通过数据本身定义面板数量,我需要能够移动和调整面板大小。

我可以在http://mylinerider.com/D3/ImportExport.html看到该草案的实施草案。要过滤您需要单击条形图的数据,它可以按维度过滤多个类别并更改度量。但是,面板无法移动或缩放。

我在Flex中创建了一个示例,我想用D3 / JS为面板做些什么 - http://mylinerider.com/panel/

有什么建议吗?

0 个答案:

没有答案