javascript - Highcharts 数据显示前后的边距？

Question

我正在尝试使用区域堆积 Highcharts ，here's an example和 jsFiddle demo to play with

不幸的是，图表本身在 x 轴的开头和结尾处产生了丑陋的间隙。

这个问题已被再次提出，看起来答案是“不要使用 xAxis 的类别，删除它们并替换为 type: 'datetime'。不幸的是，我得到了来自后端的类别，我对此无能为力。任何其他设置(例如边距、填充、间距等)似乎根本不适用于类别。

有人知道如何解决这个问题吗？老实说，对我来说，它看起来更像是一个严重的 UI/UX 错误，而不是应该发生的事情。谁需要一张从边缘以外的地方开始的图表？! :)

还需要 7 个声誉才能发布图像，抱歉 URL:i.stack.imgur.com/lGxo6.png

简而言之:[b]尝试从 jsFiddles 示例中删除 GAPS，而不删除类别[/b]。这可能吗？

Answer 1

你是对的，这个问题问得很多，我应该为此准备自动回复。

那么答案是使用datetime轴或线性轴。你有后台的分类吗？没问题，只需将它们存储在某个变量中，然后编辑标签的格式化程序:http://jsfiddle.net/h7Akd/1/

var categories = ['1750', '1800', '1850', '1900', '1950', '1999', '2050'];

...             
        xAxis: {
            tickmarkPlacement: 'on',
            title: {
                enabled: false
            },
            tiickInterval: 1, //force to display categories one by one
            labels: {
                formatter: function(){
                     return categories[this.value];   
                }
            }
        },

现在您可以使用 xAxis.min/max 或 'xAxis.minPadding/maxPadding` 编辑最小值和最大值。

其他:

To be honest it looks more like a serious UI / UX bug to me than something that is supposed to happen. Who needs a chart that starts somewhere else than on its edge?! :)

你会感到惊讶.. 例如，使用列，您就会看到。相反，问题是为什么你不能更新后端以返回时间戳(对于日期应该是)？