EXTJS4自学手册——组合图像

 Ext.create('Ext.panel.Panel', {
                title: '组合图像',
                renderTo: 'ComplexDiagram',
                items: [{
                    xtype: 'button',
                    text: '缩放的字',
                    margin:'5px',
                    handler: function (btn) {
                        Ext.create('Ext.window.Window', {
                            layout: 'fit',
                            width: ,
                            height: ,
                            items: Ext.create('Ext.draw.Component', {
                                viewBox: false,
                                items: [{
                                    type: 'circle',
                                    fill: '#0066CC', //blue
                                    radius: ,
                                    x: ,
                                    y:
                                },{
                                    type: 'circle',
                                    fill: '#00CC66', //green
                                    radius: ,
                                    x: ,
                                    y:
                                },{
                                    type: 'circle',
                                    fill: '#FF9933', //orange
                                    radius: ,
                                    x: ,
                                    y:
                                },{type: 'text',
                                    text: 'Model',
                                    fill: '#000', //black
                                    font: '12px "Arial"',
                                    x: ,
                                    y:
                                },{
                                    type: 'text',
                                    text: 'View',
                                    fill: '#000',
                                    font: '12px "Arial"',
                                    x: ,
                                    y:
                                },{
                                    type: 'text',
                                    text: 'Controller',
                                    fill: '#000',
                                    font: '12px "Arial"',
                                    x: ,
                                    y:
                                },{
                                    type: 'rect',
                                    fill: '#CC0000', //red
                                    width: ,
                                    height: ,
                                    x: ,
                                    y:
                                },{
                                    type: 'rect',
                                    fill: '#CC0000',
                                    width: ,
                                    height: ,
                                    x: ,
                                    y: ,
                                    rotate: {
                                        degrees:  // line in diagonal \
                                    }
                                },{
                                    type: 'rect',
                                    fill: '#CC0000',
                                    width: ,
                                    height: ,
                                    x: ,
                                    y: ,
                                    rotate: {
                                        degrees:  // line in diagonal /
                                    }
                                }]
                            })
                        }).show();
                    }
                }]
            })

显示效果：