Google maps SAPUI5-未显示谷歌地图_Google Maps_Sapui5

Google maps SAPUI5-未显示谷歌地图

google-maps sapui5

Google maps SAPUI5-未显示谷歌地图,google-maps,sapui5,Google Maps,Sapui5,SAPUI5-谷歌地图未显示。控制台中没有错误，但谷歌地图没有显示。请查找我尝试过的代码段 Index.html <!DOCTYPE HTML> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv='Content-Type' content='text/html;charset=UTF

SAPUI5-谷歌地图未显示。控制台中没有错误，但谷歌地图没有显示。请查找我尝试过的代码段

Index.html

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
        <script 
        src="https://maps.googleapis.com/maps/api/js?
        key=AIzaSyCEf_wLCEciMDw7tgnDGXptl94rdzLhW7Y&libraries=places"
        type ="text/javascript">    </script>

        <script id='sap-ui-bootstrap' type='text/javascript'
        src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
        data-sap-ui-theme='sap_bluecrystal'
        data-sap-ui-libs='sap.m'></script>


        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

        <script>
                sap.ui.localResources("googlemaps");
                var app = new sap.m.App({initialPage:"idgooglemaps1"});
                var page = sap.ui.view({id:"idgooglemaps1", 
                viewName:"googlemaps.googlemaps", 
                type:sap.ui.core.mvc.ViewType.XML});
                app.addPage(page);
                app.placeAt("content");
        </script>


</script>

        <style>
        .myMap {                   
        height: 100%;
        width: 100%  ;
        }
        </style>
    </head>
    <body class="sapUiBody" role="application">
        <div id="content"></div>
    </body>
</html>

创建UI5控件时，分配给HTML元素的ID是一个生成的ID（本例中为“idgooglemaps1--map_canvas”）。因此ID为“map_canvas”的元素不存在。但是，您可以获取UI5控件并获取生成的ID

var oHBox = this.getView().byId("map_canvas");
var map = new google.maps.Map(document.getElementById(oHBox.getId()), mapOptions);

好像少了什么东西。事实上，通过检查器，my项的正确路径可能比oHBox.getId（）返回的路径长。例如：

container-TestGpsNew---View1--box1-container-TestGpsNew---View1--myAppGPS-0
oHBox.getId() = container-TestGpsNew---View1--box1, 
container-TestGpsNew---View1--myAppGPS is the path for the View for example : 
this.byId("myAppGPS").getId()

还有剩余的“-0”，我不知道它来自哪里。仍在搜索。

谢谢您的帮助。我尝试使用console.log（map）检查值；对象有值，但在UI中没有贴图对象。UI是空白的，在控制台中没有错误您可以检查map元素是否是在DOM结构中创建的使用google maps嵌入的api怎么样？您只需将和iframe元素与sapui5 html元素一起使用即可。

var oHBox = this.getView().byId("map_canvas");
var map = new google.maps.Map(document.getElementById(oHBox.getId()), mapOptions);

container-TestGpsNew---View1--box1-container-TestGpsNew---View1--myAppGPS-0
oHBox.getId() = container-TestGpsNew---View1--box1, 
container-TestGpsNew---View1--myAppGPS is the path for the View for example : 
this.byId("myAppGPS").getId()