문제

I am attempting to follow this example for creating a pie chart but my chart does not display labels for the sections. I copied and used the exact code from the example linked above.

The chart display complete with color sections but there are no labels like in the example.

My code is pasted below:

    Ext.define('RevivalTimes.view.Chart', {
        extend: 'Ext.chart.PolarChart',
        xtype: 'chart',

        requires: [
            'Ext.chart.series.Pie',
            'Ext.chart.interactions.Rotate'
        ],

        config: {
            title: 'Statistics',
            iconCls: 'settings',

            layout: 'fit',

            animate: true,
            interactions: ['rotate'],
            colors: ['#115fa6', '#94ae0a', '#a61120', '#ff8809', '#ffd13e'],
            store: {
              fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
              data: [
                  {name: 'metric one',   data1: 10, data2: 12, data3: 14, data4: 8,  data5: 13},
                  {name: 'metric two',   data1: 7,  data2: 8,  data3: 16, data4: 10, data5: 3},
                  {name: 'metric three', data1: 5,  data2: 2,  data3: 14, data4: 12, data5: 7},
                  {name: 'metric four',  data1: 2,  data2: 14, data3: 6,  data4: 1,  data5: 23},
                  {name: 'metric five',  data1: 27, data2: 38, data3: 36, data4: 13, data5: 33}
              ]
            },
            series: [{
                type: 'pie',
                label: {
                    field: 'name',
                    display: 'rotate'
                },
                xField: 'data3',
                donut: 30
            }]

        } //config
    });
도움이 되었습니까?

해결책

The labels show with the inclusion of labelField as shown in the code below:

series: [{
    type: 'pie',
    label: {
        field: 'name',
        display: 'rotate'
    },
    xField: 'data1',
    donut: 30,

    labelField: 'name',
    showInLegend: true,
}],
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top