尝试设计子弹图,使其完全符合营销部门的要求。所需的图表如下所示:
如何在栏的顶部添加标签?
我尝试从 Kendo 文档设置标签属性:
labels:
{
visible: true,
format: "{0}",
font: "14px Arial",
},
这是我无法运行的脚本:
$barChart = $("#bar-chart").empty();
$barChart.kendoChart({
theme: global.app.chartsTheme,
renderAs: "svg",
legend: {
position: "bottom"
},
seriesDefaults: {
type: "column"
},
series: [
{
type: "verticalBullet",
currentField: "score",
targetField: "average",
target: {
color: "#444",
dashType: "dot",
line: {
width: 1,
}
},
labels:
{
visible: true,
format: "{0}",
font: "14px Arial",
},
data: [
{
score: 93.7,
average: 65.2,
}, {
score: 80.2,
average: 22.2,
}, {
score: 60.8,
average: 35.2,
}, {
score: 82.1,
average: 45.2,
}, {
score: 74.2,
average: 55.2,
}
]
}
],
categoryAxis: {
labels: { rotation: -45 },
categories: ["Sales & Contracting", "Implementation & Training", "Functionality & Upgrades", "Service & Support", "General"],
line: {
visible: false
},
color: "#444",
axisCrossingValue: [0, 0, 100, 100]
},
tooltip: {
visible: false
}
}).data("kendoChart");
如有任何帮助,我们将不胜感激。
最佳答案
因为这不是一项受支持的功能,所以任何这样做的尝试本质上都是一种黑客行为。我看了看剑道演示,注意到有一个工具提示元素,其类为 k-tooltip,其中包含鼠标悬停时栏的总数。您应该查看鼠标悬停以显示总数。
关于javascript - 使用Kendo Dataviz Vertical Bullet Graph,如何添加类似于条形图的标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20908004/