本文整理汇总了TypeScript中vis.Network类的典型用法代码示例。如果您正苦于以下问题：TypeScript Network类的具体用法？TypeScript Network怎么用？TypeScript Network使用的例子？那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了Network类的7个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。
示例1: drawGraph
//.........这里部分代码省略.........
highlight: {
background: "#07f968",
border: "#3c3c3c"
}
},
borderWidth: 2,
borderWidthSelected: 2,
}
},
nodes: {
borderWidth: 8,
borderWidthSelected: 8,
color: {
border: "#39c0ba",
background: "#FFF",
highlight: {
border: "#FF0",
background: "#FFF"
},
hover: {
border: "#F00",
background: "#FFF"
},
},
shadow: true,
},
physics: {
enabled: false,
},
};
network = new vis.Network(container, bsData, options);
getAllCommits(function(commits) {
processGraph(commits);
});
network.on("stabilizationIterationsDone", function () {
network.setOptions( { physics: false } );
});
network.on("doubleClick", function(callback) {
if (callback.nodes[0] === undefined) {
return;
} else {
let nodeId: number = callback.nodes[0];
}
let moveOptions = {
offset: {x: 0, y: 0},
scale: 1,
animation: {
duration: 1000,
easingFunction: "easeInOutQuad",
}
};
network.focus(callback.nodes[0], moveOptions);
}, false);
let flag = "basic";
network.on("zoom", function(callback) {
let moveOptions = {
开发者ID:ElliotWhiley，项目名称:VisualGit，代码行数:67，代码来源:graphSetup.ts
示例2:
this.diagram.on('oncontext', (({event, pointer}: {event: MouseEvent, pointer: {[key: string]: any}}) => {
event.preventDefault();
const { x, y } = pointer.DOM;
const nodeId = this.diagram.getNodeAt({x, y}) as string;
const edgeId = this.diagram.getEdgeAt({x, y}) as string;
if (nodeId || NodeGroup.isGroupKey(edgeId)) {
return;
}
edgeId ? (
this.outContextClickLink.emit({
key: edgeId,
coord: {
coordX: x,
coordY: y
}
})
) : (
this.outContextClickBackground.emit({
coordX: x,
coordY: y
})
);
}));
开发者ID:young891221，项目名称:pinpoint，代码行数:25，代码来源:server-map-diagram-with-visjs.class.ts
示例3: setEvent
private setEvent(): void {
this.diagram.on('afterDrawing', () => {
if (!this.serverMapData) {
return;
}
this.outRenderCompleted.emit();
});
this.diagram.on('click', (({nodes, edges}: {nodes: string[], edges: string[]}) => {
const isNodeClicked = nodes.length !== 0;
const isEdgeClicked = !isNodeClicked && edges.length !== 0;
const isBackgroundClicked = !(isNodeClicked || isEdgeClicked);
if (isNodeClicked) {
const nodeId = nodes[0];
const nodeData = this.getNodeData(nodeId);
this.outClickNode.emit(nodeData);
} else if (isEdgeClicked) {
const edgeId = edges[0];
const linkData = this.getLinkData(edgeId);
this.outClickLink.emit(linkData);
} else if (isBackgroundClicked) {
this.outClickBackground.emit();
}
}));
this.diagram.on('hoverNode', () => this.changeCursor('pointer'));
this.diagram.on('hoverEdge', () => this.changeCursor('pointer'));
this.diagram.on('blurNode', () => this.changeCursor('default'));
this.diagram.on('blurEdge', () => this.changeCursor('default'));
this.diagram.on('oncontext', (({event, pointer}: {event: MouseEvent, pointer: {[key: string]: any}}) => {
event.preventDefault();
const { x, y } = pointer.DOM;
const nodeId = this.diagram.getNodeAt({x, y}) as string;
const edgeId = this.diagram.getEdgeAt({x, y}) as string;
if (nodeId || NodeGroup.isGroupKey(edgeId)) {
return;
}
edgeId ? (
this.outContextClickLink.emit({
key: edgeId,
coord: {
coordX: x,
coordY: y
}
})
) : (
this.outContextClickBackground.emit({
coordX: x,
coordY: y
})
);
}));
}
开发者ID:young891221，项目名称:pinpoint，代码行数:57，代码来源:server-map-diagram-with-visjs.class.ts
示例4: selectNodeBySearch
selectNodeBySearch(selectedAppKey: string): void {
let selectedNodeId = selectedAppKey;
const isMergedNode = !this.isNodeInDiagram(selectedAppKey);
if (isMergedNode) {
const groupKey = selectedAppKey.split('^')[1];
const selectedMergedNode = this.serverMapData.getNodeList().find(({key}: {key: string}) => {
return NodeGroup.isGroupKey(key) && key.includes(groupKey);
});
selectedNodeId = selectedMergedNode.key;
}
this.diagram.focus(selectedNodeId);
this.setNodeClicked(selectedNodeId);
}
开发者ID:young891221，项目名称:pinpoint，代码行数:16，代码来源:server-map-diagram-with-visjs.class.ts
示例5: clear
clear(): void {
this.diagram.destroy();
}
开发者ID:young891221，项目名称:pinpoint，代码行数:3，代码来源:server-map-diagram-with-visjs.class.ts
示例6: setNodeClicked
private setNodeClicked(key: string): void {
this.diagram.selectNodes([key]);
this.outClickNode.emit(this.getNodeData(key));
}
开发者ID:young891221，项目名称:pinpoint，代码行数:4，代码来源:server-map-diagram-with-visjs.class.ts
示例7: isNodeInDiagram
private isNodeInDiagram(key: string): boolean {
return this.diagram.findNode(key).length !== 0;
}
开发者ID:young891221，项目名称:pinpoint，代码行数:3，代码来源:server-map-diagram-with-visjs.class.ts
注：本文中的vis.Network类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。 |
客服电话
APP下载
官方微信
请发表评论