java todataurl_利用canvas中toDataURL()将图片转为dataURL(base64)的方法详解

在使用canvas绘制图片时，可以通过toDataURL()方法将图片转换为dataURL格式（base64编码），方便在网页中显示或传输。下面是利用canvas中toDataURL()将图片转为dataURL的详细步骤：

1. 创建一个canvas元素

var canvas = document.createElement("canvas");

2. 设置canvas的宽度和高度

canvas.width = img.width;
canvas.height = img.height;

3. 在canvas上绘制图片

var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);

4. 调用toDataURL()方法获取dataURL

var dataURL = canvas.toDataURL("image/png");

其中，toDataURL()方法的参数表示输出格式，常见的有"image/png"、"image/jpeg"等。

完整代码示例：

var img = new Image();
img.onload = function() {
  var canvas = document.createElement("canvas");
  canvas.width = img.width;
  canvas.height = img.height;
  var ctx = canvas.getContext("2d");
  ctx.drawImage(img, 0, 0);
  var dataURL = canvas.toDataURL("image/png");
  console.log(dataURL);
};
img.src = "example.png";