EXTJS相关..100分求解.关于chart传store问题.

[路过路人乙]

项目里面的规范已经定下来了..

我必须在项目Script部分的view中对chart进行定义...

那么在view和controller里面分别怎么写才能让chart在页面上显示出来啊..求个最简单的例子..

以下是我源码的view里面的源码..

Ext.define('Ux.view.JctjChart.YyjcChartVw', {
    extend: 'Ext.container.Container',
    alias: 'widget.yyjcchartpanel',
    requires: [
        'Ext.ux.IFrame'
    ],
    layout: 'border',
    items: [{
        region: 'north',
        xtype: 'toolbar',
        height: 36,
        defaults: {
            labelAlign: 'middle',
            labelWidth: 60,
            width: 150,
            style: "margin-top:10px,margin-left:5px;margin-right:5px; margin-bottom:2px"
        },
        items: [
        {
            xtype: 'datefield',
            width: 180,
            fieldLabel: '开始日期',
            name: 'startdate',
            format: 'Y-m-d',
            labelAlign: 'right',
            value: new Date()
        }, 
         {
             //iconCls: 'icon-add',
             xtype: 'button',
             name: 'ok',
             width: 70,
             text: '确定',
             textAlign: 'center'
         }]
    }, {
        xtype: 'chartpanel',
        region: 'center'
    }, {
        xtype: 'yyjcchart',
        region: 'center'
    }]
});
Ext.define('Ux.form.ChartForm', {
    extend:'Ext.form.Panel',
    alias:'widget.chartpanel',
    
    layout:'fit'
});
Ext.define('Ux.form.YyjcChartPanel', {
    extend: 'Ext.chart.Chart',
    alias: 'widget.yyjcchart',
    renderTo: 'chartpanel',
    xtype: 'chart',
    legend: {
        position: 'top'
    },
    theme: 'Base:gradients',
    store: 'Ux.store.JctjChart.YyjcChartSt',
    axes: [{
        type: 'Numeric',
        minimum: 0,
        position: 'left',
        fields: ['运用合计', '客运', '动车组', '行包', '货物', '小运转', '路用', '补机', '专调', '运用其他'],
        title: '运用机车台日数',
        minorTickSteps: 1,
        grid: {
            odd: {
                opacity: 1,
                fill: '#ddd',
                stroke: '#bbb',
                'stroke-width': 0.5
            }
        }
    }, {
        type: 'Category',
        position: 'bottom',
        fields: ['系统日期'],
        title: '日期'
    }],
    series: [{
        type: 'line',
        highlight: {
            size: 7,
            radius: 7
        },
        axis: 'left',
        smooth: true,
        xField: '系统日期',
        yField: '运用合计',
        markerConfig: {
            type: 'circle',
            size: 4,
            radius: 4,
            'stroke-width': 0
        }
    ........}
    ]
});

以下是我源码的controller里面的源码..

Ext.define('Ux.controller.JctjChart.YyjcChartCt', {
    extend: 'Ext.app.Controller',
    views: ['JctjChart.YyjcChartVw'],
    models: ['JctjChart.YyjcChartMd'],
    stores: ['JctjReport.DicCjbm', 'JctjReport.DicCjbmAll', 'JctjChart.YyjcChartSt'],
    refs: [
        { ref: 'jctjChart', selector: 'tabpanel yyjcchartpanel uxiframe' },
        { ref: 'jctjChartbar', selector: 'tabpanel yyjcchartpanel toolbar' },
    ],

    init: function () {
        this.control({
            'tabpanel > yyjcchartpanel > toolbar': {
                afterRender: this.onAfterRender
            },
            'tabpanel > yyjcchartpanel > toolbar > [name=ok]': {
                click: this.onClick
            }
        });
    },
    onAfterRender: function (toolbar, eOpts) {
        var cjstore = Ux.store.JctjReport.DicCjbmAll.create();
        var AllCj = new Ux.model.JctjReport.DicCjbm({ cjdm: 'A', cjmc: '全  部', ord: '0' });
        cjstore.on(
                { load: function (store, records, successful, eOpts) {
                    if (successful) {
                        cjstore.insert(0, AllCj);
                    }
                }
                })
        //var yystore = Ux.store.JctjChart.YyjcChartSt.create();
        toolbar.down('[name=cjCombox]').bindStore(cjstore);
        if (toolbar.down('[name=cjCombox]').store) {
            toolbar.down('[name=cjCombox]').store.load();
            toolbar.down('[name=cjCombox]').setValue('A');
        }


    },
    onClick: function (button, e, eOpts) {
        var sStart = Ext.util.Format.date(this.getJctjChartbar().down('[name=startdate]').getValue(), 'Y-m-d');
        var sEnd = Ext.util.Format.date(this.getJctjChartbar().down('[name=enddate]').getValue(), 'Y-m-d');
        var sCjbm = this.getJctjChartbar().down('[name=cjCombox]').getValue();
        var sJclx = this.getJctjChartbar().down('[name=jclxCombox]').getValue();
        var sDom = this.getJctjChartbar().down('[name=domCombox]').getValue();
        var sWhere_Tmp = Ext.encode({ start: sStart, end: sEnd, cjdm: sCjbm, jclx: sJclx, dom: sDom });
        var yystore = Ux.store.JctjChart.YyjcChartSt.create();
        //===这里如何写代码能让store传递并且显示出chart...
    }

});

请问click里面怎么写才能将store传递进去并且显示出来,,,

[Go 旅城通票]

var yystore = Ux.store.JctjChart.YyjcChartSt.create();

调用store的load方法请求url获取数据就行了，ext会依据store的更改更新chart的ui

yystore.load({params:{/*...其他的参数*/}})

[路过路人乙]

引用 1 楼 showbo 的回复:

var yystore = Ux.store.JctjChart.YyjcChartSt.create(); 调用store的load方法请求url获取数据就行了，ext会依据store的更改更新chart的ui

yystore.load({params:{/*...其他的参数*/}})

你好.. 这个方法我知道..这是加载store..但是我想问的是.怎么传给在view界面的chart并且显示出来..

[Go 旅城通票]

引用 3 楼 HelpToMe 的回复:

[quote=引用 1 楼 showbo 的回复:] var yystore = Ux.store.JctjChart.YyjcChartSt.create(); 调用store的load方法请求url获取数据就行了，ext会依据store的更改更新chart的ui

yystore.load({params:{/*...其他的参数*/}})

你好.. 这个方法我知道..这是加载store..但是我想问的是.怎么传给在view界面的chart并且显示出来..[/quote] 你view界面添加了chart了没有？添加了你更新chart的store，ext会自动绘制数据到chart里面的