how to remove space above semicircle angular gauge

Question

When creating a semicircle angular gauge with highcharts, I always get empty space above the gauge using the following pane settings:

    ....
    pane: {
        startAngle: -90,
        endAngle: 90,
            center: ['50%', '100%']
            ...
    }
    ...

Here's an example: http://jsfiddle.net/eM8A7/

Reducing the height of the container div just makes the gauge smaller, but leaves the space. Tested this with Chrome and IE.

Is there a way to remove the empty space or am I attempting this incorrectly?

Answer 1

您需要设置pange的大小:http://jsfiddle.net/eM8A7/1/

    pane: {
        startAngle: -90,
        endAngle: 90,
        size: '150%',
        center: ['50%', '100%'],
    }

禁用边距也是个好主意:

    chart: {
        type: 'gauge',
        plotBackgroundColor: null,
        plotBackgroundImage: null,
        plotBorderWidth: 0,
        plotShadow: false,
        margin: [0,0,0,0]
    },