Question

嗨，有人知道如何在sencha touch中设置饼图的边框吗？我尝试了文档中的所有配置，但没有运气。

Answer 1

图表系列使用sprites绘制。您可以通过系列的subStyle选项传递自定义精灵属性。有关可用属性，请参阅sprite文档（和CSS画布属性）。

请注意，subStyle选项需要一组值，这些值将用于每个记录。

鉴于这一切，我们可以通过这种方式为docs pie chart example添加边框：

var chart = new Ext.chart.PolarChart({
    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,

        // --- Modification Here! ---

        subStyle: {
            strokeStyle: ['black', 'black', 'black', 'black', 'black'],
            lineWidth: [2,2,2,2,2]
        }

        // ---

    }]
});
Ext.Viewport.setLayout('fit');
Ext.Viewport.add(chart);

我认为，仅将边框添加到图表的外部部分会更加复杂。

如何在Sencha中设置饼图的边框

1 个答案: