Displaying % sign along with the value in a Crosstab

[former_member544949]

Hi Experts,

I have a Crosstab which has three dimensions as rows and two measures as columns.

Column A : Total no. of employees

Column B : Percentage of employees.

The requirement from the business is to show “%” sign along with the Percentage value e.g. Column B values like 64.3%.

In order to show the % sign, I have used the following script in my CSS

.X .sapzencrosstab-DataArea>tbody>tr:nth-child(1)>td:nth-child(1):after{

content:"%";

}

With this script, % sign is displayed along with the value but after the value like

64.3

%

What should I change in the script to show “%” sign along with the value.

I am using SAP Design studio 16.5.0.

Any help will be greatly appreciated!!

Thanks!!

[TammyPowlas]

Hi - what is your data source? Does the % need to be in a script, or would having it be in the header be enough? See https://blogs.sap.com/2015/11/27/custom-measures-calculations-sap-design-studio-16/

[former_member544949]

Thanks Tammy for your response. My Data source is a BEX query.

"%" sign is not enough in the header but is required with each value.

Regards.

[TammyPowlas · Accepted solution]

Can you look at /try Vidya's post? https://blogs.sap.com/2016/12/08/format-your-own-symbol-in-the-crosstab-using-css-sap-design-studio-...

CSS looks similar, but a "before" where you have "after"

[former_member544949 · Accepted solution]

Hi Tammy,

Thanks for your reply. The solution worked!!. But I did a small change in my CSS. writing it here, may be useful for someone in future.

.crosstabpercent .sapzencrosstab-DataArea>tbody>tr>td:nth-child(even).sapzencrosstab-DataCellDefault>div:after {

content: "%";

}

My crosstab, for some dimensions has a value and for some dimension has a blank. The problem is, with values I want to show % sign while with blanks nothing. Right now with the above code, it’s showing “%” sign even with blanks. Is there a workaround to put “%” sign conditionally ?

Many thanks!!

[arijit_das]

Make a small change in your CSS as below:

.X .sapzencrosstab-DataArea>tbody>tr:nth-child(1)>td:nth-child(1) div::after{
    content:"%";
}

[former_member490510]

Hi Arjit ,

The above CSS class for crosstab.

Can we do it same for the chart using CS class.

[arijit_das]

I would like to request you to raise a separate thread with specific requirement and a few screenshots if possible.

[former_member490510]

Hi Arjit,

Thanks for replying to me.

Here is the thread as already raised for help.

https://answers.sap.com/questions/565031/displaying-percentage-symbol-in-combination-charts.html

could you please look into and help me on this please.