0

在 xAxis 上有许多条目的条形图。但是他们彼此太近了。示例:http: //jsfiddle.net/XUsCq/

    xAxis: {
        categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania', 'Oceania'],
        title: {
            text: null
        }
    },
4

2 回答 2

0

数据太密集。将您的容器 div 更改为以下内容:

<div id="container" style="min-width: 400px; margin: 0 auto; height: 800px"></div>

您可以将 dataLabels 的样式更改为:

plotOptions: {
                bar: {
                    dataLabels: {
                        enabled: true,
                        style: {
                             fontSize: "8px"
                         }
                    }
                }
            }

但是,如果您有大量数据,那将无法解决问题。

最好的选择是根据您显示的元素数量调整容器的大小。

这是一个 Fiddle 链接,可以激发您的灵感:

小提琴

于 2013-07-26T08:41:37.140 回答
0

您的基本问题是您有太多数据无法放入可用空间。

有一些 highcharts 选项可以提供帮助:plotOptions 中的 groupPadding 和 pointPadding

 groupPadding:0,
 pointPadding:0,

但是,您可以做的最好的事情是通过在包含的 div 上设置更大的高度来使图表更高一些:

http://jsfiddle.net/eEHFH/

于 2013-07-26T08:43:43.157 回答