谷歌地图Javascript问题有两个功能

我正在尝试（未成功）将两个javascript示例合并到另一个示例中

其中一个是从cartoDB加载一些数据，以Google maps作为底图，另一个是Google maps搜索框。地图加载很好，但是搜索框没有做任何事情，就像我没有将搜索框链接到函数一样

独立，函数initAutocomplete的代码可以工作，但当我将其与主函数组合时，它就不能工作了（因为没有发生任何事情）

任何帮助都将不胜感激

谢谢

映射
html，body，#map{
身高：100%；
填充：0；
保证金：0；
}
3ae
函数initAutocomplete（）{
var map=new google.maps.map（document.getElementById（'map'）{
中心：{lat:-33.8688，lng:151.2195}，
缩放：13，
mapTypeId:google.maps.mapTypeId.ROADMAP
});
//创建搜索框并将其链接到UI元素。
var input=document.getElementById（'pac-input'）；
var searchBox=newgoogle.maps.places.searchBox（输入）；
map.controls[google.maps.ControlPosition.TOP_LEFT].push（输入）；
//将搜索框结果偏向当前地图的视口。
addListener（'bounds_changed'，function（）{
searchBox.setBounds（map.getBounds（））；
});
var标记=[]；
//[开始区域\u getplaces]
//侦听用户选择预测并检索时激发的事件
//关于那个地方的更多细节。
searchBox.addListener（'places\u changed'，function（）{
var places=searchBox.getPlaces（）；
如果（places.length==0）{
返回；
}
//清除旧的标记。
markers.forEach（函数（marker）{
marker.setMap（空）；
});
标记=[]；
//对于每个位置，获取图标、名称和位置。
var bounds=new google.maps.LatLngBounds（）；
地点。forEach（功能（地点）{
变量图标={
url:place.icon，
大小：新谷歌地图大小（71,71），
来源：新google.maps.Point（0,0），
主播：新google.maps.Point（17,34），
scaledSize:new google.maps.Size（25,25）
};
//为每个地方创建一个标记。
markers.push（新的google.maps.Marker）({
地图：地图，
图标：图标，
标题：place.name，
位置：place.geometry.location
}));
if（place.geometry.viewport）{
//只有地理代码具有视口。
联合（place.geometry.viewport）；
}否则{
扩展（place.geometry.location）；
}
});
映射边界（bounds）；
});
}
//[结束区域\u getplaces]
函数main（）{
var映射；
//创建谷歌地图
变量映射选项={
缩放：10，
旋转控制：对，
旋转控制：正确，
街景控制：对，
scaleControl：对，
中心：新google.maps.LatLng（53.408，-2.1674），
mapTypeId:google.maps.mapTypeId.ROADMAP
};
map=new google.maps.map（document.getElementById（'map'），mapOptions）；
var url1='1〕https://XXXXX.cartodb.com/api/v2/viz/57963390-c37b-11e5-9814-0ecfd53eb7d3/viz.json';
var url2=https://XXXXX.cartodb.com/api/v2/viz/c0ab0f9c-c69e-11e5-94b0-0e3ff518bd15/viz.json'; 
var url3=https://XXXXX.cartodb.com/api/v2/viz/9f047b2a-c69f-11e5-bbf8-0e674067d321/viz.json';
变量选项={
cartodb_标志：假，
图层选择器：true，
传说：没错，
}
cartodb.createLayer（映射，url1）
.addTo（映射，0）//最终不显示
.done（功能（层）{
log（'added url1'，url1）；
cartodb.createLayer（地图，url2）
.addTo（映射，1）//最终不显示
.done（功能（层）{
log（'added url2'，url2）；
cartodb.createLayer（地图，url3）
.addTo（映射，2）//显示OK
.done（功能（层）{
log（'added url3'，url3'）；
})
.错误（函数（）{
console.log（“添加第一层时出现问题”）；
});
})
.错误（函数（）{
console.log（“添加第二层时出现问题”）；
});
})
.错误（函数（）{
log（'添加第三层时出现问题！'）；
});
}
window.onload=main；

您没有包括位置库

  <script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?v=3&libraries=places&key=XXXXXXXXXXXXXXXXx"></script>

代码片段：（由于您提供的代码不可用，cartdb内容将无法工作。）

函数initAutocomplete（映射）{
//创建搜索框并将其链接到UI元素。
var input=document.getElementById（'pac-input'）；
var searchBox=newgoogle.maps.places.searchBox（输入）；
map.controls[google.maps.ControlPosition.TOP_LEFT].push（输入）；
//将搜索框结果偏向当前地图的视口。
addListener（'bounds_changed'，function（）{
searchBox.setBounds（map.getBounds（））；
});
var标记=[]；
//[开始区域\u getplaces]
//侦听用户选择预测并检索时激发的事件
//关于那个地方的更多细节。
searchBox.addListener（'places\u changed'，function（）{
var places=searchBox.getPlaces（）；
如果（places.length==0）{
返回；
}
//清除旧的标记。
markers.forEach（函数（marker）{
marker.setMap（空）；
});
标记=[]；
//对于每个位置，获取图标、名称和位置。
var bounds=new google.maps.LatLngBounds（）；
地点。forEach（功能（地点）{
变量图标={
url:place.icon，
大小：新谷歌地图大小（71,71），
来源：新google.maps.Point（0,0），
function initAutocomplete(map) {
  // Create the search box and link it to the UI element.
  var input = document.getElementById('pac-input');
  var searchBox = new google.maps.places.SearchBox(input);
  map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

  // Bias the SearchBox results towards current map's viewport.
  map.addListener('bounds_changed', function() {
    searchBox.setBounds(map.getBounds());
  });

  var markers = [];
  // [START region_getplaces]
  // Listen for the event fired when the user selects a prediction and retrieve
  // more details for that place.
  searchBox.addListener('places_changed', function() {
    var places = searchBox.getPlaces();
    if (places.length == 0) {
      return;
    }
    // Clear out the old markers.
    markers.forEach(function(marker) {
      marker.setMap(null);
    });
    markers = [];

    // For each place, get the icon, name and location.
    var bounds = new google.maps.LatLngBounds();
    places.forEach(function(place) {
      var icon = {
        url: place.icon,
        size: new google.maps.Size(71, 71),
        origin: new google.maps.Point(0, 0),
        anchor: new google.maps.Point(17, 34),
        scaledSize: new google.maps.Size(25, 25)
      };

      // Create a marker for each place.
      markers.push(new google.maps.Marker({
        map: map,
        icon: icon,
        title: place.name,
        position: place.geometry.location
      }));

      if (place.geometry.viewport) {
        // Only geocodes have viewport.
        bounds.union(place.geometry.viewport);
      } else {
        bounds.extend(place.geometry.location);
      }
    });
    map.fitBounds(bounds);
  });
}