javascript - Ember チャートのデータの書式設定。

Question

アプリにember-chartsを使用して、同じモデルから複数の異なるグラフを表示しています。Ember-charts は、特定の方法でフォーマットされたデータを受け取ります。以下のコードのようなオブジェクトの配列。
私は好みに合わせcomputed propertiesてデータをフォーマットするために使用しています。 これは機能します。しかし、多くのチャートがあり、データをフォーマットする方法が非常に似ていることを考えると、重複するコードの量に不満があり、ember-charts のデータをフォーマットするより良い方法があるかどうか疑問に思っていました. 私は今、自分のモデルを生成するために 使用しています。ember-charts


Ember 2.4ember-cli-mirage

コントローラ：

import Ember from 'ember';

export default Ember.Controller.extend({
    sqByU: Ember.computed("model.[]", function() {
        let arr = [], model = this.get('model');
        model.content.map(function(item) {
            let d = item._data;
            arr.pushObjects([
                { "label": 'Manufacturing', "group": d.location, "value": d.manufacturing },
                { "label": 'Warehouse', "group": d.location, "value": d.warehouse },
                { "label": 'Research & Development', "group": d.location, "value": d.rAndD },
                { "label": 'Mechanical Support', "group": d.location, "value": d.mechSupport },
                { "label": 'Office', "group": d.location, "value": d.office }
            ]);
        });
        return arr;
    }),
    annualFacilityCost: Ember.computed("model.[]", function() {
        let arr = [], model = this.get('model');
        model.content.map(function(item) {
            let d = item._data;
            let facilCost = d.opexSpend/(d.manufacturing + d.warehouse + d.rAndD + d.mechSupport + d.office);
            arr.pushObjects([
                {"label": 'IFMA Benchmark', "group": d.location, "value": d.ifmaBenchmark },
                {"label": 'Facility Cost', "group": d.location, "value": facilCost }
            ]);
        });
        return arr;
    }),
});

テンプレート:

<div class="col-md-4">
    {{#box-reg title="Square Foot by Utilization"}}
        {{vertical-bar-chart maxBarThickness=100 selectedSeedColor="rgb(13,71,161)" stackBars=true data=sqByU }}
    {{/box-reg}}
</div>
<div class="col-md-4">
    {{#box-reg title="BSC Total Annual Facility Cost/SF"}}
        {{vertical-bar-chart maxBarThickness=100 selectedSeedColor="rgb(13,71,161)" data=annualFacilityCost }}
    {{/box-reg}}
</div>