Skip to content

Latest commit

 

History

History
128 lines (72 loc) · 2.43 KB

README.md

File metadata and controls

128 lines (72 loc) · 2.43 KB
Raw

TrafficFlow

基于 vizceral 封装的微服务可视化组件。

安装

npm i traffic-flow

使用

import TrafficFlow from 'TrafficFlow'
Vue.use(TrafficFlow)

属性

definitions

  • type：Object
  • description：Object map of definitions.

filters

  • type：Array
  • description：Array of filter definitions and current values to filter out nodes and connections.

match

  • type：String
  • description： A search string to highlight nodes that match

modes

  • type：Object
  • description： Map of modes to mode type, e.g. { detailedNode: 'volume' }

objectToHighlight

  • type：Object
  • description：Pass in an object to highlight

showLabels

  • type：Boolean
  • description：Whether or not to show labels on the nodes.

allowDraggingOfNodes

  • type：Boolean
  • description：Nodes can be repositioned through dragging if and only if this is true.

styles

  • type：Object
  • description：Styles to override default properties.

traffic

  • type：Object
  • description：The traffic data.

targetFramerate

  • type：Number
  • description：Target framerate for rendering engine.

view

  • type：Array
  • description：Current view.

事件

connectionHighlighted

连接高亮时触发

nodeHighlighted

节点高亮时触发

nodeUpdated

节点更新时触发

nodeContextSizeChanged

节点上下文发生改变时触发

matchesFound

每当通过 findNode（） 查询节点时，都会触发 matchesFound 事件。

objectHighlighted

每当对象高亮显示时，都会触发该事件。object.type 是 node 或 connection

objectHovered

每当鼠标悬停在 "node" 或 "connection" 上时，都会触发该事件。object.type 是 node 或 connection。如果其他"node"或"connection"已处于焦点（由于单击/突出显示事件），则不会触发此事件。

updateStyles

更新全局样式

viewChanged

视图发生更改时触发

viewUpdated

每当当前显示的图形视图更新时，都会触发

License

Apache 2.0