search

BlazorExtensions / Canvas

HTML5 Canvas API implementation for Microsoft Blazor
MIT License
614 stars 146 forks source link

How to place and Image inside of the Canvas #120

Open ssuttonDev opened 2 years ago

ssuttonDev commented 2 years ago

I am looking for an example that places an image into the canvas. Something like the following where the the contents from the img tag is draw into the canvas. Is this possible?

<img @ref="imageSelected" id="imageSelected" src="@SelectedImage.Base64JPGImage" alt="@SelectedImage.DisplayedName" hidden >

<BECanvas Width="300" Height="700" @ref="_canvasReference">

LeonSpors commented 2 years ago

You can draw an image by just calling DrawImageAsync(ElementReference elementReference, double dx, double dy, ...)

_context.DrawImageAsync(_imageSelected, 0, 0);