将Google地图添加到Fiori sapui5应用

Question

I want to add google maps to my Fiori app. At this moment, I'm able to add google maps to my UI5 app by adding a <script> tag in index.html and successfully call the map to render. But when it comes to Fiori Launchpad, which launch my app not by index.html but Component.js , then it doesn't work. I've been working around but no hope. Any suggestions?

Answer 1

You could try to create a wrapper custom control that is responsible for the renndering of the map. Then you can place this control inside your view XML.

There is also this post: https://blogs.sap.com/2014/07/01/google-maps-library-for-ui5/

Answer 2

You can try below code in controller file.

Instead of script in index file, load script once view is rendered

 onAfterRendering: function() { var me = this; this.loadGoogleMaps("google map API script", me.setMapData.bind(me)); }, // setMapData is a callback function for setting data such as longitude and lattitude loadGoogleMaps: function(scriptUrl, callbackFn) { var script = document.createElement('script'); script.onload = function() { callbackFn(); } script.src = scriptUrl; document.body.appendChild(script); }, 

In this way you can use it inside Fiori launchpad.