javascript – 如何在Worklight App上显示Google Map

2019-10-02 09:36:19 阅读：248 来源： 互联网

标签：ibm-mobilefirst javascript google-maps

我在Worklight中有以下文件.我想在worklight应用程序上加载地图.它在“设计”视图中可见,但在模拟器和模拟器上都不可见.请帮助.

//index.html
<div id="pagePort"></div>


//page1.html
<script src="js/page1.js"></script>
<div id="content">
<button type="button" onclick="loadPage5();">Click</button>
</div>


//page1.js
function loadPage5()
{
var pagepath="page5.html";
pagesHistory.push("page1.html");
$("#pagePort").load(pagepath,function(){WL.Logger.info("Page Loaded");});
}


//page5.html
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<body>
<div id="map-canvas"></div>
<script src="js/page5.js"></script>
<script src="js/page1.js"></script>
<script src="js/initOptions.js"></script> 
<script src="js/main.js"></script>
<script src="js/messages.js"></script> 
</body>


//page5.js

function initialize() {
var myLatlng1 = new google.maps.LatLng(28.5084805,77.2272778);
var mapOptions = {
zoom: 11,
center: myLatlng1
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

var marker1 = new google.maps.Marker({
position: myLatlng1,
map: map,
});
google.maps.event.addDomListener(window, 'load', initialize);

怎么做？

解决方法:

根据对问题的评论和编辑对答案进行重大修订

请参阅以下Worklight 6.1.0.1示例项目,该示例项目演示页面导航以及在应用程序的其他页面中加载Google地图.

此示例基于IBM提供的相同多页示例,您的代码片段基于以下内容：

> Multi-page application with Google Maps

在Worklight Console预览以及iOS模拟器中进行了测试.

标签：ibm-mobilefirst,javascript,google-maps
来源： https://codeday.me/bug/20191002/1842278.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – 如何在Worklight App上显示Google Map