Hi we are trying to develop an mobile app using kendo ui. we need to integrate the chart controls in project.
The below code does the same but in chrome (on desktop) and opera(on android device). we need an .apk file so we tried to run this code in icenium simulator for android it doesn't work.
Plz help us with a solution.
The below code does the same but in chrome (on desktop) and opera(on android device). we need an .apk file so we tried to run this code in icenium simulator for android it doesn't work.
Plz help us with a solution.
<!DOCTYPE html ><html ><head> <title></title> <script src="js/jquery.min.js" type="text/javascript"></script> <script src="js/kendo.all.min.js" type="text/javascript"></script> <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" /><style>html,body{ width:100%;} </style> </head><body> <div data-role="view" id="main" data-layout="mobile-view" data-stretch="true"> <div style="background-image:url('images/Green Stripy Wallpapers.jpg');"> <a data-role="button" style="width:100%;">Button</a> <div id="example" class="k-content" style="width:100%; background:white;"> <div> <div id="chart" style="width:100%;"></div> </div> </div> </div> </div> <script type="text/javascript"> function createChart() { $("#chart").kendoChart({ theme: $(document).data("kendoSkin") || "default", title: { text: "Internet Users" }, legend: { position: "bottom" }, chartArea: { background: "" }, seriesDefaults: { type: "bar" }, series: [{ name: "World", data: [15.7, 16.7, 20, 23.5, 26.6] }, { name: "United States", data: [67.96, 68.93, 75, 74, 78]}], valueAxis: { labels: { format: "{0}%" } }, categoryAxis: { categories: [2005, 2006, 2007, 2008, 2009] }, tooltip: { visible: true, format: "{0}%" } }); } $(document).ready(function() { var app = new kendo.mobile.Application(); setTimeout(function() { // Initialize the chart with a delay to make sure // the initial animation is visible createChart(); $("#example").bind("kendo:skinChange", function(e) { createChart(); }); }, 400); });</script></body></html>1 Answer, 1 is accepted
0
Hello Priyank,
I tested the provided code in Icenium simulator for android and everything works as expected on my side (please take a look at this short screencast capture). Could you please provide more detailed information about the exact problems do you observe? This way I would be able to advice you further and provide concrete recommendations. Also, could you please specify the Android version you use? Note that Kendo UI DataViz supports Android 3 and above. For more detailed information on the subject follow this link.
As a general information, the main logic is executed at the document.ready event. When building a Kendo UI Mobile application it is not recommended to use that event. Instead take a look at the init event of the view component. For example:
I hope this information will help.
Kind regards,
Iliana Nikolova
the Telerik team
I tested the provided code in Icenium simulator for android and everything works as expected on my side (please take a look at this short screencast capture). Could you please provide more detailed information about the exact problems do you observe? This way I would be able to advice you further and provide concrete recommendations. Also, could you please specify the Android version you use? Note that Kendo UI DataViz supports Android 3 and above. For more detailed information on the subject follow this link.
As a general information, the main logic is executed at the document.ready event. When building a Kendo UI Mobile application it is not recommended to use that event. Instead take a look at the init event of the view component. For example:
//....<div data-role="view" id="main" data-layout="mobile-view" data-stretch="true" data-init="createChart"> //....function createChart() { $("#chart").kendoChart({ //.... });}window.kendoMobileApplication = new kendo.mobile.Application(document.body);//....I hope this information will help.
Kind regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!