Question

对Extjs来说是新手并且有一张我放在手风琴中的图表但是当我调整手风琴的大小时，图表不会调整大小。请帮助这是我的代码

var chart1 = Ext.create('Ext.chart.Chart',{
        animate: true,
        store: store,
        height:500,
        width:340,
        layout:'fit',
        legend:{
            visible:true,
            position:'right',
            labelFont:'10px Comic Sans MS'
        },
        margin:'30 0 0 0',
        //autoHeight:true,
        //insetPadding: 30,
        //other code here.......................
    });

以下是面板的代码

var chartPanel = new Ext.Panel({
        title:'Visualization Charts',
        //cls:'empty',
        items:[chart1]
    });

手风琴代码

var myaccordionwest = new Ext.Panel({
        title:'Data Visualization',
        region:'west',
        //margin:'5 0 5 5',
        split:true,
        width:'27%',
        layout:'accordion',
        collapsible:true,
        items:[chartPanel]
    });

Answer 1

您有图表的硬编码宽度和高度。应在具有一个子项的容器上使用布局拟合。因此，图表上的布局并不意味着什么，您应该将其移动到chartPanel。

所以这应该有效：

var chart1 = Ext.create('Ext.chart.Chart',{
        animate: true,
        store: store,
        legend:{
            visible:true,
            position:'right',
            labelFont:'10px Comic Sans MS'
        },
        margin:'30 0 0 0',
        //autoHeight:true,
        //insetPadding: 30,
        //other code here.......................
    });

var chartPanel = new Ext.Panel({
        title:'Visualization Charts',
        //cls:'empty',
        items:[chart1]
    });

var myaccordionwest = new Ext.Panel({
        title:'Data Visualization',
        region:'west',
        layout:'fit',
        //margin:'5 0 5 5',
        split:true,
        width:'27%',
        layout:'accordion',
        collapsible:true,
        items:[chartPanel]
    });

在手风琴中制作图表

1 个答案: