[英]SVG to PNG in javascript
我在将 svg 转换为 png(base64) 时遇到问题。 Svg 到 base64 工作正常,因为它在浏览器中显示得很好。 但是当我尝试加载图像时,它不会加载。 任何人都可能知道为什么?
var xml = new XMLSerializer().serializeToString(svg);
var svg64 = btoa(xml);
var b64start = 'data:image/svg+xml;base64,';
var image64 = b64start + svg64;
console.log(image64);
const img = new Image();
img.onload = function() {
const canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
const ctx = canvas.getContext('2d');
ctx.drawImage(img, 0, 0);
const dataBase64 = canvas.toDataURL('image/png');
console.log(dataBase64);
generatePowerpoint(response, dataBase64);
}
img.onerror = function() {
console.log(this.src);
}
img.src = image64;
这取决于您使用的浏览器。 使用 Firefox,svg 标签必须具有宽度和高度属性(单位不是 %)。
它还取决于 svg 的内容。 如果 svg 包含非拉丁字符,btoa 可能会失败(即使这似乎不是问题,因为 Svg 到 base64 在您的情况下工作正常)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.