Rendering
The SDK is the “back end” of the editor. It handles image rendering and image modification. If you’re interested in building your own UI, or not using a UI at all, this is the way to go.
Rendering using the SDK requires an input image as well as a canvas
HTML element that it should
render to. Let’s create the canvas
element first:
<canvas id="canvas" />
Now let’s create an Image
, load it, instantiate the SDK and render the image to the canvas:
window.onload = function () {
const canvas = document.getElementById('canvas')
const image = new Image()
image.addEventListener('load', () => {
const sdk = new PhotoEditorSDK('webgl', {
canvas: canvas,
image: image
})
sdk.render()
})
image.src = 'image.png'
}
The canvas should now display your image.