When I pull up my map (Center is on Michigan) and scroll in or out with my mouse, the map centers on Africa and starts scrolling in or out from there. It doesn't matter where the map is, scrolling with the mouse always moves the map over to Africa. How do I fix that so that the map scrolls in or out, based on where the mouse pointer is?
Here is my cshtml razor object:
@(Html.Kendo().Map()
.Name("crimemapping_results")
.Center(Model.DefaultLatitude, Model.DefaultLongitude)
.Zoom(3)
.MinZoom(3)
.Wraparound(true)
.Layers(layers =>
{
layers.Add()
.Type(MapLayerType.Tile)
.UrlTemplate("http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png")
.Subdomains("a", "b", "c")
.Attribution("© <
a
href
=
'http://osm.org/copyright'
>OpenStreetMap contributors</
a
>");
layers.Add().AutoBind(false)
.Type(MapLayerType.Bubble)
.Style(style => style
.Fill(fill => fill.Color("#00f").Opacity(0.4))
.Stroke(stroke => stroke.Width(0))
)
.DataSource(dataSource => dataSource
.Read(read => read.Action("CrimeMapping_Map", "Home").Data("map_get"))
)
.LocationField("latlng")
.ValueField("DataCount");
})
.Events(events => events
.ShapeMouseEnter("onShapeMouseEnter")
.Reset("onReset")
)
)