0

「作成済み」、「クローズ済み」、「提出済み」のデータなど、Y 軸にカウント、X 軸に日付を含むさまざまな値を表示する棒グラフを作成する必要があります。

どの基準でも、これを成功させることができます。ただし、複数のバーを表示することはできません。

以下は私が現在使用しているコードです:

<!DOCTYPE html>
<html>
<head>
    <title>Defect Trend App</title>
    <script type="text/javascript" src="/apps/2.0rc1/sdk.js"></script>
    <script type="text/javascript">
        Rally.onReady(function () {
(function() {
  Ext.define('CustomApp', {
    extend: 'Rally.app.App',
    componentCls: 'app',
    launch: function() {    
      return this.createTrendChart();
    },  

    createTrendChart: function() {
       var ProjectOid;
      ProjectOid = this.getContext().getProject().ObjectID;
      var ReleaseOID = <My Release ID>;
      Ext.define('My.TrendCalc', {
        extend: 'Rally.data.lookback.calculator.TimeSeriesCalculator',
        getMetrics: function() {
          return [
            {
              as: 'Defects',
              display: 'column',
              f: 'count'
            }
          ];
        }
      });
      this.myTrendChart = Ext.create('Rally.ui.chart.Chart', {
        storeType: 'Rally.data.lookback.SnapshotStore',
        storeConfig:  {
          find: {
            _TypeHierarchy: "Defect",
            State: {
              $lt: "Closed"
            },
            _ProjectHierarchy: ProjectOid,
            Release:  ReleaseOID
          },        
          fetch: ["_ValidFrom", "_ValidTo", "ObjectID"]
        },      

        calculatorType: 'My.TrendCalc',
        calculatorConfig: {},
        chartConfig: {
          chart: {
            zoomType: 'x',
            type: 'column'
          },
          title: {
            text: 'Defects over Time'
          },
          xAxis: {
            type: 'datetime',
            minTickInterval: 1
          },
          yAxis: {
            title: {
              text: 'Number of Defects'
            }
          }
        }
      });

      return this.add(this.myTrendChart);
    }
  });

}).call(this);            
            Rally.launchApp('CustomApp', {
                name:"Defect Trend App",
                parentRepos:""
            });

        });
    </script>
    <style type="text/css">
.app {
     /* Add app styles here */
}
    </style>
</head>
<body></body>
</html>
4

2 に答える 2

2

私は自分自身をこの分野の専門家とは考えていませんが、これはあなたに役立つと信じています...

私はあなたのコードをベースとして取り、他のコードに基づいて修正して、あなたが望むものの動作バージョンであると思われるものを取得しました. 以下は、Rally で実行されているコードのスクリーンショットです。

私が持っていたデータは、シリーズ内であまり分散していなかった (ほとんどがリリースされた) ので、面白くないように見えます。

おそらく最終状態を除外したいと思うでしょう(一時的に $lt:'Completed' に変更した $lt:'Completed'... を介してコードで行ったと思います)。

例

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"><html><head><title>
Defect Trend App </title>
    <script type="text/javascript" src="/apps/2.0rc1/sdk.js"></script>
    <script type="text/javascript">

    var states = ['Accepted','Released']; // all enum values for 'State'
    var field = 'ScheduleState'; // or 'State'
    var ReleaseOID = XXXXXX; // your release Oid

    Rally.onReady(function () {
            Ext.define('CustomApp', {
                extend: 'Rally.app.App',
                componentCls: 'app',
                launch: function() {    
                    return this.createTrendChart();
                },  

                createTrendChart: function() {
                    var ProjectOid;
                    ProjectOid = this.getContext().getProject().ObjectID;


                    Ext.define('My.TrendCalc', {
                        extend: 'Rally.data.lookback.calculator.TimeSeriesCalculator',
                        getDerivedFieldsOnInput: function() {
                            var m = _.map(states, function(state) {
                                return {
                                    "as": state,
                                    "f" : function(snapshot) { 
                                        var value = (snapshot[field] == state) ? 1 : 0;
                                        return value;
                                    }
                                }
                            })
                            return m;
                        },
                        getMetrics : function() {
                            var m = _.map(states, function(state) {
                                return {
                                    field: state,
                                    as: state,
                                    f: 'sum'
                                }
                            })
                            return m;
                        }
                    });

                    this.myTrendChart = Ext.create('Rally.ui.chart.Chart', {
                        storeType: 'Rally.data.lookback.SnapshotStore',
                        storeConfig:  {
                            find: {
                                _TypeHierarchy: "Defect",
                                State: {$lte: "Closed" },
                                _ProjectHierarchy: ProjectOid,
                                Release:  ReleaseOID
                            },        
                            fetch: ["_ValidFrom", "_ValidTo", "ObjectID", field],
                            hydrate: [field],
                            sort: { "_ValidFrom" : 1}
                        },      
                        calculatorType: 'My.TrendCalc',
                        calculatorConfig : {},
                        chartConfig: {
                            chart: {
                                    zoomType: 'xy',
                                    type:'column'
                            },
                            title: {
                                text: 'Defects over Time'
                            },
                            xAxis: {
                                type: 'datetime',
                                title: { text: 'When'},
                                minTickInterval: 5,
                                labels : { rotation: 90 }
                            },
                            yAxis: { title: { text: 'Count' } },
                            plotOptions: {
                                series: {
                                    stacking: 'normal'
                                }
                            }
                        }
                    });

                    return this.add(this.myTrendChart);
                }
            });
    });

    console.log("launching application");
    Rally.launchApp('CustomApp', {
        name:'Defect Trend App',
        parentRepos:""
    });
    </script>
</head>
<body>
</body>

ペーストビン - http://pastebin.com/Vf6jniGZ

于 2014-02-20T01:11:35.890 に答える