| <html> |
| <head> |
| <meta charset="utf-8"> |
| </head> |
| <body> |
| <script> |
| var canvas = document.createElement('canvas'); |
| var ctx = canvas.getContext('2d'); |
| |
| var data = '<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">' + |
| '<foreignObject width="100%" height="100%">' + |
| '<div xmlns="http://www.w3.org/1999/xhtml" style="font-size:40px">' + |
| '<em>I</em> like' + |
| '<span style="color:white; text-shadow:0 0 2px blue;">' + |
| 'cheese</span>' + |
| '</div>' + |
| '</foreignObject>' + |
| '</svg>'; |
| |
| var DOMURL = window.URL || window.webkitURL || window; |
| |
| var img = new Image(); |
| var svg = new Blob([data], {type: 'image/svg+xml;charset=utf-8'}); |
| var url = DOMURL.createObjectURL(svg); |
| |
| img.onload = function () { |
| ctx.drawImage(img, 0, 0); |
| canvas.toDataURL(); |
| DOMURL.revokeObjectURL(url); |
| } |
| |
| img.src = url; |
| </script> |
| </body> |
| </html> |