This is a migrated thread and some comments may be shown as answers.

change datasource parameters between 2 charts

2 Answers 105 Views
Charts
This is a migrated thread and some comments may be shown as answers.
dan
Top achievements
Rank 1
dan asked on 06 Feb 2014, 11:34 AM
Hello,

I want to show a first chart with a datasource pagesize, then another with same datasource but another pagesize.

When trying following, I can see first chart show my first pagesize, then, when second chart shows, first chart pagesize is change to second page size.

see following example:

function createChart() {

myData.pageSize(20);

$("#MyChart").kendoChart({
dataSource: myData,
series: [{type: "bar",field: "nb",categoryField: "name",name: "#= group.value #",markers: {visible: true,size: 1},aggregate : "avg",},],
legend: {position: "bottom",labels: {template: "my name"}},
valueAxis: {visible:false,labels: {format: "{0}", step:3},majorGridLines: {visible: false},majorTicks: {visible: false},format: "{0}%",},
categoryAxis: {field: "my field",majorGridLines:{visible: false},majorTicks:{visible: false},},
tooltip: {visible: true,template: "#=category #: #= value #"},
transitions: true,
});

myData.pageSize(50);

$("#MyChart").kendoChart({
dataSource: myData,
series: [{type: "bar",field: "nb",categoryField: "name",name: "#= group.value #",markers: {visible: true,size: 1},aggregate : "avg",},],
legend: {position: "bottom",labels: {template: "my name"}},
valueAxis: {visible:false,labels: {format: "{0}", step:3},majorGridLines: {visible: false},majorTicks: {visible: false},format: "{0}%",},
categoryAxis: {field: "my field",majorGridLines:{visible: false},majorTicks:{visible: false},},
tooltip: {visible: true,template: "#=category #: #= value #"},
transitions: true,
});

}

$(document).ready(function() {
createChart();
});



Thank you,
Dan

2 Answers, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 10 Feb 2014, 08:25 AM
Hello Dan,

You should use separate dataSources in order to be able to use different page size:
$("#FirstChart").kendoChart({
    dataSource: {
        data: ChartData,
        pageSize: 20
    },
    ...
});
 
$("#SecondChart").kendoChart({
    dataSource: {
        data: ChartData,
        pageSize: 20       
    },
    ...
});


Regards,
Daniel
Telerik

Check out the new Telerik Platform - the only modular platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native apps. Register for the free online keynote and webinar to learn more about the Platform on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT).

0
dan
Top achievements
Rank 1
answered on 10 Feb 2014, 03:57 PM
Hi Daniel,

Ok, will do.

Thank you,
Dan
Tags
Charts
Asked by
dan
Top achievements
Rank 1
Answers by
Daniel
Telerik team
dan
Top achievements
Rank 1
Share this question
or