Question

我正在使用SAPUI5库，我想将FacetFilter与ChartContainer元素一起使用。当我单击FacerFilter中的复选框时，我希望图表Container中的某些图表会受到影响。图表容器可以在以下链接中找到： https://sapui5.hana.ondemand.com/sdk/explored.html#/entity/sap.suite.ui.commons.ChartContainer/samples 所以我的问题是如何将facetfilters项目与容器图表绑定。我的test.view.xml;

Edit1：我将FacetFilters放在尺寸选择器中。

 <ChartContainer
    id="idChartContainer"
    showFullScreen="true"
    showPersonalization="true"
    autoAdjustHeight="true"
    showLegend="true"
    personalizationPress="attachPersonalizationPress"
    contentChange="attachContentChange">

    <dimensionSelectors>
        <m:FacetFilter
            id="facetFilterChart2"
            type="Simple"
            showPersonalization="false"
            showReset="true"
            reset="onFacetFilterReset" showPopoverOKButton="true">

            <m:lists>

                <m:FacetFilterList 
                    title="{oModel>/Facet01/Title}"
                    key="{oModel>/Facet01/Key}"
                    multiselect="true"
                    listClose="onFacetClosed"
                    items="{oModel>/Facet01/Items}" >

                    <m:items>
                        <m:FacetFilterItem
                             key="{oModel>Key}"
                             text="{oModel>Text}" />
                    </m:items>
                </m:FacetFilterList>

            </m:lists>
        </m:FacetFilter>
    </dimensionSelectors>

    <content>
        <ChartContainerContent
            icon = "sap-icon://horizontal-bar-chart" 
            title = "vizFrame Bar Chart Sample"> 
            <content>
                <viz:VizFrame id="idoVizFrame"> </viz:VizFrame>
            </content>
        </ChartContainerContent>
                    ...

我想在我的viz框架中使用这些facetfilters，并使用facet过滤器复选框过滤我的数据。我的test.controller.js;

oModel : {

      Toolbar : {

        Design : "Solid"
      },

      Facet01 : {
        Key : "Facet01",
        Title : "Departmanlar",
        Items : [
          { Key : "k1", Text : "İnsan Kaynakları" },
          { Key : "k2", Text : "Satış & Pazarlama" },
          { Key : "k3", Text : "Satınalma" },
          { Key : "k4", Text : "Finans" },
          { Key : "k5", Text : "SSH" }
        ]

      }
},

onInit : function(oEvent) {
      var oVizFrame = this.getView().byId("idoVizFrame");
      oVizFrame.setDataset(oDataset2);
      oVizFrame.setModel(amModel2);
      oVizFrame.addFeed(feedPrimaryValues2);
      oVizFrame.addFeed(feedAxisLabels2);
      oVizFrame.setVizType('bar');
      var oSelect1 = this.getView().byId("idoSelect1");

Answer 1

您的 XML 绑定看起来不正确。正确的方法是：

<m:FacetFilter
            id="facetFilterChart2"
            type="Simple"
            showPersonalization="false"
            showReset="true"
            reset="onFacetFilterReset" 
            showPopoverOKButton="true"
            lists="{model>/Facet01}">
            <m:lists>
                <m:FacetFilterList 
                    title="{oModel>Title}"
                    key="{oModel>Key}"
                    multiselect="true"
                    listClose="onFacetClosed"
                    items="{oModel>/Items}" >
                    <m:items>
                        <m:FacetFilterItem
                             key="{oModel>Key}"
                             text="{oModel>Text}" />
                    </m:items>
                </m:FacetFilterList>
            </m:lists>
</m:FacetFilter>

在控制器中设置模型

var oFacetFilterModel = new sap.ui.model.json.JSONModel(this.oModel);
this.getView().byId("facetFilterChart2").setModel(oFacetFilterModel,"oModel");

使用SAPUI5中的FacetFilters过滤图表容器

1 个答案: