我需要在EXTJS 6中用放射线组围绕的图像

Question

我已经创建了一个面板，虽然使用了表格布局，但我无法弄清楚如何做到这一点。到目前为止，这是我的代码：

   Ext.define('genericNameSpace.ImpactDiagram', {
extend: 'Ext.window.Window',
xtype: 'crash-impactdiagram',

icon: 'css/img/car.png',
title: 'Impact Diagram',
closeAction: 'hide',

width: 500,
height: 355,
resizable: false,
constrain: true,
constrainTo: Ext.getBody(),
   

items: [
    // ADD Impact Diagram section
    {   
        xtype: 'panel',
        border: false, // optional
        items: [
            {                      
                xtype: 'panel',
                border: false, // optional,
                layout: {
                    type: 'table',
                    columns: 1,
                    tableAttrs: {
                        style: {
                            padding: '10px',
                            width: '100%',
                            height: '100%',
                            border:true,
                        }
                    },
                    tdAttrs: {
                        align: 'center',
                        valign: 'middle'
                    }
                },

                items: [
                    {
                        xtype: 'panel',
                        layout: {
                            type: 'table',
                            border: true,
                            columns: 9,
                            tableAttrs: {
                                border: true,
                                style: {
                                    width: '100%'
                                }
                            },
                            tdAttrs: {
                                align: 'middle'
                            }
                        },
                        items: [
                            {
                                xtype: 'radiofield',
                                inputValue: 1,
                                id: 'radio1',
                                colspan: 2,
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 2,
                                id: 'radio2',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 3,
                                id: 'radio3',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 4,
                                id: 'radio4',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 5,
                                id: 'radio5',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 6,
                                id: 'radio6',
                                readOnly: true
                            }, {
                                xtype: 'radiofield',
                                inputValue: 7,
                                id: 'radio7',
                                colspan: 2,
                                readOnly: true
                            },
                             {
                                 xtype: 'radiofield',
                                 inputValue: 8,
                                 id: 'radio8',
                                 colspan:2,
                                 readOnly: true
                             },
                            {
                                html: '<img src="css/img/cartop.png"/>',
                                colspan: 5
                            },
                             {
                                 xtype: 'radiofield',
                                 inputValue: 9,
                                 id: 'radio9',
                                 colspan: 2,
                                 readOnly: true
                             },
                            {
                                xtype: 'radiofield',
                                inputValue: 10,
                                id: 'radio10',
                                colspan: 2,
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                boxLabel: '',
                                inputValue: 11,
                                id: 'radio11',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 12,
                                id: 'radio12',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 13,
                                id: 'radio13',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 14,
                                id: 'radio14',
                                readOnly: true
                            },
                            {
                                xtype: 'radiofield',
                                inputValue: 15,
                                id: 'radio15',
                                readOnly: true
                            }, {
                                xtype: 'radiofield',
                                inputValue: 16,
                                id: 'radio16',
                                colspan: 2,
                                readOnly: true
                            }
                        ]
                    },
                    {
                        xtype: 'radiogroup',
                        vertical: false,
                        columns: 4,
                        flex: 1,
                        width: '100%',
                        allowBlank: false,
                        fieldLabel: '',
                        reference: 'collisionTypeRadioList',
                        defaults: {
                            name: 'selectedCollisionType',
                            padding: '10px 10px 10px 10px'
                        },
                        listeners: {
                            change: 'collisionTypeChanged'
                        },
                        items: [{
                            boxLabel: 'Under',
                            inputValue: 0,
                            readOnly: true
                        }, {
                            boxLabel: 'Overturn',
                            inputValue: 1,
                            readOnly: true
                        }, {
                            boxLabel: 'None',
                            inputValue: 2,
                            readOnly: true
                        }, {
                            boxLabel: 'Other',
                            inputValue: 3,
                            readOnly: true
                        }]
                    }
                ]
            }
        ]
    }
],

  
});

我无法弄清楚如何布局下图所示的面板。

窗口显示正确， 面板显示正确， 收音机显示得很好。

唯一的问题是无线电不是很中心，几乎就像有一些填充，但我无法摆脱它......