Jaspersoft Studio html5图表（highchart）xAxis标签溢出

Question

我在Jaspersoft Studio中创建了一个HTML5（高图表）柱形图，但是xAxis标签可能很长，并且与看起来很糟糕的图例重叠。公司标准规定图例必须在底部，标签旋转270度，所以它们是垂直的。这意味着不幸的是，我不能移动图例或旋转标签，所以我想这样做，标签在一定长度后就会切断，只显示部分，以防止太长时与图例重叠。

此页面包含可应用于 xAxis 标签的所有属性的列表：

http://api.highcharts.com/highcharts/xAxis.labels

我已经尝试过使用这里列出的溢出属性，但似乎只与绘图区内的标签相关，即:

xAxis
     labels
           overflow:false

那么有没有人知道一种方法可以限制xAxis标签的长度，以防止它与下面的图例重叠？

Answer 1

转到图表属性

将“我的文本”替换为您的< code>$V{}或< code>$F{}或任何其他适当的用作xAxis标签的值，并将子字符串限制为最适合您的图表。

或者，通过在< code >下面添加代码，将它直接添加到源代码编辑器中的图表设置中

<hc:chartProperty name="xAxis.labels.format">
    <hc:propertyExpression><![CDATA[('My Text').substring(0, 5)]]></hc:propertyExpression>
</hc:chartProperty>

Answer 2

我对jaspersoft工作室一无所知。所以，我不确定这在你的情况下是否行得通。

但是，对于直接的HighCharts，您可以为标签启用useHTML，然后在css中设置标签宽度。

Javascript：

Highcharts.chart('container', {
    chart: {
        marginBottom: 80
    },
    xAxis: {
        categories: ['Long name 1', 'longer name number 2', 'this one is really really really long', 'Kinda long, but not longest', 'short', 'long name that is long', 'I think you get the point', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
        labels: {
            rotation: 45,
            useHTML:true
        }
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});

中文（

.highcharts-axis-labels span{ 
  width:30px;
}

http://jsfiddle.net/0jwf9nb6/1/