5 Answers, 1 is accepted
0
Noli
Top achievements
Rank 1
Rank 1
answered on 19 Apr 2012, 05:35 AM
Oops...
It seems there was a problem with our server.
If the problem persists, use the Site Feedback form to tell us what steps led you to this page.
I could not edit my previous post.
Here's the idea.
<div data-role="view" data-title="Destinations"> <ul data-role="listview" data-style="inset" data-type="group"> <li> Africa <ul> <li data-icon="toprated"><a>Nairobi</a></li><li data-icon="toprated"><a>Nairobi Map</a></li></ul> </li>
Nairobi Map is Leaflet Map.
0
Hi,
From what I see, the two libraries should work without any glitches. Just make sure that you initialize the map in the init event of the respective view.
Regards,
Petyo
the Telerik team
From what I see, the two libraries should work without any glitches. Just make sure that you initialize the map in the init event of the respective view.
Regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Noli
Top achievements
Rank 1
Rank 1
answered on 19 Apr 2012, 06:26 AM
Show us a bit of code.
Which one of Kendo UI to use, on the second page?
http://demos.kendoui.com/beta/mobile/button/index.html
In jQTouch, we have this code:
<div id="map" class="keep_tabbar">
<div class="toolbar">
<h1>Leaflet Map</h1>
</div>
<div id="map-container" class="notransform">
<div id="map-overflow" style="overflow: hidden; padding: 0; border: 0;" class="notransform">
<div id="map_canvas" style="margin-left: 1px; margin-top: 1px;" class="notransform"></div>
</div>
</div>
</div>
Now, how do you translate this into Kendo UI?
Here is Leaflet mobile example
http://leaflet.cloudmade.com/examples/mobile-example.html
Jquery mobile Leaflet example
http://stuff.samat.org/Demos/jQuery-Mobile/jQM-Leaflet-Demo/demo.html
Which one of Kendo UI to use, on the second page?
http://demos.kendoui.com/beta/mobile/button/index.html
In jQTouch, we have this code:
<div id="map" class="keep_tabbar">
<div class="toolbar">
<h1>Leaflet Map</h1>
</div>
<div id="map-container" class="notransform">
<div id="map-overflow" style="overflow: hidden; padding: 0; border: 0;" class="notransform">
<div id="map_canvas" style="margin-left: 1px; margin-top: 1px;" class="notransform"></div>
</div>
</div>
</div>
Now, how do you translate this into Kendo UI?
<body>
<div data-role="view">
<div data-role="header">Header</div>
<article data-role="content" style="margin: 0; padding: 0">
<div id="map_canvas"></div>
</article>
<div data-role="footer">Footer</div>
</div>
Here is Leaflet mobile example
http://leaflet.cloudmade.com/examples/mobile-example.html
Jquery mobile Leaflet example
http://stuff.samat.org/Demos/jQuery-Mobile/jQM-Leaflet-Demo/demo.html
0
Jose Mejia
Top achievements
Rank 1
Rank 1
answered on 19 Apr 2013, 09:36 AM
Hello,
Leaflet don't working with Kendo UI Mobile.
I try to use Leaflet, but "pan" and "zoom" events don't working at Android or iPad. Working fine in all browsers at desktop.
I tried Openlayers, it works fine.
Please look at simple standalone example in archive.
Also similar issue closed at leaflet's github https://github.com/Leaflet/Leaflet/issues/1043
Is there any workaround for this problem?
Regards
Leaflet don't working with Kendo UI Mobile.
I try to use Leaflet, but "pan" and "zoom" events don't working at Android or iPad. Working fine in all browsers at desktop.
I tried Openlayers, it works fine.
Please look at simple standalone example in archive.
Also similar issue closed at leaflet's github https://github.com/Leaflet/Leaflet/issues/1043
Is there any workaround for this problem?
Regards
0
Hi Jose,
Regards,
Petyo
the Telerik team
I updated the provided example to our 2013 Q1 release (2013.1.319), and enabled the stretch property of the view which contains the map - the example ran fine on my side. Please give that a try:
<div id="view_map" data-role="view" data-title="Map" data-init="map_init" data-stretch="true">Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!