• Material 3
  • Material 3 Dark
  • Fluent
  • Fluent Dark
  • Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • High Contrast
Preferences
Theme Selection
Mode Selection
Touch
Mouse
Localization
*Translated by Google Translator.
Currency

Example of Dynamic Marker in ASP.NET MVC Maps Control

This sample shows how custom markers and lines can be dynamically added to our maps with UI interaction. Marker or line can be chosen from the properties panel.

DEMO
SOURCE

Click on the maps to add the marker/navigation line

Marker
Line
Connecting line
Marker type
Width

This sample shows how custom markers and lines can be dynamically added to our maps with UI interaction. Marker or line can be chosen from the properties panel.

Using UI interaction, the markers or line can be added as follows: You can get the currently clicked geo location by passing "PointerEvent" or "MouseEvent" argument and layer index to the "getGeoLocation" method. Then, use that geo position to place the marker or line in the appropriate position.


Injecting Module

The features of maps component are segregated into individual feature-wise modules. To use navigation lines and marker, you need to inject the NavigationLine and Marker module using the Maps.Inject(NavigationLine, Marker) method.

Transform your ASP.NET MVC web apps today with Syncfusion ASP.NET MVC components
85+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE