动态展示线路图组件 Vizceral

• 授权协议: Apache
• 开发语言: JavaScript
• 操作系统: 跨平台
• 软件首页: https://github.com/Netflix/vizceral
• 软件文档: https://github.com/Netflix/vizceral/blob/master/README.md
• 官方下载: https://github.com/Netflix/vizceral/archive/master.zip

软件介绍

Vizceral是一组采用WebG标准实现的动态展示线路图组件，可以实现数据的查看以及交互。分为全局、部分区域、水平三个维度，使数据更为直观明了的展示。

此组件可以采取多个流量图，并将生成一个“全局”图，显示所有传入的流量到每个“区域”，支持跨区域通信。

使用：

如果使用 React 或者 web 组件，可参看以下两个项目：

• React: http://www.oschina.net/p/vizceral-react

• Web 组件: http://www.oschina.net/p/vizceral-component

或者从零开始：

npm install vizceral --save

import Vizceral from 'vizceral';
const viz = new Vizceral();

// Add event handlers for the vizceral events
viz.on('viewChanged', view => {});
viz.on('nodeHighlighted', node => {});
viz.on('rendered', data => {});
viz.on('nodeContextSizeChanged', dimensions => {});

// Sample data
viz.updateData({
  name: 'us-west-2',
  renderer: 'global',
  nodes: [
    {name: 'INTERNET'},
    {name: 'service'}
  ],
  connections: [
    {
      source: 'INTERNET',
      target: 'service',
      metrics: { normal: 100, warning: 95, danger: 5 },
      metadata: { streaming: true }
    }
  ]
});
viz.setView();
viz.animate();

本文地址：https://codercto.com/soft/d/9587.html