Mapping items to a diagram/layout

Hi, I haven't been able to find an exact control to fit my use case, and I'm wondering if you had any suggestions.


I am trying to implement something like image mapping (https://www.w3schools.com/html/html_images_imagemap.asp) to plot various item (furnace/vehicle/shelf) locations within a warehouse schematic diagram (image/jpg/pdf), so that the user is able to click on a item within the image and do some work based on the item they choose.  If possible, I would like the user to be able to edit/add/modify the location of each item at runtime.  I would also like to display an icon, marker, or some kind of overlay, to show where each item has been plotted to the diagram.  I've attached a sample image of what I'm trying to create.


Are there any blazor controls that could help me accomplish this?  


Attachment: PlantLayoutWithIcons_15bf95d2.png

1 Reply

JJ Jawin John Syncfusion Team May 7, 2025 01:04 PM UTC

Hi Zachary Witt,

Based on the image you shared, we suspect that your requirement is similar to a floor planner implementation using the Diagram component.

We have attached a live demo link and GitHub repository for the floor planner sample for your reference.

If this aligns with your requirements, please share more specific details so we can assist you further.

Demo link - https://blazor.syncfusion.com/showcase/floor-planner/
Github link - https://github.com/syncfusion/blazor-showcase-floor-planner

Best Regards,

Jawin


Loader.
Up arrow icon