Gauge chart Highchart size of the graph issue

Question

I am facing a weird issue for size of the graph.

I want the size of strip like this.

However, I am getting like this.

You can see my efforts below.

chart: {
                type: 'gauge',
                alignTicks: false,
                height: 330,
                width: 160
            },

            title: null,
            pane: {
                startAngle: -90,
                endAngle: 90,
                size: '90%',
                background: [{
                    backgroundColor: '#fff',
                    borderWidth: 0
                }]
            },
            yAxis: {
                min: 0,
                max: 100,
                tickPosition: 'inside',
                tickColor: '#666',
                tickLength: 10,
                tickWidth: 0,
                minorTickWidth: 3,
                minorTickColor: '#fff',
                minorTickPosition: 'inside',
                minorTickLength: 0,
                minorTickInterval: null,
                offset: -10,
                lineWidth: 0,
                labels: {
                    enabled: false
                },
                endOnTick: false
            }

Your help would be appreciated.

Answer 1

If I understand your Question correctly: in a Gauge chart the 'width' of the strips is determined by the option thickness of each plotBand.

plotBands: [{
            from: 0,
            to: 20,
            thickness: 40,
            color: '#55BF3B' // green
        }, {
            from: 20,
            to: 60,
            thickness: 40,
            color: '#DDDF0D' // yellow
        }, {
            from: 60,
            to: 100,
            thickness: 40,
            color: '#DF5353' // red
        }]

See http://jsfiddle.net/doc_snyder/zd9mshm7/ for an example.