intertwingly

It’s just data

Four Credits


P P

582331: The course is based on the course book: Agile Web Development with Rails, Pragmatic Bookshelf, Third Edition, 2009 (Sam Ruby, Dave Thomas, and David Hansson) (original)

The course is taught by Matti Paksula, who was a co-presenter at SVG Open, where he shared this juicy tidbit which imports a source canvas image into an SVG Object via a Data URL:

function importCanvas(sourceCanvas, targetSVG) {

	// get base64 encoded png from Canvas
	var image = sourceCanvas.toDataURL("image/png");

	// Create new SVG Image element.  Must also be careful with the namespaces.
	var svgimg = document.createElementNS("http://www.w3.org/2000/svg", "image");
	svgimg.setAttributeNS("http://www.w3.org/1999/xlink", 'xlink:href', image);

	// Append image to SVG
	targetSVG.appendChild(svgimg);
}