javascript - jqplot中的长标签

Question

我正在使用 jqplot 动态生成一些图表。

我的一些标签是非常长的文本字符串，不能很好地显示 - 我沿 x 轴以 30 度角打印它们，但长标签跑到页面的右侧。

有没有办法为标签设置最大宽度（理想情况下与图表上的条相同）并使标签的文本换行？

Answer 1

我认为你可以使用 CSS 来做到这一点。由于.jqplot-xaxis-tick{ width: xxx px;}（分别为 jqplot-yaxis-tick、jqplot-y2axis-tick...），来自 xaxis 的刻度是可定制的

Answer 2

几个月前我遇到了同样的问题。这是来自@boro 的一个很好的解决方案的问题：

JqPlot : 为不包括 y 轴标签的图形区域设置固定高度值

Answer 3

我用javascript解决了。需要在window.onload上执行脚本，否则无法获取图表的DOM元素。

window.onload = function() {
    var xAxisLabel = document.getElementsByClassName("jqplot-xaxis-tick");
    var i;
    for (i = 0; i < xAxisLabel.length; i++) {
        if(i%2 == 0)
        xAxisLabel[i].style.top = "32px";
    }
};

基本上我将元素的垂直位置更改为 2%0 位置。比你需要调整一些css属性

.jqplot-xaxis{margin-top:10px; height: 50px !important;}

.jqplot-xaxis 是 xaxis 标签栏的类。