Hi
I am attempting to build a scatter line for grouped data and multi-axis from a remote source. Each grouped series is rendering to each Y-axis.
Group S1 should render to X & Y1 axis
Group S2 should render to X & Y2 axis
What is actually happening is:
Group S1 & S2 are rendering to X & Y1 axis
Group S2 & S2 are rendering to X & Y2 axis
Is it possible to render groups to specific axis?
Data:
I am attempting to build a scatter line for grouped data and multi-axis from a remote source. Each grouped series is rendering to each Y-axis.
Group S1 should render to X & Y1 axis
Group S2 should render to X & Y2 axis
What is actually happening is:
Group S1 & S2 are rendering to X & Y1 axis
Group S2 & S2 are rendering to X & Y2 axis
Is it possible to render groups to specific axis?
var stocksDataSource = new kendo.data.DataSource({
transport: {
read: {
url: function () {
return <%= url %>;
},
dataType: "json"
}
},
group: {
field: "GroupId"
},
sort: {
field: "X1",
dir: "asc"
},
schema: {
model: {
fields: {
X1: {
type: "date"
}
}
}
}
});
function createChart() {
$("#chart").kendoChart({
title: { text: "Stock Prices" },
dataSource: stocksDataSource,
series: [{
type: "scatterLine",
xField: "X1",
yField: "Y1",
yAxis: "abc",
name: "Y1",
groupNameTemplate: "#= group.value # (#= series.name #)"
},
{
type: "scatterLine",
xField: "X1",
yField: "Y2",
yAxis: "torque",
name: "Y2",
groupNameTemplate: "#= group.value # (#= series.name #)"
}],
legend: {
position: "bottom"
},
yAxes: [{
name: "abc",
title: {
text: "Power (bhp)"
}
}, {
name: "torque",
title: {
text: "Torque (lb-ft)"
}
}],
xAxis: {
labels: {
format: "dd MMM yy"
}
}
});
}
$(document).ready(function () {
setTimeout(function () {
// Initialize the chart with a delay to make sure
// the initial animation is visible
createChart();
$("#example").bind("kendo:skinChange", function (e) {
createChart();
});
}, 400);
});
[{
"X1"
:
"2012-01-20T00:00:00"
,
"Y1"
:100.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-02T00:00:00"
,
"Y1"
:110.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y1"
:110.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y1"
:110.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y1"
:110.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-04T00:00:00"
,
"Y1"
:120.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-05T00:00:00"
,
"Y1"
:130.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-06T00:00:00"
,
"Y1"
:140.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-10T00:00:00"
,
"Y1"
:150.0,
"GroupId"
:
"S1"
},{
"X1"
:
"2013-01-01T00:00:00"
,
"Y2"
:1.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-02T00:00:00"
,
"Y2"
:2.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y2"
:3.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y2"
:4.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-03T00:00:00"
,
"Y2"
:5.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-04T00:00:00"
,
"Y2"
:6.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-05T00:00:00"
,
"Y2"
:7.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-06T00:00:00"
,
"Y2"
:8.0,
"GroupId"
:
"S2"
},{
"X1"
:
"2013-01-07T00:00:00"
,
"Y2"
:9.0,
"GroupId"
:
"S2"
}]