5

我的图表中的数据标签重叠列有问题。

$('#container').highcharts({
        chart: {
            type: 'column'
        },

        xAxis: {
            type: 'datetime'
        },
        series: [{
            data: [[Date.UTC(2013, 3, 1, 0, 0, 0), 169], 
                  [Date.UTC(2013, 4, 1, 0, 0, 0), 176], 
                  [Date.UTC(2013, 5, 1, 0, 0, 0), 470], 
                  [Date.UTC(2013, 6, 1, 0, 0, 0), 346], 
                  [Date.UTC(2013, 7, 1, 0, 0, 0), 252], 
                  [Date.UTC(2013, 8, 1, 0, 0, 0), 138]],
            dataLabels: {
                enabled: true
            }
        }]
    });
});

你可以在这里看到一个例子：http: //jsfiddle.net/J6WvR/1/

我的图表应该有固定的高度，但我不明白为什么无法计算最大列高以适合其数据标签。我怎样才能解决这个问题？

4

4 回答 4

15

根据官方 API 文档：溢出属性

要在绘图区域外显示数据标签，请将crop 设置为false并将overflow 设置为“ none ”。

            dataLabels: {
                enabled: true,
                crop: false,
                overflow: 'none'
            }
于 2013-10-16T08:07:20.357 回答
1

你可以试试 yAxis 的 max，

从您的数据中计算最大值并为其添加一些缓冲，例如 100 并将其设置为 yAxis 的最大值

yAxis:{
                max: 600,
            },

在http://jsfiddle.net/J6WvR/3/更新你的小提琴 max for yAxis

希望这对你有用

于 2013-10-16T08:01:04.737 回答
0

一种选择是移动标签的位置。例如，这会将它们移动到条内：

plotOptions: {
        column: {
            dataLabels: {
                y: 20,
                color:'white'
            }
        }
    },

http://jsfiddle.net/TBfLS/

另一种方法是手动设置最大值为标签腾出空间：

  yAxis: {
        max: 600,
        endOnTick: false
    },

http://jsfiddle.net/2AhVT/

希望这些选项之一会有所帮助。

Ivan Chau 发布了第三个（可能是更好的）选项。

于 2013-10-16T07:49:29.450 回答
0

启用 dataSorting highchart 后，它没有在堆积柱形图中正确显示数据标签

参考图像

于 2021-07-06T09:22:07.817 回答