2016-08-03 7 views
4

SAPUI5フレームワークのVizFrameコントロールに問題があります。私は2つのY軸を持つ複雑なチャートにいくつかのデータを表示したい。私のデータモデルは次のようになります。VizFrame複数のY軸を組み合わせたチャート

{ 
     "d" : { 
     "results" : [ 
      { 
      "DataA" : "2", 
      "DataB" : "4", 
      "Id" : "1", 
      }, 
      { 
      "DataA" : "3", 
      "DataB" : "2", 
      "Id" : "2", 
      } 
     ] 
    } 
} 

私はX軸のIDを使用しながら、右の1を左Y軸、DATABにDATAAを表示しようとしました。これはVizFrameタイプで問題なく動作します:dual_linedual_column

私は、データをバー(Y1のDataA)とライン(Y2のDataB)として表示する方法を発見しました。現在のコードは次のようになります:

var oModel = new sap.ui.model.json.JSONModel(); 

     oModel.loadData("data.json"); 

     var oDataset = new sap.viz.ui5.data.FlattenedDataset({    
      dimensions: [{ 
       axis : 2, 
       name : oLocText.getText('Id'), 
       value : "{Id}" 
      }],   
      measures : [{ 
        group : 1, 
        name : DataA, 
        value : '{DataA}' 
       },{ 
        group : 2, 
        name: DataB, 
        value: '{DataB}' 
       }], 
      data : { 
       path : "/d/results" 
      } 
     }); 

     oVizFrame.setDataset(oDataset); 
     oVizFrame.setModel(oModel); 
     oVizFrame.setVizType('combination'); 

     oVizFrame.setVizProperties({ 
      title: { 
        visible: true, 
        text: "Combined" 
       },    
      plotArea: { 
       colorPalette : d3.scale.category20().range(), 
      }}); 

     var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({ 
       'uid': "primaryValues", 
       'type': "Measure", 
       'values': [ DataA , DataB] 
      }), 
      feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({ 
       'uid': "axisLabels", 
       'type': "Dimension", 
       'values': [ Id] 
      }); 

     oVizFrame.addFeed(feedValueAxis); 
     oVizFrame.addFeed(feedCategoryAxis); 

ありがとうございました!

答えて

0

てみてください:

var feedValueAxis1 = new sap.viz.ui5.controls.common.feeds.FeedItem({ 
       'uid': "valueAxis", 
       'type': "Measure", 
       'values': [ DataA ] 
      }), feedValueAxis2 = new sap.viz.ui5.controls.common.feeds.FeedItem({ 
       'uid': "valueAxis2", 
       'type': "Measure", 
       'values': [DataB] 
      }), 

それ自動的plotDataAバーとしてleft axisDataBに対するラインとしてrightaxisに対するでしょう。

デュアル組み合わせは、私はあなたの質問はまだ関連性があるかどうかを知るドントSAPUI5 1.40.

0

から始まる利用可能であったことに気づいてください。 あなたの質問が正しい場合、それは小節/行として小節を表示することです。私は同様の問題を抱えていたと私はplotAreaのdataShapeプロパティを設定することによってそれを解決:

oVizFrame.setVizProperties({ 
    plotArea: { dataShape : {primaryAxis : ['bar','bar','bar'], 
          secondaryAxis : ['line', 'line', 'line']}} 
}); 

この例では、各軸上の3つの尺度の最大値が1軸上及び軸2上の線としてバーとして描かれることになります。私はバーコードとラインを変更したいときに何をすべきかを知っているコーディングが見えてくると思います。 1つの発言:ここでは「バー」と「ライン」のみが許可されています(私はドキュメントとソースコードをチェックしました)。 ベストセラー、 セバスチャン

関連する問題