Telerik Forums
UI for ASP.NET MVC Forum
2 answers
273 views

I'm trying to dynamically set the marker color based on a value from a datasource.  I can't find any examples of this and can't find an event that fires that would allow me to do this dynamically.  Can you point me in the right direction, please.  Below is the simple map control that I'm using:

 

@(Html.Kendo().Map()
    .Name("map")
    .Center(new double[] { Model.Latitude, Model.Longitude })
    .Zoom(17)
    .Layers(layers =>
    {
        layers.Add()
            .Type(MapLayerType.Tile)
            .UrlTemplate("https://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png")
            .Subdomains("a", "b", "c");
        layers.Add()
            .Type(MapLayerType.Marker)
            .DataSource(dataSource => dataSource
                .Read(read => read.Action("SelectBillingLocationsCoordinates", "Details", new { Id = @Model.Id }))
                )
                .LocationField("LatLng")
            .TitleField("Name");
    })
    )

 

Eyup
Telerik team
 answered on 20 Nov 2020
3 answers
683 views
Hi, is there an example somewhere of how to draw a shape on the map?
Alex Hajigeorgieva
Telerik team
 answered on 12 May 2020
4 answers
199 views
Is it possible to draw shapes on the map with a mouse?  I do not see mouse events exposed for the map or shape layer.
Viktor Tachev
Telerik team
 answered on 12 May 2020
3 answers
187 views
Hello,

I have constructed a simple map as per following demo: https://demos.telerik.com/aspnet-mvc/map and I need the tooltip assigned to the marker to be displayed automatically upon page load. I have come across this solution: https://www.telerik.com/forums/marker-tooltip-show-on-load but it references AJAX, not Kendo-MVC. Can you please help me on how to achieve this?

Thank you,
Dimitris
Tsvetina
Telerik team
 answered on 06 Jun 2019
1 answer
99 views

I have a problem displaying the background (mapvision),

i cant see the map, everything else works, like makers, zoom and navigation control

I am implementing the map control like this : https://demos.telerik.com/aspnet-mvc/map

 

Thomas Gschweitl
Top achievements
Rank 1
 answered on 17 Jul 2018
1 answer
140 views

On this site:

https://demos.telerik.com/aspnet-mvc/map/remote-marker

...you get us a nice example of using remote data in a map.

In this provided method you return a json file. How is this structured? I connot find any example.

public ActionResult _StoreLocations()
        {
            return Json(MapDataRepository.StoreLocations());
        } 
Georgi
Telerik team
 answered on 22 Jun 2018
3 answers
211 views

Hi Folks,

i would like to update the markers of a map through signalR. i got it right for a grid control. but in map control, i just get a stack space error and nothing more.

Is it possible, that the map control has no implementation for this scenario, or am i missing something else?

 

Binding is done as follows:

 @(Html.Kendo().Map()
                .Name("mapVessels")
                .Layers(layers =>
                {
                    layers.Add()
                        .Type(MapLayerType.Tile)
                        .UrlTemplate("https://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png")
                        .Subdomains("a", "b", "c")
                        .Attribution("&copy; <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>");

                    layers.Add()
                        .Type(MapLayerType.Marker)
                        .DataSource(dataSource => dataSource
                            .SignalR()
                            .AutoSync(true)
                            .Schema(schema => schema
                                .Model(model =>
                                {
                                    model.Id("ID");
                                    model.Field("ID", typeof(Guid)).Editable(false);
                                }))
                            .Events(events => events.Push("onPush"))
                            .Transport(tr => tr
                                .Promise("hubStart")
                                .Hub("hub")
                                .Client(c => c
                                    .Read("read"))
                                .Server(s => s
                                    .Read("read")))
                        )
                        .LocationField("LatLng")
                        .TitleField("Title")
                        .ValueField("Value")

                        //.Tooltip(tooltip=>tooltip
                        //    .Content())
                        ;
                })
                .Center(54.623, 13.2248)
                .Zoom(8)
                .Events(events => events.MarkerClick("onMarckerClick"))
    .Deferred()
    )

Stefan
Telerik team
 answered on 08 Jun 2018
1 answer
99 views

Hello we are using the map to display different icons for some of our objects and we are using some javascript to set the shape of the marker to the right icon.

Now the customer wants to have more information directly displayed on the map. The best tool to display this data is to incorporate a radial or databar into the icon. is that in any way possible for the map.

Stefan
Telerik team
 answered on 19 Mar 2018
1 answer
177 views

Trying to accomplish a simple task, after loading I want to set the map extent based on the marker layer.

I have the code to create the extent and set it but timing is the issue. When I try to do this on document ready the layer item list is empty and there is no explicit "load" event I can attach a handler to. Firing on "reset" will cause infinite recursion since the function is itself changing the viewport of the map plus it seems to fire multiple times.

Basically, I just need to know when this should be called and how to wire a handler to do it at that time.

var map = $('#map').getKendoMap();
var layer = map.layers[1];
var markers = layer.items;
var extent;
 
for (var i = 0; i < markers.length; i++) {
  var loc = markers[i].location();
  if (!extent) {
    extent = new kendo.dataviz.map.Extent(loc, loc);
  } else {
    extent.include(loc);
  }
}
 
map.extent(extent);

.

 

Preslav
Telerik team
 answered on 26 Feb 2018
1 answer
125 views
How do you autosize the map so it takes up the full 100% of the div and will resize auto.
Preslav
Telerik team
 answered on 26 Dec 2017
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
AppBar
BottomNavigation
Card
FloatingActionButton
Licensing
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
DateTimePicker
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?