The readonly this binding applies to every element (and component) and allows you to obtain a reference to rendered elements. For example, we can get a reference to a <canvas> element:

<canvas
	bind:this={canvas}
	width={256}
	height={256}
></canvas>

Note that the value of canvas will be undefined until the component has mounted, so we put the logic inside the onMount lifecycle function.



			
loading editor...
loading Svelte compiler...


			
loading editor...

Compiler options

result = svelte.compile(source, {
generate:
});


			
loading editor...