0

我用 igDataChart jquery 控件开发了一个柱形图。图表中的所有数据都正确呈现，但其下方的标签最多只能显示十个。如果我将数字增加到 11 个，那么标签会每隔一个显示一个。在我的示例中，总数应该显示 14 个标签，但只有 7 个显示，并且每个其他标签都是可见的。（例如，1、3、5、7 等），但是；上图显示了所有列（两个系列 - 总共 28 列）。下面应该显示列标签的空格是空白的。

我的代码的这个链接上有一个例子。

$(function () {
var data = [
{"Entity":"THA","Complete":59,"Ineligible":2,},{"Entity":"THAL","Complete":66,"Ineligible":15,},{"Entity":"THAM","Complete":92,"Ineligible":22,},{"Entity":"THAZ","Complete":100,"Ineligible":3,},{"Entity":"THC","Complete":94,"Ineligible":5,},{"Entity":"THD","Complete":97,"Ineligible":15,},{"Entity":"THDN","Complete":76,"Ineligible":5,},{"Entity":"THFW","Complete":82,"Ineligible":24,},{"Entity":"THHEB","Complete":77,"Ineligible":3,},{"Entity":"THK","Complete":100,"Ineligible":38,},{"Entity":"THP","Complete":94,"Ineligible":14,},{"Entity":"THS","Complete":100,"Ineligible":5,},{"Entity":"THSW","Complete":72,"Ineligible":21,},{"Entity":"TOTAL","Complete":86,"Ineligible":15,},
 ];
$(function () {
$("#chart").igDataChart({
dataSource: data,
height: "355px",
width: "100%",
title: "Completion Summary",
subtitle: "",
axes: [{
name: "Entity",
type: "categoryX",
label: "Entity",
labelAngle: -45,
gap: 0.3,
}, {
name: "Percent",
type: "numericY",
title: "Percent"
}],
series: [{
// showTooltip: true enables the default tooltips
showTooltip: true,
// if a custom tooltipTemplate is set,
// the default tooltip will not be shown
showTooltip: true,
name: "Complete",
title: "Complete",
type: "column",
valueMemberPath: "Complete",
xAxis: "Entity",
yAxis: "Percent",
isTransitionInEnabled: true,
isHighlightingEnabled: true,
thickness: .05
}, {
showTooltip: true,
name: "Ineligible",
title: "Ineligible",
type: "column",
valueMemberPath: "Ineligible",
xAxis: "Entity",
yAxis: "Percent",
isTransitionInEnabled: true,
isHighlightingEnabled: true,
thickness: .05
}],
horizontalZoomable: true,
verticalZoomable: true,
windowResponse: "immediate"
});
});
});

我在 chrome、Firefox 和 IE 8-11 中测试过

我寻找了一个可以分配给 java 脚本的属性，该属性可以提供更多空间或设置允许的标签总数，但似乎没有类似的东西可用。存在任何建议或解决方法吗？

4

1 回答 1

2

x 轴默认以自动计算的间隔显示标签，并且会在标签开始碰撞时减少显示的标签数量。在您的情况下，您正在使用一些旋转以便能够以更高的密度显示更多标签，因此您应该指示轴使用 1 的间隔，而不是自动间隔。为此，您应该设置

interval: 1

在轴上。我已经更新了您的示例以向您展示我的意思：http: //jsfiddle.net/F8YWY/2/

于 2014-05-12T13:41:44.723 回答