iview 绘制流程图

功能:实现这个功能纯前端,可根据后端的数据动态渲染。 

实现方式:vue2/vue3都可以,本人是vue2实现的。

实现步骤:

        1.引入框架

        2.封装组件

        3.界面使用

引入框架

1.路径  /public/static/index.html

<script src="<%= BASE_URL %>static/meta/meta2d.js"></script>

2.创建meta2d.js 路径再 /public/static/meta/meta2d.js

这里面的代码是 npm i  meta2d.js 把里面的代码复制出来放入meta2d.js

封装组件

路径 /src/components/flow/draw.vue

代码

<template>
  <div
    id="topology2"
    class="topology"
    :style="{ height: height, width: '100%' }"
  >
    <!-- 画布 @click="onTouchstart($event) height: 

猜你喜欢

转载自blog.csdn.net/weixin_42066070/article/details/130386327