0

I have the following codes below:

$("#scaledScore").kendoChart({
        dataSource: chartData(),     // return array list.
        series: [
            {
                type: "bar",
                field: "StudentScore",
                name: "Student's score"
            }
        ],
        valueAxis: {
            field: "SchoolScore"
        },
        categoryAxis: {
            field: "Description"
        }
    });

function chartData(){
    var sampleData = new Array();

    sampleData[0] = {
        Description : "Math",
        StudentScore: 45,
        Subject: Math
    };

    sampleData[1] = {
        Description : "Science",
        StudentScore: 60,
        Subject: Science
    };

    sampleData[2] = {
        Description : "English",
        StudentScore: 45,
        Subject: English
    };

    return sampleData;
}

The above codes will render a bar chart with (three) bars for (Math, Science, and English) as expected. But what I want is to have a single bar ONLY for (Math, Science and English). Say Math value will have a RED color, Science will have GREEN and English will have BLUE.

Is that possible?

FYI: Stacked Bar will not work for me.

Thanks

user3988645
  • 135
  • 2
  • 4
  • 14

1 Answers1

0

I think a stacked bar is what you want. If that doesn't work, perhaps our starting point should be your non-working stacked bar sample code?

Nic
  • 12,220
  • 20
  • 77
  • 105
  • The problem with stacked bar the next value will be rendered on top of the 1st one. For example Math has a value of 50, then Science has a value of 60. Now the 1 - 50 value in the 'X' axis will be colored RED and the next 60 value which is from 51 - 110 will be colored GREEN. What I want is from value 1 - 50 : colored RED and 50 - 60 will be colored GREEN. – user3988645 Oct 01 '14 at 01:43