1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Document</title>
6 </head>
7 <body>
8 <canvas id="canvas" width="500" height="500"></canvas>
9
10 <script>
11 var canvas = document.createElement('canvas');
12 var ctx = document.getElementById('canvas').getContext('2d');
13
14 ctx.beginPath();
15 ctx.strokeStyle = 'red';
16 ctx.moveTo(100, 100);
17 ctx.lineTo(100, 200);
18 ctx.stroke();
19
20 var img = new Image();
21 img.src = '1.png';
22 img.onload = function(){
23 ctx.drawImage(img, 100, 100, 150, 100);
24 };
25 var base64_url = canvas.toDataURL('image/jpeg', 0.5);
26 </script>
27 </body>
28 </html>
