How to show Trend Arrows in SAP Design Studio?

[former_member354226]

I need to show trend arrows in SAP Design Studio application which will be based on sales comparison of the current year and last year.

If current year sales are greater than last year then Upward green arrow.

If current year sales are less than last year then Downward red arrow.

If current year sales are equal to last year then Horizontal yellow arrow.

Backend is BEx query with exceptions.

[Vidhya · Accepted solution]

Hi Pan Kaj,

Please check the below links,

https://blogs.sap.com/2014/05/11/how-to-show-status-icons-for-bex-exceptions-in-design-studio/

https://www.youtube.com/watch?v=eJg5YUVcaxo

Regards,

Vidhya.C

[TammyPowlas]

In addition to Vidya's answer you can try the scorecard component see https://archive.sap.com/discussions/thread/3837480 https://blogs.sap.com/2015/12/29/introduction-to-sap-design-studio-scorecard-component-part-2/

[former_member265529]

Hi Pan Kaj,

That is simply an image URL, You can use any html link with required image or you can use image uri in it.

You can convert any image to data URI using an online converter and use it in the above code.

Thanks,

Poovarasan

[former_member354226]

Thanks, Vidhya and Tammy.

I have gone through links provided by you both.

I am using crosstab for this scenario.

Can you please explain me below URL,

/aad/resources/~1399838692937~/sap/zen/crosstab/themes/sap_platinum/img/exceptions/trend_asc_9.gif

where can I find content related to this URL?

how can I change the icons?

how can I change the color of an icon?

[Vidhya]

That is standard image file, which is provide by SAP. If you like to add your own image icon. Yes you can do it.

With the help of "Base64 Image Encoder 2.0" SDK component, we can encode our image file that can be used in the CSS.

https://blogs.sap.com/2014/09/28/using-image-uris-in-sap-design-studio/

https://blogs.sap.com/2013/12/24/how-to-embed-images-inside-of-a-design-studio-app-without-uploading...

To get the SDK component , Please find the below URL

http://org-scn-design-studio-community.github.io/sdkinstall/web/components/

[Former Member]

Vidhya,

I am also interesed in the question Pan has asked. Can you please clarify what you mean by "a standard image file which is provided by SAP"? In my Design Studio I have no images provided by SAP, and I cannot find the location of the icons either. I have asked this question online some time ago, and the advice I got then was to find my own images.

A.

[Vidhya]

That are inbuilt image files embedded in the css for particular component wise. we can't find the path.If you find the path also and you can't download the image only you can use those images file in your CSS file.

[Former Member]

What do you mean by image files embedded in the css for a particular component? Can you please share an example, like a screenshot or something? I really don't know what you mean 🙂