必应映射V8网络控件和CommonJS
必应映射V8网络控件和CommonJS
提问于 2016-11-10 18:11:25
我在一个Web应用程序中使用Bing地图V8网络控件。我还使用Brunch来管理静态资产，包括JavaScript。默认情况下，Brunch将所有非供应商的JavaScript代码封装在CommonJS模块中。
Microsoft的文档要求在脚本导入URL中使用回调参数初始化控件，如下所示：
<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=release&callback=loadMapScenario' async defer></script>使用这样定义的loadMapScenario：
Microsoft.Maps.loadModule('Microsoft.Maps.AutoSuggest', {
callback: onLoad,
errorCallback: onError,
credentials: 'Your Bing Maps Key'
});
function onLoad() {
var options = { maxResults: 5 };
var manager = new Microsoft.Maps.AutosuggestManager(options);
manager.attachAutosuggest('#searchBox', '#searchBoxContainer', selectedSuggestion);
}
function onError(message) {
document.getElementById('printoutPanel').innerHTML = message;
}
function selectedSuggestion(suggestionResult) {
document.getElementById('printoutPanel').innerHTML =
'Suggestion: ' + suggestionResult.formattedSuggestion +
'<br> Lat: ' + suggestionResult.location.latitude +
'<br> Lon: ' + suggestionResult.location.longitude;
}问题是，我从API中得到一个错误，说明回调函数无效。
有更好的方法吗？web控件是否有以这种方式调用CommonJS包装函数的方法？
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-11-14 12:22:31
请参阅下面的代码问题：
<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=release&callback=loadMapScenario' async defer></script>在这一行中定义了回调函数loadMapScenario，但它不存在。- 只有在包含bing地图库js之后，映射函数才会调用。
溶液
必应地图提供了一个示例代码。请参阅http://www.bing.com/api/maps/sdk/mapcontrol/isdk#autoSuggestUiWithoutMap+HTML
如果您无法看到上面的链接，那么只需查看下面的代码。只需使用必应地图api键连接。这里提供的示例代码是自动建议，没有加载地图。您可以在上面的链接中看到不同的选项。
<!DOCTYPE html>
<html>
<head>
<title>autoSuggestUiWithoutMapHTML</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
</head>
<body>
<div id='printoutPanel'></div>
<div id='searchBoxContainer'><input type= 'text' id= 'searchBox'/></div>
<div id='myMap' style='width: 100vw; height: 100vh;'></div>
<script type='text/javascript'>
function loadMapScenario() {
Microsoft.Maps.loadModule('Microsoft.Maps.AutoSuggest', {
callback: onLoad,
errorCallback: onError,
credentials: 'Your Bing Maps Key'
});
function onLoad() {
var options = { maxResults: 5 };
var manager = new Microsoft.Maps.AutosuggestManager(options);
manager.attachAutosuggest('#searchBox', '#searchBoxContainer', selectedSuggestion);
}
function onError(message) {
document.getElementById('printoutPanel').innerHTML = message;
}
function selectedSuggestion(suggestionResult) {
document.getElementById('printoutPanel').innerHTML =
'Suggestion: ' + suggestionResult.formattedSuggestion +
'<br> Lat: ' + suggestionResult.location.latitude +
'<br> Lon: ' + suggestionResult.location.longitude;
}
}
</script>
<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?branch=release&callback=loadMapScenario' async defer></script>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/40534345
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号