vue中echarts关系图动态增删节点以及连线方式_vue.js_

//假设你已经渲染了关系图 test() { let option = this.chart.getOption() //获取option配置项 //START增加节点，假设根据id连线 // option.series[0].data.push({name: '测试节点', category: 1, id: 6, des: '测试描述'}) // option.series[0].links.push({source: 0, target: 6, name: '测试连线'}) //END //删除节点START let data = option.series[0].data //获取节点数据 let link = option.series[0].links //获取边的数据 let flag = -1 for(let i = 0; i

layout: "force", force: { repulsion: [-2, 100], //节点之间的斥力因子。支持数组表达斥力范围，值越大斥力越大。 gravity: 0.03, //节点受到的向中心的引力因子。该值越大节点越往中心点靠拢。 edgeLength: [20, 200], //边的两个节点之间的距离，这个距离也会受 repulsion:[10, 50]值越小则长度越长 layoutAnimation: false, }, 

import { debounce } from "@/utils/utils.js"; export default { data() { return {}; }, mounted() { this.initListener(); }, beforeDestroy() { this.destroyListener(); }, deactivated() { this.destroyListener(); }, methods: { initListener() { window.addEventListener("resize", debounce(this.resize, 100)); }, destroyListener() { window.removeEventListener("resize", this.resize); }, resize() { const { myChart } = this; myChart && myChart.resize(); }, }, };