javascript - 내부 파이가없는 Highcharts 도넛 형 차트?

두 요소 (키/값) 배열의 배열로 데이터를 제공하면됩니다. innerSize 를 지정하십시오  도넛 스타일을 얻을 수 있습니다.

매개 변수에는 다음과 같은 내용이 포함됩니다 :

...
data: [["Firefox",6],["MSIE",4],["Chrome",7]],
innerSize: '20%',
...

다음은 완전한 예제의 jsFiddle입니다.

**I hope this example of highchat will solve your problum
http://jsfiddle.net/e2qpa/3/
$(function() {
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'pie'
        },
        plotOptions: {
            pie: {
                borderColor: '#000000',
                innerSize: '60%'
            }
        },
        series: [{
            data: [
                ['Firefox', 44.2],
                ['IE7', 26.6],
                ['IE6', 20],
                ['Chrome', 3.1],
                ['Other', 5.4]
                ]}]
    },
    // using
    function(chart) { // on complete
        var xpos = '50%';
        var ypos = '53%';
        var circleradius = 102;
    // Render the circle
    chart.renderer.circle(xpos, ypos, circleradius).attr({
        fill: '#ddd',
    }).add();
    // Render the text
    chart.renderer.text('THIS TEXT <span style="color: red">should be in the center of the donut</span>', 155, 215).css({
            width: circleradius*2,
            color: '#4572A7',
            fontSize: '16px',
            textAlign: 'center'
      }).attr({
            // why doesn't zIndex get the text in front of the chart?
            zIndex: 999
        }).add();
    });
});

이것은 최고의 검색 결과였으며 주어진 답변이 저에게 효과가 없었습니다. 단순한 배열 배열보다 데이터 점에 대한 더 많은 제어가 필요했습니다. 특정 데이터에 대한 명시적인 색상과 같은 추가 옵션을 구성하려면 JSON 객체를 사용해야했습니다. 일부 연구를 통해 데이터 형식을 전혀 수정할 필요가 없다는 것을 알았습니다. 원형 차트를 도넛 형 차트로 만들려면 데이터 계열에서 innerSize 값을 0보다 크게 설정하기 만하면됩니다.

하이 차트 문서에서 :

와이즈 비즈

다음과 같은 데이터로 간단한 도넛 형 차트를 얻을 수 있습니다 :

 
innerSize: The size of the inner diameter for
  the pie. A size greater than 0 renders a donut chart. Can be a
  percentage or pixel value. Percentages are relative to the pie size.
  Pixel values are given as integers.

JS 피들

series: [{ innerSize: '30%', data: [ {name: 'Yellow Slice', y: 12, color: 'yellow'}, {name: 'Red Slice', y: 10, color: 'red' }, {name: 'Blue Slice', y: 33, color: 'blue'}, {name: 'Green Slice', y: 20, color: 'green'} ] }]