kendo DataViz移動HTML5

任何想法如何使用Telerik Kendo UI DataViz添加圖表到iPhone Web應用程序。提前致謝。這是我想要做的，但圖表不顯示！kendo DataViz移動HTML5

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> 
    <script src="../../../../Scripts/jquery.min.js" type="text/javascript"></script> 
    <script src="../../../../Scripts/kendo.all.js" type="text/javascript"></script> 
    <script src="../../../../Scripts/console.js" type="text/javascript"></script> 
    <link href="../../../../Content/Mobile/kendo.common.min.css" rel="stylesheet" type="text/css" /> 
    <link href="../../../../Content/Mobile/kendo.mobile.all.min.css" rel="stylesheet" 
     type="text/css" /> 

    <div data-role="view" data-title="Views"> 
    <header data-role="header"> 
     <div data-role="navbar"> 
      <span data-role="view-title"></span> 
      <a data-align="right" data-role="button" class="nav-button" href="#index">Index</a> 
     </div> 
    </header> 
    <ul data-role="listview" data-style="inset"> 
     <li><a href="#secondview">Local View</a></li> 
    </ul> 
    <ul data-role="listview" data-style="inset"> 
     <li><a href="../../content/mobile/view/remoteview.html">Remote View</a></li> 
    </ul> 
</div> 

<div data-role="view" id="secondview" data-layout="mobile-view" data-title="Local View"> 
    <div id="chart"> 
     </div> 
     <script> 
      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); 
      }); 
     </script> 
</div> 

<div data-role="layout" data-id="mobile-view"> 
    <header data-role="header"> 
     <div data-role="navbar"> 
      <a class="nav-button" data-align="left" data-role="backbutton">Back</a> 
      <span data-role="view-title"></span> 
      <a data-align="right" data-role="button" class="nav-button" href="#index">Index</a> 
     </div> 
    </header> 
</div> 


    <script> 
     window.kendoMobileApplication = new kendo.mobile.Application(document.body); 
    </script>

預先感謝

來源

2012-04-19 hncl

KendoUI DataViz公司部件在基於Webkit的移動瀏覽器，包括Safari在iOS（source），除了Android瀏覽器v3和以上。

如果你只是想知道如何實現KendoUI圖，這裏是一個簡單的我沒有回答另一個問題，有關如何強制KendoUI跨遺漏值繪製：http://jsfiddle.net/LyndsySimon/KJuDe/

categoryAxis: { 
    categories: [ 
     'test<tspan dx="-20px" dy="1em">label</tspan>', 2006, 2007, 2008, 2009] 
}

你可以在KendoUI的網站上找到DataViz庫的完整參考：http://www.kendoui.com/documentation/dataviz/chart/overview.aspx

來源

2012-04-19 14:33:19

謝謝Lyndsy，我剛剛用我嘗試使用的代碼編輯了我的問題。它可能會運行$（document）.ready是問題嗎？ – hncl 2012-04-19 15:34:08

它的工作，我也發現這個解決方案爲Android.http：//www.kendoui.com/blogs/teamblog/posts/12-02-17/using_svg_on_android_2_x_and_kendo_ui_dataviz.aspx – hncl 2012-04-20 04:57:04

kendo DataViz移動HTML5

回答

相關問題