0

プロット エリアの高さ全体を利用できないという問題があります。特定のカテゴリ (A から H) に広がる人数を示すグラフを作成しています。泡の大きさは人数を表しています。http://jsfiddle.net/rnilsen/fXzke/8/を参照してください。泡の大きさは5個から600個とかなりバラつきがありますが、よく見ると大きさの違いはほとんどわかりません。

コンテンツ div の高さはわずか 75 ピクセルです。ただし、たとえば 300px に変更すると、すぐに違いがわかります。バブルを 300px に変更したときと同じように表示したいのですが、小さなスペースに収まるように下のグラフを使用します。

基本的に利用可能なすべての高さを使用して、これをどのように達成できますか?

これが私が使用するチャートです：

$(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 に答える