Converts the collection to an SVG data URL (see dataUrl()), creates an HTML <img> element and sets the image’s src attribute to the data URL. The image element is returned, wrapped in a collection.

var img = Pablo.circle({r:50}).toImage();

img.appendTo(demoElement);
alert(demoElement.innerHTML);

As above, but allows the image format to be specified by the passed type, which can be "svg" (the default), "png" or "jpeg".

As above, but passes the collection containing the <img> element to the callback function when the image has completed loading. The callback’s this object will be the original collection.

Note that some browsers will not call the callback unless the returned image has been appended to the document.

SVG images

All modern browsers support SVG data URLs. To confirm, check that Pablo.support.svgImage is true.

if (Pablo.support.svgImage){
    // create image
}
else {
    // fallback
}

PNG and JPEG images

Not all browsers support conversion to PNG and JPEG images. To confirm, check Pablo.support.png() and Pablo.support.jpeg(), both of which are functions that accept a callback argument. The callback is passed either true or false. Chrome 32 and Firefox 24 are known to support all three image types.

Pablo.support.png(function(support){
    if (support){
        // create image
    }
    else {
        // create image
    }
});

Pablo.support.jpeg(function(support){
    if (support){
        // create image
    }
    else {
        // create image
    }
});

See Pablo.support for details.