Skip to Content
Author's profile photo Joseph Chinnabathini

SAP Fiori KPI’s not working in Chrome due to TypeError: n.getTransformToElement is not a function Error

TypeError: n.getTransformToElement is not a function

KPI Tiles app allows you to create tile visualizations for an active evaluation.

The app also lets you configure the drill-down navigation path for the tile. This determines whether you navigate from the tile to the SAP Smart Business generic drill-down application or to a custom application when you click the tile at runtime.

But these KPI tiles which got analytical/graphical representation of data doesn’t show up in chrome, it is because of the latest Chrome version 48, however it works fine with other browsers like IE, Firefox, Safari.

It throws you error as

TypeError: n.getTransformToElement is not a function”

or

“Failed to create chart:TypeError: J.getTransformToElement is not a function”

It is not only for KPI tiles but also for People Profile app and may be few other which loads graphs will have this issue.

SAP Provided a solution with latest UI5 libraries version 1.34.4 (which is SAP NW 7.5 + additional patching for 1.34.4 library files) but for the customers who doesn’t want to upgrade to NW 7.5 and would like to stay at 7.4, please follow below solution.

/wp-content/uploads/2016/03/error_906906.png

Add below code in browser console for testing whether it is working or not.

SVGElement.prototype.getTransformToElement = SVGElement.prototype.getTransformToElement || function(toElement) {

    return toElement.getScreenCTM().inverse().multiply(this.getScreenCTM());

};


Hit Enter after entering the above code and click on Home or back button and click on the KPI tile again.


/wp-content/uploads/2016/03/error_906906.png


You will notice that graph is back. For a permanent solution, you can also embed the code in Fiorilaunchpad.html file which actually loads all Fiori apps. But remember when you upgrade Gateway system then you probably need to redo the same step by modifying Fiorilaunchpad.html file. Put the code in <script> tags while embedding in Fiorilaunchpad.html file.


Capture.PNG

Hope this helps.


Regards,

Joseph Chinnabathini



Assigned Tags

      2 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Sachin Dhavanam
      Sachin Dhavanam

      thanks, Its working

      Author's profile photo Karan Bahl
      Karan Bahl

      Hi Joseph,

      Thanks. This works for me. However, I am getting a peculiar issue with the graph labels.

      Please refer to the below screenshot:

      kpilabel.PNG

      I already have raised the thread, Issue in Drill Down Labels in KPI Based Analytical Applications

      Please let me know if you have any inputs on this.

      Regards,

      Karan