fix: Improve the flowChart component

This commit is contained in:
xiaoxian521
2021-04-17 00:35:12 +08:00
parent 5ec1f62f8d
commit ba41753d77
7 changed files with 195 additions and 235 deletions

View File

@@ -1,60 +0,0 @@
<template>
<div id="container"></div>
</template>
<script lang='ts'>
import LogicFlow from "@logicflow/core";
import "@logicflow/core/dist/style/index.css";
import { onMounted } from "vue";
const data = {
// 节点
nodes: [
{
id: 50,
type: "rect",
x: 100,
y: 150,
text: "你好",
},
{
id: 21,
type: "circle",
x: 300,
y: 150,
},
],
// 边
edges: [
{
type: "polyline",
sourceNodeId: 50,
targetNodeId: 21,
},
],
};
export default {
setup() {
onMounted(() => {
const lf = new LogicFlow({
container: document.querySelector("#container"),
stopScrollGraph: true,
stopZoomGraph: true,
width: 500,
height: 500,
grid: {
type: "dot",
size: 20,
},
});
lf.render(data);
});
return {};
},
};
</script>
<style scoped>
</style>