实时更新D3强制布局CSS

时间:2015-07-21 01:09:56

标签: javascript css angularjs d3.js knockout.js

我基于D3力布局构建实时可视化。我能够从一组初始节点/边缘数据生成力布局。然而,节点/边缘数据保持经历实时变化,并且我需要相应地更新所选图形节点/边缘的各种CSS属性 - 例如:在时间t1,节点n1的填充颜色可能需要被改变为橙色在t2处,边缘e1可以改变笔划宽度等

实现此类系统的一个选项是在每次更新时重绘整个图形。然而,这是低效的,因为

  1. 图表的结构永远不会改变。只有与组件关联的CSS属性可能会更改
  2. 经常重新绘制图表会使可视化非常缓慢且无响应。
  3. 所以,我一直在寻找数据绑定选项,我最初可以利用d3绘制图形,然后使用数据绑定框架/库(如Angular / Knockout)来绑定节点的CSS属性/边缘到后端数据模型。但是,我找不到任何采用这种策略的有用参考/示例。

    我过去使用过D3。但是,我是Angular和Knockout的新手。

    问题

    1. 在这种情况下哪种数据绑定选项最佳?
      角/淘汰赛的/ etc。
    2. 是否有任何实现类似内容的示例/参考代码?
    3. 提前致谢

0 个答案:

没有答案