theme:smartblue我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第2篇文章，点击查看活动详情本文简介点赞+关注+收藏=学会了AntVG6是一个图可视化引擎。它提供了图的绘制、布局、分析、交互、动画等图可视化的基础能力。本文主要讲解使用AntVG6实现拖拽生成节点的功能，如下图所示。本文使用Vue3做基础框架，配合G6实现上图效果。分析在动手编码之前需要先对使用场景做一个分析。需要考虑的情景1、画布可能不是全屏的在真实项目中，使用G6做的拓扑图，画布有可能不是全屏的，很大可能有左侧导航栏、顶部区域，甚至还有也叫区域等等呢个。此时需要考虑鼠标所在的屏幕坐标和画布坐标的转换。2、

效果展示在线预览源码SVG介绍阮一峰：SVG图像入门SVGtutorial因为antv/x6是基于SVG的图编辑器，所以SVG的知识有必要了解下的简介可缩放矢量图形【基于图形】全称：ScalableVectorGraphics定义基于矢量的图形基于XML语法放大缩小不会失真属于万维网标准可以插入DOM，通过JavaScript和CSS来操作语法svgwidth=“200”height=“200”viewBox=“-100-100200200”> polygonpoints="0,080,120-80,120"fill="#234236"/>polygonpoints="0,-4060,60-

效果展示在线预览源码SVG介绍阮一峰：SVG图像入门SVGtutorial因为antv/x6是基于SVG的图编辑器，所以SVG的知识有必要了解下的简介可缩放矢量图形【基于图形】全称：ScalableVectorGraphics定义基于矢量的图形基于XML语法放大缩小不会失真属于万维网标准可以插入DOM，通过JavaScript和CSS来操作语法svgwidth=“200”height=“200”viewBox=“-100-100200200”> polygonpoints="0,080,120-80,120"fill="#234236"/>polygonpoints="0,-4060,60-