How to Convert normal PNG image to clickable image and to use it in maps

Question

Hi,I have a normal PNG image which is floor plan. I want to mark some places in the image as available places for booking the seat.So how to mark the place in the floor plan and how to add the clickable event to the marked places.For eg: The below image is normal PNG image. I want a screen to mark between the circles as available places.So that when users login in , they can see as some green color which are available. How to achieve this using any of the sync fusion controls.

Swetha Babu · Accepted Answer

Hi Vivek,Thank you for contacting Syncfusion support.We do not have support to convert the PNG image to a interactable image in the Syncfusion controls. However, we can render the maps like the image by creating a GeoJSON data and set it to the "shapeData" property in the maps. We can select the shapes in the Maps using "e-layers-selectionSettings". For your reported scenario, we can use enableMultiSelect property to enable multiple shape selection and color property to set “green” color to the selected shape. However, we have created a simple ASP.NET Core application to demonstrate the same and it can be downloaded from the below link.https://www.syncfusion.com/downloads/support/forum/164547/ze/Maps-612718830In the above sample, we have rendered the maps shape like in the image with the selection feature enabled for the layers of the maps. Please let us know if the above sample meets your requirement. If not, please provide us more details about your requirement. It will be helpful for us to analyze further and assist you better.Regards,Swetha Babu