功能:实现这个功能纯前端,可根据后端的数据动态渲染。
实现方式: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: