Question

这里有点奇怪的问题。我有一个内置在KnockoutJS，jQuery和Google Maps中的东西。我有一个ko.observableArray()我正用于我的标记。

viewModel.markers = ko.observableArray([
{ title: 'spot A', lat: 45.913750, lng: -89.257755, placeID: 'ChIJ9SwINsw3VE0RTDLel7J7Z-U', content: 'agh.' },
{ title: 'spot B', lat: 45.915717, lng: -89.240019, placeID: 'ChIJ-ZZXnek3VE0RBbpY67WJV1Y', content: 'This problem makes me want to scratch my eyes out.' },
{ title: 'spot C', lat: 45.934099, lng: -89.261834, placeID: 'ChIJdSZITVA2VE0RDqqRxn-Kjgw', content: 'Lorem Ipsum Dolor.' }
]);

我还有一个前端面向foreach ul，根据从此阵列中提取的搜索结果填充信息，具体为：

<ul data-bind="foreach: searchResults" class="locationListMain">
  <ul class="locationList">
    <h3 class="resultTITLE"> <span data-bind="text: title"></span></h3>
    <p class="resultLATLONG">LAT <span data-bind="text: lat"></span>, LONG <span data-bind="text: lng"></span></p>
    <p class="resultCONTACT"></p>
    <span class="fa fa-arrow-circle-right resultOPEN"></span>
  </ul>
</ul>

但是，我想要做的是弄清楚如何对这些.locationList ul引用特定的Google地图标记。如同，如果我搜索'Spot A'，那么我将在列表中返回'Spot A'。如果我点击“Spot A”，它将移动并打开相对于该信息的google.maps.InfoWindow();。

有没有什么方法可以将地图标记的索引和返回的数据绑定在一起，这样我可以在需要时将其中一个引用到另一个？我不是百分之百确定当我制作标记时如何管理索引，而且我无法找到任何可以指向我可以在google文档+ KO文档中使用的内容的信息。

作为参考，这是我的标记代码，在地图初始化后调用。

function initData(map, markers){
var markerData = markers;
for (i = 0; i < markerData.length; i++){
  var position = new google.maps.LatLng(markerData[i].lat, markerData[i].lng);
  var marker = new google.maps.Marker({
    map: map,
    position: position,
    title: markerData[i].title
  });
  var content = markerData[i].content;
  var infoWindow = new google.maps.InfoWindow();
  google.maps.event.addListener(marker, 'click', (function(marker, content, infoWindow){
    return function() {
      infoWindow.setContent(content);
      infoWindow.open(map, marker);
    };
  })(marker, content, infoWindow));
}

非常感谢任何帮助。谢谢！

KnockoutJS相对于谷歌地图标记的预告？

0 个答案: