zoomable circle packing持久工具提示

时间:2014-09-17 22:21:10

标签: javascript jquery css d3.js tooltipster

受纽约时报奥巴马预算展示(http://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html?_r=0)的启发,以及D3示例页面上的可缩放圈子包装示例,我受到启发,指导我们的实习生开发基于网络的界面,用于导航数据集。我们(主要是他)可以获得圆形打包功能来绘制层次结构,放大和缩小,因此数据正常工作。我们想要添加的是能够悬停或点击圆形标题(而不是点击圆形体)来显示交互式工具提示(我个人偏向于此处显示的那个:http://iamceege.github.io/tooltipster/)。

在非常粗略的伪代码中,我们正在寻找类似的东西:

on page load, draw hierarchical circles, label the outermost layer (top nodes)
on circle.body.click, zoom in; show node labels
on circle.body.rightclick, zoom out, adjust node label display accordingly

(I have no idea if rightclick is an appropriate event)

on circle.title.hover, display tooltip
on tooltip.object.click, take appropriate action (varies by tooltip part)

你可能已经猜测过,我不是JavaScript程序员;我为这里的肮脏方法喋喋不休地道歉。我们的实习生有一定的技术水平,但正在挣扎。我觉得我们只是在这里取得成功的一些方便提示。

非常感谢任何帮助。

干杯。

J.D。

0 个答案:

没有答案