ExtJS:在网格和图表之间共享存储

ExtJS: share store between grid and chart

本文关键字:之间 共享 存储 网格 ExtJS      更新时间:2023-09-26

我正在编写一个简单的应用程序,用于存储和显示带有时间戳的消息。消息是JSON对象,包含两个主要字段,例如:

{
  "emitted": "2011-12-08 12:00:00",
  "message": "This is message #666"
}

我有一个模型来描述这些消息:

Ext.define('Message', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'emitted', type: 'date'   },
        { name: 'message', type: 'string' }
    ]
});

在网格中显示这些消息没有问题。但是,我现在想在图表中显示这些消息。例如,我将能够获取数字(如上面示例中的#666)并显示折线图。

理想情况下,我不想为图表创建一个新的存储,我想重用相同的消息存储,但在字段上应用过滤器以获取适当的值。我不知道,可能像这样:

var chart = {
    xtype:   'chart',
    ...
    series: [{
        type:   'line',
        axis:   ['left', 'bottom'],
        xField: 'emitted',
        yField: {fieldName:'message', fieldGrabber: function(v) {
            new RegExp("This is message #('d+)$", "g").exec(v)[1]
        }}
    }]
};

在ExtJS中这种事情是可能的吗?我只是试图解释我想做什么,我不知道在哪里找到这样的功能:在图表类,在商店类,或使用一种代理商店。

注:我不能要求将数据正确格式化到服务器。我收到的消息没有备份到任何地方,它们只是通过socketIO流到客户端的实时事件。

任何建议都非常感谢!

您应该将模型中的值提取到单独的字段中:

Ext.define('Message', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'emitted', type: 'date'   },
        { name: 'message', type: 'string' },
        { name: 'nr', convert: function(v, r){
            return r.get('message').replace(/^.*#/, '');
        } }
    ]
});

或者你最好只是拥有'nr'字段,并在Grid中使用渲染器,将其显示为"这是消息#{nr}"。

那么你可以直接在图表中使用'nr'字段

我切换到Highcharts,把ExtJS扔到垃圾桶里:p