各線が1日の株価のパフォーマンスであるグリッドを描画しようとしています。私のデータ構造にはDate
、、、、Stock
およびStock Price
リソースがあります。私のグリッドに接続されているストアはStock Price
ストアです。
したがって、私の理解の限りでは、私の最大の問題は、グリッドセルレンダラーの場合、すでに値を持っている必要があるか、値を取得するためにブロッキング関数を持っている必要があるということです。
魔法の関数を使うgetStore()
と、レコードはそれを知らないと言われます(未定義のメソッド)。レコードにはスタンドアロンモデルと同じ機能がないため、'だと思います。
私はこれからいくつかの方法を見ます:
- ロードが発生したときに、関連するすべての行が同時にロードされるように、グリッドやストアをカスタマイズします。
- レンダラーでコールバックを作成し、後でセルの値を変更しますが、これを行う方法は正確にはわかりません。セルの値()を実際に変更するの
StockId
ではなく、表示される出力(Symbol
)だけを変更します。 - 私の見解に一致するようにAPIを変更します。
これらを要約すると、#1は、一見単純な結果を得るには多くの作業のように思われます。私はアソシエーションを使い続けようとしていますが、あちこちの小さなことを除けば、実際には役に立たないことがわかりました。確かに、大量のデータには役立ちません。#2現時点では、どこから始めればよいのかよくわかりません。#3は大規模なやり過ぎのように思われ、通常、サーバー側を台無しにします。これは、結合がさらにいくつか発生し、レコードを保存する際の複雑さが増すことを意味するためです。
したがって、2つの部分からなる質問:
- グリッド内の関連モデルから値をロードする方法を知っている人はいますか?
- そうでない場合は、好奇心をそそるために、画面上で処理するデータがたくさんある場合に、関連付けはどのようなものに使用されますか?大量のデータがExtとjQueryUIまたはその他のUIフレームワークを使用する理由のように思われるので、関連付けは何のためにあるのか疑問に思います。
モデル-株価
Ext.define('MyApp.model.StockPrice', {
extend : 'Ext.data.Model',
idProperty : 'StockPriceId',
fields : [ {
name : 'StockId',
type : 'int'
}, {
name : 'Open',
type : 'float'
}, {
name : 'Close',
type : 'float'
}, {
name : 'DateId',
type : 'date'
}],
proxy : {
type : 'rest',
url : '/api/stock.price'
},
reader : {
type : 'json'
},
associations : [ {
type : 'hasOne',
model : 'MyApp.model.Date',
primaryKey : 'DateId',
foreignKey: 'DateId'
},{
type : 'hasOne',
model : 'MyApp.model.Stock',
primaryKey : 'StockId',
foreignKey : 'StockId'
} ]
});
モデル-ストック
Ext.define('MyApp.model.Stock', {
extend : 'Ext.data.Model',
idProperty : 'StockId',
fields : [ {
name : 'StockId',
type : 'int'
}, {
name : 'Symbol',
type : 'string'
} ],
proxy : {
type : 'rest',
url : '/api/stock'
},
reader : {
type : 'json'
},
associations : [ {
type : 'hasMany',
model : 'MyApp.model.StockPick',
primaryKey : 'StockId',
foreignKey : 'StockId'
}]
});
モデル-日付
Ext.define('MyApp.model.Date', {
extend : 'Ext.data.Model',
fields : [ 'DateId', 'Date' ]
});
ストア-株価
Ext.define('MyApp.store.StockPrice', {
extend : 'Ext.data.Store',
model : 'MyApp.model.StockPrice',
remoteSort : true,
remoteFilter : true,
pageSize : 5,
autoLoad : true
});
ビュー-株価
Ext.define('MyApp.panel.StockData', {
extend : 'Ext.grid.Panel',
store : 'MyApp.store.StockPrice',
columns : [
{
text : 'Symbol',
flex : 1,
sortable : false,
hideable : false,
dataIndex : 'StockId',
renderer : function(stockId, metadata, stockPriceRecord) {
// What goes in here? PROBLEM POINT
MyApp.model.Stock.load(stockId, function() {
// ... some callback
});
// OR
return stockPriceRecord.getStock().get('Symbol');
}
},
{
text : 'Open',
flex : 1,
dataIndex : 'Open',
renderer : 'usMoney'
},
{
text : 'Close',
flex : 1,
dataIndex : 'Close',
renderer : 'usMoney'
},
{
text : 'Volume',
flex : 1,
dataIndex : 'Volume'
}]
});