Question

图表：

var chart = Ext.create('Ext.chart.Chart', {  
    style: 'background:#fff',  
    animate: true,  
    shadow: true,  
    store: store1,  
    axes: [{  
        type: 'Numeric',  
        position: 'left',  
        fields: ['data1'],  
        label: {  
            renderer: Ext.util.Format.numberRenderer('0,0')  
        },  
        title: 'Number of Hits',  
        grid: true,  
        minimum: 0  
    }, {  
        type: 'Category',  
        position: 'bottom',  
        fields: ['name'],  
        title: 'Month of the Year'  
    }],
    series: [{  
        type: 'column',  
        axis: 'left',  
        highlight: true,  
        tips: {  
          trackMouse: true,  
          width: 140,  
          height: 28,  
          renderer: function(storeItem, item) {  
            this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + ' $');  
          }  
        },  
        label: {  
          display: 'insideEnd',  
          'text-anchor': 'middle',  
            field: 'data1',  
            renderer: Ext.util.Format.numberRenderer('0'),  
            orientation: 'vertical',  
            color: '#333'  
        },  
        xField: 'name',  
        yField: 'data1'  
    }]  
});

这不起作用。

{  
        xtype : 'panel',  
        layout : {  
            type : 'hbox',  
            pack : 'center'  
        },  
        id:'graphpanel',  
        width : 940,  
        margin : '20 0 20 0',  
        border : 0,  
        items: chart  
}

这是有效的。

var win = Ext.create('Ext.window.Window', {  
    width: 800,  
    height: 600,  
    minHeight: 400,  
    minWidth: 550,  
    hidden: false,  
    maximizable: true,  
    title: 'Bar Chart',  
    autoShow: true,  
    layout: 'fit',  
    items: chart  
});

这是我的问题图在弹出窗口中正常工作但在面板中没有。如果我先弹出窗口，那么只有图形在面板中呈现 pl＆＃39; z对于错误的代码格式化抱歉... :(

Answer 1

您没有为图表提供尺寸，无论是显式（给它宽度和高度）还是隐式（通过使用适当的布局）。

面板布局应为fit。此外，请确保该面板的父级给它一个高度。

ExtJS Graph不在面板内渲染

1 个答案: