0

我有一个问题，我无法利用情节区域的全部高度。我正在制作一个图表，说明在给定类别（A 到 H）上分布的人数。气泡的大小代表人数。请参阅http://jsfiddle.net/rnilsen/fXzke/8/。气泡的大小变化很大，从 5 到 600 不等，但在观察时，您几乎看不到大小的差异。

内容 div 只有 75px 的高度。但是，如果我将其更改为例如 300 像素，您将立即看到不同之处。我希望气泡看起来与将其更改为 300 像素时相同，但使用较低的图表以适应小空间。

我怎样才能做到这一点，基本上使用所有可用的高度？

这是我使用的图表：

$(function () {
window.chart = new Highcharts.Chart({

    chart: {
        renderTo: 'container',
        zoomType: 'x',
        marginBottom: 25,
        marginTop: 0,
        plotBorderColor: 'red',
        plotBorderWidth: 1,
        spacingTop: 0,
        spacingBottom: 0,
    },

    credits : {
        enabled : false
    },

    exporting: {
        enabled: false
    },

    title: null,

    xAxis: {
        lineWidth: 0,
        lineColor: 'transparent',
        labels: {
            enabled: true
        },
        categories: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H'],
    },

    yAxis: {
        lineColor: 'transparent',
        labels: {
            enabled: false
        },
        title: { text: null },
    },

    plotOptions: {
        lineWidth: 0
    },

    legend: {
        enabled: false
    },

    series: [
    {
        type: 'bubble',
        lineWidth: 0,

        data: [
            [0, 0, 5],
            [1, 0, 10],
            [2, 0, 200],
            [3, 0, 600],
            [4, 0, 20],
            [null,null,null],
            [6, 0, 500],
            [7, 0, 400]
        ],
    }]
});

});

4

1 回答 1

2

有设置最小/最大气泡大小的选项。默认情况下，最大尺寸为图表高度的 20%。您可以在 plotOptions 中更改它，例如：

 plotOptions: {
        lineWidth: 0,
         bubble: {
                minSize:2,
                maxSize:"50%"
         }
    },

请注意，您还可以将最大值设置为像素数。

于 2013-03-27T15:25:55.767 回答