Pie chart not full

Question

I'm trying to make a pie out of this JSON data:

[{"status":"Received","number":"2"},{"status":"In Progress","number":"1"}]

Here's my function:

function createChart() {
$("#chart").kendoChart({
    theme: $(document).data("kendoSkin") || "default",
    dataSource: {
        transport: {
            read: {
                url: "http://dev.openbill.co.uk/admin/crud/projects/chart.json.php",
                dataType: "json"
            },
        },
        sort: {
            field: "status",
            dir: "asc"
        },
    },
    chartArea: {
        height: 125,
        width: 125
    },
    legend: {
        visible: false
    },
    seriesDefaults: {
        type: "pie"
    },
    series: [{
        field: "number",
        categoryField: "status",
        padding: 10
    }],
    tooltip: {
        visible: true,
        template: "#= dataItem.status #: #= dataItem.number #"
    }
});

}

Interestingly though, the pie only occupies 1/4 of a circle. I've been playing around with the numbers to try and grow and shrink them, but I just can't seem to make the thing occupy more than 1/4 of a pie.

Could someone please let me know what I'm doing wrong?

Answer 1

In your chart series declaration you have specified that the field is type number:

    series: [{
        field: "number", 
        categoryField: "status",
        padding: 10
    }],

But actually in your JSON the status field is a string. Change it to a number (remove the double quotes) and it should start working.

[{"status":"Received","number":2},{"status":"In Progress","number":1}]