Note that there are some explanatory texts on larger screens.

plurals
  1. POkendo DataViz Mobile HTML5
    text
    copied!<p>Any idea how to add charts using Telerik Kendo UI DataViz to an iPhone web application. Thanks in advance. Here is what I am trying to do, but the chart does not show up!</p> <pre><code>&lt;meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /&gt; &lt;script src="../../../../Scripts/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="../../../../Scripts/kendo.all.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="../../../../Scripts/console.js" type="text/javascript"&gt;&lt;/script&gt; &lt;link href="../../../../Content/Mobile/kendo.common.min.css" rel="stylesheet" type="text/css" /&gt; &lt;link href="../../../../Content/Mobile/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" /&gt; &lt;div data-role="view" data-title="Views"&gt; &lt;header data-role="header"&gt; &lt;div data-role="navbar"&gt; &lt;span data-role="view-title"&gt;&lt;/span&gt; &lt;a data-align="right" data-role="button" class="nav-button" href="#index"&gt;Index&lt;/a&gt; &lt;/div&gt; &lt;/header&gt; &lt;ul data-role="listview" data-style="inset"&gt; &lt;li&gt;&lt;a href="#secondview"&gt;Local View&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;ul data-role="listview" data-style="inset"&gt; &lt;li&gt;&lt;a href="../../content/mobile/view/remoteview.html"&gt;Remote View&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div data-role="view" id="secondview" data-layout="mobile-view" data-title="Local View"&gt; &lt;div id="chart"&gt; &lt;/div&gt; &lt;script&gt; function createChart() { $("#chart").kendoChart({ title: { text: "Kendo Chart Example" }, series: [ { name: "Example Series", data: [200, 450, 300, 125] } ] }); } $(document).ready(function () { setTimeout(function () { createChart(); $("#example").bind("kendo:skinChange", function (e) { createChart(); }); }, 400); }); &lt;/script&gt; &lt;/div&gt; &lt;div data-role="layout" data-id="mobile-view"&gt; &lt;header data-role="header"&gt; &lt;div data-role="navbar"&gt; &lt;a class="nav-button" data-align="left" data-role="backbutton"&gt;Back&lt;/a&gt; &lt;span data-role="view-title"&gt;&lt;/span&gt; &lt;a data-align="right" data-role="button" class="nav-button" href="#index"&gt;Index&lt;/a&gt; &lt;/div&gt; &lt;/header&gt; &lt;/div&gt; &lt;script&gt; window.kendoMobileApplication = new kendo.mobile.Application(document.body); &lt;/script&gt; </code></pre> <p>Thanks in advance</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload