Kendo UI多轴图表数据源

Question

我们想绘制一个带有远程数据绑定的多轴图表。但它不适用于非内联数据源。我们试过了

• 与内联数据:OK

• 与本地数据:NOK

• 与远程数据:NOK

This works - inline

$("#pareto").kendoChart({
title: {
text: "Pareto chart"
},
legend: {
position: "bottom"
},
series:[
{"type":"column","axis":"qty","color":"#3CA84B","name":"Quantity","data":[43]},
{"type":"line","axis":"ratio","color":"#3279FD","name":"Ratio","data":[100]}
],
valueAxis: [
{
name: "qty",
title: {text: "Quantity"},
min: 0
},
{
name: "ratio",
min: 0,
max: 100,
title: {text: "Ratio"},
}
],
categoryAxis: {
categories: ["Something"],
axisCrossingValue: [0, 10]
},
tooltip: {
visible: true,
format: "N0"
}
});

这行不通- local:

let seriesData = [
{"type":"column","axis":"qty","color":"#3CA84B","name":"Quantity","data":[43]},
{"type":"line","axis":"ratio","color":"#3279FD","name":"Ratio","data":[100]}
];
dataSource: {
data: seriesData,
},

这行不通- remote：(远程源将返回与上述本地变量相同的结构。)

dataSource: {
transport: {
read: {
url: "/order/paretochart/7",
dataType: "json"
}
},
},

Answer 1

首先，您需要像这样设置系列(为每个系列添加字段名称):

series:[
{"type":"column","axis":"qty","color":"#3CA84B","name":"Quantity","field":"qtyf"},
{"type":"line","axis":"ratio","color":"#3279FD","name":"Ratio","field":"ratiof"}
], 

这需要由远程源返回或在本地值(seriesData)中设置:

[
{"qtyf": 56,"ratiof": 100}
]

有多少个categoryAxis类别就有多少个对象。键(qtyf, ratio of)是字段名，用于标识categoryAxis上每个类别的值轴。