@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

相关推荐
踩着两条虫13 小时前
VTJ.PRO AI Agent 技术白皮书
前端·vue.js·低代码
java1234_小锋15 小时前
Vue3专题 - 列表渲染
vue.js
小锋java123418 小时前
【技术专题】Vue3 - 列表渲染
vue.js·vite
zho_uzhou20 小时前
ubuntu服务端运行vue网页步骤
linux·服务器·vue.js·ubuntu
滴滴答答哒1 天前
VUE3+element-plus MultiSelect 多选下拉组件
前端·javascript·vue.js
其美杰布-富贵-李1 天前
04 watch 与 Vue 响应式数据流
前端·javascript·vue.js
其美杰布-富贵-李1 天前
03 ref、reactive 与 computed 响应式数据
前端·javascript·vue.js
嘟嘟07171 天前
useRef + Web Worker:React 中的耗时计算不卡页面
javascript·vue.js
万敏1 天前
Vue3 全栈实战第五周:Vitest 单元测试从零搭建实战记录
vue.js·node.js·全栈
sugar__salt2 天前
跟着 Demo 学 Pinia:两种仓库写法 + 完整 TodoList 复现
前端·javascript·vue.js·前端框架·vue