is it possible to use a custom image inside the map control to place markers on?
Next to the world map, we would like to provide some detailed information for buildings and use the building layout to place markers inside rooms.
Thank you very much in advance!
Alex
2 Answers, 1 is accepted
1
Accepted
Nadezhda Tacheva
Telerik team
answered on 27 May 2024, 08:06 AM
Hello Alexander,
The layer that works with images in the Map component is called Tile layer. It works by rendering images (tiles) that display the actual map. These images are requested from third-party services from a URL configured in the component.
The main idea is that the URL will be generated based on the urlTemplate and the zoom/x/z values. With that in mind, based on the passed zoom/x/y values from the Map, the tile provider must return the images for that particular coordinates for that particular zoom.
To display a custom image in the Map, you may implement a custom solution. You can consider creating your own data provider to use in the Map. For example, you can divide the whole image (building layout) in smaller pieces (images) that will be served as tiles. You can save these tile images in a folder somewhere and expose a local or remote URL to obtain them.
If you need to also use custom marker images, you can do that through the Marker layer template.
I was able to add a custom image to the tile layer, but even with zoom set to '0', the image is repeated multiple times on the map component.
As URL template I am just directing to the local resources in wwwroot, like "images/mycustomimage.png".
Do I have to put variables for zoom and coordinates into the URL template or do you have an example of how to configure the component to show the image just once?
I have also set zoomable to 'false' (which does not seem to work by the way), because I just want to show one single tile with one single image.