Highcharts Pie chart

0
votes

I'm looking for half-pie chart similar to this:

i.stack.imgur.com/I26zG.png

I'm looking for gauge chart but in this case series don't printed, only print the dial values, and don't get to print bands

I'm thinking to printed with realtime plotband. But in this case the chart api is not possible to change or I don't find it.

Use the pie chart is other possibility, but in this case I need to start from -90º to +90º, and I don't find anything how to use, and type=pie doesn't have pane (//api.highcharts.com/highcharts#pane) option.

Can anyone help me?

2
highchartsgauge

2 Answers

1
votes

You can call Axis.update() and pass it an object of Axis config settings. One of those settings can be new plotBands values. So every time you update the gauge value, you reset the plotBands on either side of the gauge value. You'll need to tweak other things to get my example to look just like your image.

Check out this jsFiddle: http://jsfiddle.net/ZrGut/

yAxis.update({
    plotBands: [{
        from: 0,
        to: leftVal,
        color: 'pink',
        innerRadius: '100%',
        outerRadius: '0%'
    },{
        from: leftVal,
        to: 90,
        color: 'tan',
        innerRadius: '100%',
        outerRadius: '0%'
    }]
}, false);
1
votes

Finally yesterday at night I found other solution, attach de fiddle. Thanks for your help. 

  plotOptions: {
            pie: {
                startAngle: 0,
                allowPointSelect: true,
                innerSize: '110%',
                size:'150%',
                center: [100,200],
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: null,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                }
            }
        }