KendoUI Pie111111

KendoUI Pie

by JSDavi

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.dataviz.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.dataviz.default.min.css">
<script src="http://cdn.kendostatic.com/2014.1.416/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.416/js/kendo.all.min.js"></script>
<div id="example" class="k-content">
    <div class="chart-wrapper">
        <div id="chart"></div>
        </div

JavaScript

function createChart() {
    var data = [{
        "year": 2000,
            "resolution": "1024x768",
            "share": 25,
            "visibleInLegend": true,
            "order": 1
    }, {
        "year": 2000,
            "resolution": "Other",
            "share": 75,
            "visibleInLegend": true,
            "order": 2,
            "color": "#ccc"
    }, {
        "year": 2001,
            "resolution": "1024x768",
            "share": 29,
            "visibleInLegend": false,
            "order": 1
    }, {
        "year": 2001,
            "resolution": "Other",
            "share": 71,
            "visibleInLegend": false,
            "order": 2,
            "color": "#ccc"
    }, {
        "year": 2002,
            "resolution": "1024x768",
            "share": 34,
            "visibleInLegend": false,
            "order": 1
    }, {
        "year": 2002,
            "resolution": "Other",
            "share": 66,
            "visibleInLegend": false,
            "order": 2,
            "color": "#ccc"
    }, {
        "year": 2003,
            "resolution": "1024x768",
            "share": 40,
            "visibleInLegend": false,
            "order": 1
    }, {
        "year": 2003,
            "resolution": "Other",
            "share": 60,
            "visibleInLegend": false,
            "order": 2,
            "color": "#ccc"
    }];
    var dataItem = [{
        "ServerID": 1,
            "year": 4,
            "resolution": "上传速率",
            "share": 5300,
            "visibleInLegend": false,
            "order": 1,
        "color": "#10C4B2"
    }, {
        "ServerID": 1,
            "year": 4,
            "resolution": "空闲",
            "share": 10000,
            "visibleInLegend": false,
            "order": 2,
            "color": "#ccc"
    }, {
        "ServerID": 1,
            "year": 3,
            "resolution": "下载速率",
            "share": 1500,
            "visibleInLegend": false,
            "order": 1,
       ...