Kendo mobile chart not scrollable? -
jsfiddle example here
i testinhg on samsung galaxy s4 , mobile emulator chrome.
<div class="demo-section"> <div id="drawer"> <a href="#" data-target="dashboard" class="drawer-link active"> dashboard </a> <a href="#" data-target="biomarkers" class="drawer-link">biomarkers</a> <a href="#" data-target="lifestyle" class="drawer-link">lifestyle</a> <a href="#" data-target="settings" class="drawer-link">settings</a> </div> <div id="content-container" > <a id="drawer-trigger" href="#"></a> <div id="dashboard" class="inner-content" style="height: 100%;width:100%;padding:5px;"> <h3>dashboard</h3> <br /> <div id="_steps"> <h4>steps</h4> <div id="steps" style="height: 80px; background-color: lightgray;"></div> </div> <br /> <div id="_distance"> <h4>distance</h4> <div id="distance" style="height: 80px; background-color: lightgray;"></div> </div> <br /> <div id="_calories"> <h4>calories out</h4> <div id="caloriesout" style="height: 80px; background-color: lightgray;"></div> </div> </div> <div id="biomarkers" class="inner-content"> biomarkers </div> <div id="lifestyle" class="inner-content"> lifestyle </div> <div id="settings" class="inner-content"> settings </div> </div> </div> $(document).ready(function () { $("#steps").width($("#_steps").width()); $("#distance").width($("#_distance").width()); $("#caloriesout").width($("#_calories").width()); $("#steps").kendosparkline({ datasource: { data: actdata }, type: "area", seriescolors: ["blue"], series: [{ name: "steps", field: "steps", categoryfield: "createddate" }], }); $("#distance").kendosparkline({ datasource: { data: actdata }, seriescolors: ["green"], series: [{ name: "distances", field: "distances", categoryfield: "createddate" }], }); $("#caloriesout").kendosparkline({ datasource: { data: actdata }, type: "column", seriescolors: ["red"], series: [{ name: "caloriesout", field: "caloriesout", categoryfield: "createddate" }], }); }); $(function () { $("#drawer").kendomobiledrawer({ container: "#content-container" }); $("#drawer-trigger").click(function () { $("#drawer").data("kendomobiledrawer").show(); return false; }); $(".drawer-link").click(function () { $("#drawer").data("kendomobiledrawer").hide(); $(".drawer-link").removeclass("active"); $(this).addclass("active"); return false; }); $(".drawer-link").click(function () { $(".inner-content").hide(); $("#" + $(this).data("target")).show(); }); }); var app = new kendo.mobile.application(document.body);
my problem cannot scroll chart using touch. using kendomobiledrawer.
the mobile version in url http://m.biotracker.me
Comments
Post a Comment