metricflow实现一个可拖拽的流程图图表效果代码
代码语言:html
所属分类:图表
代码描述:metricflow实现一个可拖拽的流程图图表效果代码
代码标签: metricflow 拖拽 流程图 图表
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
</style>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/metricflow.min.js"></script>
<script>
window.onload = function () {
let metricFlow = MetricFlow("graph")
/*定义节点数据*/
let node1Data= {
"id":"primaryKey1",
"title":{'name':"A系统日志"},
"data":[
{'name':'描述:从A系统抽取日志'},
{'name':'抽取频率:一天一次'},
{'name':'平均耗时:10s'},
{'name':'状态:正常'}
]
};
let node1 = metricFlow.createNode(node1Data,30,100);
let node2Data= {
"id":"primaryKey2",
"title":{'name':"B系统日志",'background-color':'red'},
'border-color':'red',
"data":[
{'name':'描述:从B系统抽取日志'},.........完整代码请登录后点击上方下载按钮下载查看
网友评论0