@antv/x6 导出图片下载,或者导出图片为base64由后端去处理。

1、导出为文件的格式,比如 PNG

复制代码
graph.exportPNG(
      function (dataURL) {
        console.log(dataURL);
        let img = document.getElementById('img') as HTMLImageElement;
        img.src = dataURL;
      },
      {
        backgroundColor: '#fff',
        padding: [20, 20, 20, 20],
        quality: 1,
        width: graph.options.width,
        height: graph.options.height,
      },
    );

导出的时候,会弹出文件下载,或者自动下载文件。

2、导出为base64格式的图片

这个只要把1中的方法名称调换下就可以了。

3、这里面只可以导出背景色,不能导出图片背景。

4、官方地址:https://x6.antv.antgroup.com/tutorial/plugins/export#graphtosvg

相关推荐
sowhat882 小时前
Vue3+vite+Ts+pinia—第八章 生命周期
vue.js
这是个栗子2 小时前
【Vue代码分析】 import.meta.env.DEV:现代前端工程中的环境变量
前端·javascript·vue.js·环境变量
乌夷5 小时前
Vue.js 3 的设计思路
前端·javascript·vue.js
前端之虎陈随易15 小时前
编程语言级别的Skill市场,AI Agent 的未来形态
前端·vue.js·人工智能·typescript·node.js
格子软件18 小时前
2026年GEO贴牌代理:分布式多级分账状态机源码深度解构
java·vue.js·分布式·vue·geo
之歆18 小时前
Vue商品详情与放大镜组件
前端·javascript·vue.js
奶油mm1 天前
公司技术债堆积如山,我一人之力用 Vue3 偷换了整个前端架构
前端·vue.js
格子软件1 天前
2026年分布式GEO代理流量调度:源码级状态机防重挂实战
java·vue.js·人工智能·spring boot·分布式·vue
前端炒粉1 天前
个人简历面经总结二
前端·网络·vue.js·react.js·面试
格子软件1 天前
2026年分布式GEO代理架构:多租户动态数据源隔离与流控源码解构
java·vue.js·人工智能·分布式·架构·vue·geo