带有d3.js的树形布局中的自定义html框 [英] custom html boxes in tree layout with d3.js

查看:52
本文介绍了带有d3.js的树形布局中的自定义html框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个要求,我必须开发类似于d3.js树形布局的树形布局.但是我想要带有自定义内容的HTML框,而不仅仅是节点.我花了很多时间来尝试使用d3.js进行搜索,但是我停留在这个时间点上,无法继续.

I have a requirement where I have to develop a tree layout similar to what is given by d3.js tree layout. But I want html boxes with custom content rather than just nodes. I have spent lot of time trying to find if its possible with d3.js but I am stuck at this point of time and unable to proceed.

数据将是动态的

如果有其他可行的解决方案/框架可用,则不必是d3.js.但是预期的功能类似于d3所提供的功能,即扩展,折叠节点.

It does not have to be d3.js if there are any other viable solution/framework available. But the functionality expected is similar to what is provided by d3 ie- expanding, collapsing nodes.

任何指针都将受到高度赞赏.

Any pointers will be highly appreciated.

推荐答案

您可以通过使用基本情况就是这样:

<foreignObject requiredExtensions="http://www.w3.org/1999/xhtml">
  <body xmlns="http://www.w3.org/1999/xhtml">
    <p>Some text</p>
  </body>
</foreignObject>

这是一个更完整的示例: http://jsfiddle.net/thudfactor/bK6VD/

Here is a more complete example : http://jsfiddle.net/thudfactor/bK6VD/

您使用 d3 根据您的数据生成 foreignObject 内容.

You use d3 to generate the foreignObject content based on your data.

这篇关于带有d3.js的树形布局中的自定义html框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆