Use with Blazor?

[rgamage]

I'm trying to use this wonderful library in a server-side Blazor application. It almost works, the element appears briefly on page reload, but quickly disappears. I'm sure there is something unique about the way Blazor renders its HTML that is preventing the canvas-gauges magic to work.

All I've done as a simple test is to add this line to one of my .razor component pages:

Can anyone provide some insight into how I might get this to work? I assume there will be a requirement for some JS interop, but I'm hoping it will be minimal. I'm aware of the project Blazor Extensions Canvas (https://github.com/BlazorExtensions/Canvas), but that's not helpful for this purpose - that's more if you want to start drawing from scratch using the Canvas commands. I just want to use this wonderful gauges library!

[rgamage]

UPDATE - I found that I CAN use this with Blazor, there is just one oddity to know about. The canvas element must be the at the top level of the page or component, it cannot be nested inside a div, for example. I have no idea why this is, but knowing this allows me to use it in Blazor. If you want to put the gauge inside a div, you can just make a separate component that contains the gauge, wherein the canvas element is at the top level. It just has to be at the top level of whatever Blazor component it is in.

[Ammarhassan48]

this might help you on this https://learn.microsoft.com/en-us/training/modules/blazor-build-rich-interactive-components/2-create-user-interfaces-blazor-components

[TuShen121]

您的邮件我已收到，谢谢！