angularjs - 需要帮助在 angularjs 中使用 visjs 创建网络图

标签 angularjs angularjs-directive plunker vis.js

我需要帮助来制作 this plunker做类似 this vis example 的事情在 AngularJS 中。

我正在使用<vis-network data="data" options="options"></vis-network>标签和下面的数据和选项

数据

var nodes = [
  {id: 1, label: 'Node 1'},
  {id: 2, label: 'Node 2'},
  {id: 3, label: 'Node 3'},
  {id: 4, label: 'Node 4'},
  {id: 5, label: 'Node 5'}
];
var edges = [
  {from: 1, to: 3},
  {from: 1, to: 2},
  {from: 2, to: 4},
  {from: 2, to: 5}
];
$scope.data = VisDataSet({
  nodes: nodes,
  edges: edges
});

选项

$scope.options = {
  autoResize: true,
  height: '100%',
  width: '100%'
};

没有控制台错误,我错过了什么。请帮忙。

最佳答案

您的数据是普通对象,但是nodesedges应该是VisDataSet的对象

var nodes = VisDataSet([
  {id: 1, label: 'Node 1'},
  {id: 2, label: 'Node 2'},
  {id: 3, label: 'Node 3'},
  {id: 4, label: 'Node 4'},
  {id: 5, label: 'Node 5'}
]);
var edges = VisDataSet([
  {from: 1, to: 3},
  {from: 1, to: 2},
  {from: 2, to: 4},
  {from: 2, to: 5}
]);
$scope.data = {
  nodes: nodes,
  edges: edges
};

我已经更新了您的plunker here .

关于angularjs - 需要帮助在 angularjs 中使用 visjs 创建网络图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31019327/

相关文章:

angularjs - 使用 ng-show/hide 时使用 {{}} 与不使用有什么区别

javascript - $watch 没有被解雇

javascript - angularjs 模板绑定(bind)

javascript - array.sort() 在 IE 11 中无法使用 compareFunction

javascript - AngularJS 简单示例在 Plunker 中不起作用

javascript - 为什么我的 Javascript 可以正常运行,但缩小后就不行了?

android - 失去对文本项目输入的关注后, ionic 项目选择在 android 上闪烁

angularjs - 使用 AngularJS 中的其他字段发送 FormData

javascript - 指令内动态 ui-sref

angular - 即使从页面中删除了登录组件,Firefox 仍要求保存密码