需求描述:合并特定的图片和背景并保存到本地。安视G6自带的导出图片功能只能设置背景色。如果要背景图,需要将Antv保存的base64URL和使用canvas的背景图img结合起来,使用a标签模拟下载。陷阱:在Antv中,有两个API用于从画布上的元素生成图像的URL。您需要使用toFullDataURL,以便生成的图像具有宽度和高度。实际发现:savePicture(){this.graph.toFullDataURL((res)=>{varcanvas=document.getElementById('networkCanvas')varbackground=document.getElementById('networkBackground')varimg=newImage()img.onload=function(){//画图canvas.width=img.width+32canvas.height=img.height+32varctx=canvas.getContext('2d')ctx.fillStyle='#fff'ctx.fillRect(0,0,canvas.width,canvas.height)ctx.drawImage(background,0,0)ctx.drawImage(img,16,16)//下载varoA=document.createElement('a')oA.download='图片名称'oA.href=可以vas.toDataURL('image/png')document.body.appendChild(oA)oA.click()oA.remove()//下载后删除创建的元素}img.src=res},'image/png',{imageConfig:{填充:16,},})},
