将dc.js图表从SVG导出到PNG

我有一个dc.js图表，我想将其导出为PNG图像，使用：

函数保存（）{
var选项={}；
options.backgroundColor='#ffffff'；
options.selectorRemap=函数{返回s.replace（/\.dc-chart/g'，）；}；
var chart=document.getElementById（'chart'）.getElementsByTagName（'svg'）[0]；
saveSvgAsPng（图表，'chart.png'，选项）
}
风险值数据=[
{日期：1，服务：'ABC'，计数：100}，
{日期：2，服务：'ABC'，计数：80}，
{第4天，服务：'ABC'，计数：10}，
{日期：7，服务：'XYZ'，计数：380}，
{日期：8，服务：'XYZ'，计数：400}
];
var ndx=交叉滤波器（数据）；
var dim=ndx.dimension（函数（d）{return[d.service，d.day]；}）；
var grp=dim.group（）.reduceSum（函数（d）{返回d.count；}）；
grp=填充组（grp，d3.交叉（['ABC'，'XYZ']，d3.范围（1,9））；
var图表=直流系列图表（“图表”）
.宽度（500）
.高度（180）
.chart（函数（c）{返回dc.lineChart（c）.renderArea（true）.curve（d3.curveCardinal）；}）
.尺寸（dim）
.集团（grp）
.brushOn（错）
.seriesAccessor（函数（d）{返回d.key[0]；}）
.keyAccessor（函数（d）{返回d.key[1]；}）
.valueAccessor（函数（d）{return+d.value；}）
.x（d3.scaleLinear（））
.elasticX（真实）
.y（d3.scaleLinear（）.domain（[0450]））
.legend（dc.legend（）.水平（假）.x（60）.y（10））
.yAxisLabel（“计数”）
.render（）；
函数填充组（grupo、rango）{
返回{
全部：函数（）{
var resultados=grupo.all（）.slice（0）；
var encontrado={}；
resultados.forEach（函数（d）{
encontrado[d.key]=true；
});
rango.forEach（函数（d）{
如果（！encontrado[d]）{resultados.push（{key:d，value:0}）；}
});
返回resultados；
}
};
}
/*请忽略以下内容-这是缩小的SaveSvgAsPng库，
我还没有找到它的CDN*/
（function（）{const out$=typeof exports！='undefined'&&exports | | | | typeof define！='undefined'&&&{}| | | |此| | |窗口；if（typeof define！='undefined'）defined（（）=>out$）；const xmlns=）http://www.w3.org/2000/xmlns/“；const doctype=”；const urlRegex=/url\（[“”]？（.+？）[“”]？\）/；const fontFormats={woff2:'font/woff2'，woff:'font/woff'，otf:'application/x-font-opentype'，ttf:'application/x-font-ttf'，eot:'application/vnd.ms fontobject'，sfnt:'application/font-sfnt'，svg:'image/svg+xml'}；const-isElement=obj=>HTMLElement的obj实例| | obj-instanceof-SVGElement；const-requireDomNode=el=>如果（！isElement（el））抛出新错误（`HTMLElement或SVGElement是必需的；Get${el}`}；const isExternal=url=>url&&url.lastIndexOf（'http'，0）==0&&url.lastIndexOf（window.location.host）==-1；const getFontMimeTypeFromUrl=fontUrl=>{const formats=Object.keys（fontFormats）。过滤器（扩展名=>fontUrl.indexOf（`.${extension}）>0）。映射（扩展名=>fontFormats[extension]）；如果（格式）返回格式[0]；console.error（${fontUrl}的未知字体格式。字体可能无法正常工作。`）；返回'application/octet stream'}；const arrayBufferToBase64=buffer=>{let binary=''；const bytes=new Uint8Array（buffer）；for（let i=0；i{const v=（el.viewBox&&el.viewBox.baseVal&&el.viewBox.baseVal[dim]）|（clone.getAttribute（dim）！==null&&！clone.getAttribute（dim）.match（/%$/）&&parseInt（clone.getAttribute（dim））| el.getBoundingClientRect（）[dim]| parseInt（clone.style[dim]）| parseInt（window.getComputedStyle（el.getPropertyValue（dim））；返回类型v=='undefined'| v==null | | | | isNaN（parseFloat（v））=0:v）；const-getDimensions=>{width:width{124;}getDimension（el，clone，'width'），height:height}getDimension（el，clone，'height'）}；else-if（el.getBBox）{const{x，y，width，height}=el.getBBox（）；返回{width:x+width，height:y+height}}；const-reEncode data=>decodeURIComponent（enceuriconcomponent，data）。替换（/%（[0-9A-F]{2}）/g-match，p1=>{fromC=String.charl}）；返回c=='%'？“%25”：c}））；const uriToBlob=uri=>{const byteString=window.atob（uri.split（'，'）[1]）；const mimeString=uri.split（'，'）[0]。split（'：'）[1]。split（'；'）[0]
const buffer=new ArrayBuffer（byteString.length）；const intArray=new Uint8Array（buffer）；for（let i=0；i{if（！selector）return；try{return el.querySelector（selector）| el.parentNode&&el.parentNode.querySelector（selector）}catch（err）}console.warn（`Invalid CSS selector“${selector}”，err）}；const detectsfont=rule=>{const match=rule=>；const url=（match&&match[1]）if（！url | | url.match（/^data:/）| url=='about:blank'）return；const fullUrl=url.startsWith（'../'）？'${rule.href}/./${url}startsWith（'./'）？'${rule.href}/${url}/{url}:url；return text:rule.cstext，format:GetMimetypeFromfromUrl（'../'）），'/.'/$$url=fullySelectUrl}数组中的所有图像（'.'./}（'image'））.map（image=>{let href=image.getAttributeNS（'http://www.w3.org/1999/xlink“，”href'）| | | image.getAttribute（'href'）；if（！href）return Promise.resolve（null）；if（isExternal（href））{href+=（href.indexOf（'？'））====-1？'：'&'）+'t='+new Date（）.valueOf（）}
return new Promise（（resolve，reject）=>{const canvas=document.createElement（'canvas'）；const img=new Image（）；img.crossOrigin='anonymous'；img.src=href；img.onerror=（）=>reject（新错误（`canvas not load${href}'））；img.onload=（）>{canvas.width=img.width；canvas.height=img.height；canvas.height=img.getContext（'2d'）.drawImage（img，0,0）；Image.setAttributeNS('http://www.w3.org/1999/xlink“，”href'，canvas.toDataURL（'image/png'）；resolve（！0）}}}}）；const cachedFonts={}；const inlineFonts=font=>Promise.all（fonts.map（font=>new Promise（（resolve，reject）=>if（cachedFonts[font.url]）返回resolve（cachedFonts[font.url]）；const req=new XMLHttpRequest（）；req.addEventListener（'load'，（）”>{const fontInBase64=arrayBufferToBase64（req.response）；const fontUri=font.text.replace（urlRegex，`url（“数据：${font.format}；base64，${fontInBase64}”）`+'\n'；cachedFonts[font.url]=fontUri；resolve（fontUri）}）；req.addEventListener（'error'，e=>{console.warn（`未能从：${font.url}加载字体，e）；cachedFonts[font.url]=null；resolve}）；req.addEventListener（'abort'，e=>{console.warn（'Aborted loading font from:${font.url}'，e'）；resolve（null）}）；req.open（'
chart.select('g.chart-body').attr('clip-path',
     chart.select('g.chart-body').attr('clip-path').replace(/.*#/, 'url(#'))