on 07-31-2018 7:02 AM
I'm facing a problem.
I want to display a bar chart on detail page when Pressing a master list.
However, the chart shown on detail page contains all data in Entityset.
How can I show only selected data?
please advise me.
regards,
<Data.view.xml>
<mvc:View xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core"
xmlns="sap.m"
xmlns:semantic="sap.m.semantic"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:data="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1"
xmlns:action="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1"
xmlns:viz="sap.viz.ui5.controls"
xmlns:layout="sap.ui.layout"
xmlns:viz.feeds="sap.viz.ui5.controls.common.feeds"
xmlns:viz.data="sap.viz.ui5.data"
controllerName="test2.test2.controller.Data" afterInit="action" action:wiring="\{'afterInit':\{'navigation':\{'routeName':'List'\}\}\}">
<semantic:DetailPage id="page" navButtonPress="onNavBack" showNavButton="{device>/system/phone}" title="{bukrs}" busy="{detailView>/busy}" busyIndicatorDelay="{detailView>/delay}">
<semantic:content>
<SearchField xmlns="sap.m" id="searchField" showRefreshButton="{= !${device>/support/touch} }" width="100%" search="onSearch">
</SearchField>
<IconTabBar id="iconTabBar" class="sapUiResponsiveContentPadding">
<items>
<IconTabFilter id="iconTabBarFilter1" icon="sap-icon://bar-chart" iconColor="Positive">
<content>
</content>
</IconTabFilter>
<IconTabFilter id="iconTabBarFilter2" icon="sap-icon://bar-chart" iconColor="Critical">
</IconTabFilter>
<IconTabFilter id="iconTabBarFilter3" icon="sap-icon://area-chart">
</IconTabFilter>
</items>
</IconTabBar>
<List id="list" noDataText="{i18n>noDataText}">
<items>
<ObjectListItem title="{itm}">
</ObjectListItem>
</items>
</List>
<layout:FixFlex id='chartFixFlex' minFlexSize="250">
<layout:flexContent>
<viz:Popover id="idPopOver"></viz:Popover>
<viz:VizFrame id="idVizFrame" uiConfig="{applicationSet:'fiori'}"
height='100%' width="100%" vizType='column'>
<viz:dataset >
<viz.data:FlattenedDataset data="{/Meetups}" >
<viz.data:dimensions>
<viz.data:DimensionDefinition name="会社コード"
value="{bukrs}" />
</viz.data:dimensions>
<viz.data:measures title="月ごと">
<viz.data:MeasureDefinition name="1月"
value="{jan}" />
<viz.data:MeasureDefinition name="2月"
value="{feb}" />
<viz.data:MeasureDefinition name="3月"
value="{mar}" />
<viz.data:MeasureDefinition name="4月"
value="{apr}" />
<viz.data:MeasureDefinition name="5月"
value="{may}" />
<viz.data:MeasureDefinition name="6月"
value="{jun}" />
<viz.data:MeasureDefinition name="7月"
value="{jul}" />
<viz.data:MeasureDefinition name="8月"
value="{aug}" />
<viz.data:MeasureDefinition name="9月"
value="{sep}" />
<viz.data:MeasureDefinition name="10月"
value="{oct}" />
<viz.data:MeasureDefinition name="11月"
value="{nov}" />
<viz.data:MeasureDefinition name="12月"
value="{dec}" />
</viz.data:measures>
</viz.data:FlattenedDataset>
</viz:dataset>
<viz:feeds>
<viz.feeds:FeedItem id='valueAxisFeed1' uid="valueAxis" type="Measure"
values="1月" />
<viz.feeds:FeedItem id='valueAxisFeed2' uid="valueAxis" type="Measure"
values="2月" />
<viz.feeds:FeedItem id='valueAxisFeed3' uid="valueAxis" type="Measure"
values="3月" />
<viz.feeds:FeedItem id='valueAxisFeed4' uid="valueAxis" type="Measure"
values="4月" />
<viz.feeds:FeedItem id='valueAxisFeed5' uid="valueAxis" type="Measure"
values="5月" />
<viz.feeds:FeedItem id='valueAxisFeed6' uid="valueAxis" type="Measure"
values="6月" />
<viz.feeds:FeedItem id='valueAxisFeed7' uid="valueAxis" type="Measure"
values="7月" />
<viz.feeds:FeedItem id='valueAxisFeed8' uid="valueAxis" type="Measure"
values="8月" />
<viz.feeds:FeedItem id='valueAxisFeed9' uid="valueAxis" type="Measure"
values="9月" />
<viz.feeds:FeedItem id='valueAxisFeed10' uid="valueAxis" type="Measure"
values="10月" />
<viz.feeds:FeedItem id='valueAxisFeed11' uid="valueAxis" type="Measure"
values="11月" />
<viz.feeds:FeedItem id='valueAxisFeed12' uid="valueAxis" type="Measure"
values="12月" />
<viz.feeds:FeedItem id='categoryAxisFeed' uid="categoryAxis" type="Dimension"
values="会社コード" />
</viz:feeds>
</viz:VizFrame>
</layout:flexContent>
</layout:FixFlex>
</semantic:content>
</semantic:DetailPage>
</mvc:View>
<Data.controller.js>
/*global location*/
sap.ui.define([
"test2/test2/controller/BaseController",
"sap/ui/model/json/JSONModel"
], function (BaseController, JSONModel) {
"use strict";
return BaseController.extend("test2.test2.controller.Data", {
onInit: function () {
this.getOwnerComponent().getRouter().getRoute("dataget").attachPatternMatched(this._onRouteMatched, this);
},
_onRouteMatched: function (oEvent) {
this._bukrs = oEvent.getParameter("arguments").bukrs;
var oModel = this.getModel();
var sPath = oModel.createKey("Meetups", {
bukrs : this._bukrs } );
this.getView().bindElement("/" + sPath);
var oVizFrame = this.getView().byId("idVizFrame");
//↓how to write this code??↓
oVizFrame.getDataset().setValue(this._bukrs);
}
});
});
<Meetups.json>
[{
"bukrs":"ZT01",
"code":1,
"cname":"Acom",
"div":"1",
"jan":11,
"feb":12,
"mar":13,
"apr":14,
"may":15,
"jun":16,
"jul":17,
"aug":18,
"sep":19,
"oct":20,
"nov":21,
"dec":22,
"itm":5
},
{
"bukrs": "ZT02",
"code":2,
"cname":"Bcom",
"div":"2",
"jan":23,
"feb":24,
"mar":25,
"apr":26,
"may":27,
"jun":28,
"jul":29,
"aug":30,
"sep":31,
"oct":32,
"nov":33,
"dec":34,
"itm":10
},
{
"bukrs": "ZT03",
"code":3,
"cname":"Ccom",
"div":"1",
"jan":35,
"feb":36,
"mar":37,
"apr":38,
"may":39,
"jun":40,
"jul":41,
"aug":42,
"sep":43,
"oct":44,
"nov":45,
"dec":46,
"itm":15
},
{
"bukrs": "ZT04",
"code":4,
"cname":"Dcom",
"div":"2",
"jan":47,
"feb":48,
"mar":49,
"apr":50,
"may":51,
"jun":52,
"jul":53,
"aug":54,
"sep":55,
"oct":56,
"nov":57,
"dec":58,
"itm":20
}
]
Try the following:
1. pick up the vizframe instance and assign it to a variable like
var chart = sap.ui.getCore().byId("idVizFrame")
2. pick up the dataset bounds to it and assign it to a variable by calling
var chartDataset = chart.getDataset()
3. now do this
chartDataset.bindAggregation("data", {path: "/Meetups", filters: [new sap.ui.model.Filter("bukrs", sap.ui.model.FilterOperator.EQ, "ZT03")]})
you could update the ZT03 to the value at runtime.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
86 | |
10 | |
10 | |
9 | |
7 | |
7 | |
6 | |
5 | |
4 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.