当前位置: 代码迷 >> JavaScript >> 在storeLocator.Store中设置自定义商店标记
  详细解决方案

在storeLocator.Store中设置自定义商店标记

热度:35   发布时间:2023-06-12 14:02:54.0

我正在尝试为每个商店设置自定义标记。 使用 ,有与.setMarker选项。

我尝试了很多

var store = new storeLocator.Store(store_id, position, storeFeatureSet, storeProps);
var markerPin = new google.maps.Marker(
  icon: 'http://url-to-marker.png'
});
store.setMarker(markerPin);

我一直在尝试在Google上找到一些东西,但是storelocator项目中没有太多东西。

我设法找到了的 。 在该存储库中,有样本示例和文件,这些文件演示了标记的位置。 如果您深入示例目录并检出文件 。 您可以找到有关如何使用标记填充位置的代码。 我添加了一个小代码段,有关详细概述,您可以看到整个项目。

google.maps.event.addDomListener(window, 'load', function() {
  var map = new google.maps.Map(document.getElementById('map-canvas'), {
    center: new google.maps.LatLng(-28, 135),
    zoom: 4,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

  var panelDiv = document.getElementById('panel');

  var data = new PlacesDataSource(map);

  var view = new storeLocator.View(map, data);

  var markerSize = new google.maps.Size(24, 24);
  view.createMarker = function(store) {
    return new google.maps.Marker({
      position: store.getLocation(),
      icon: new google.maps.MarkerImage(store.getDetails().icon, null, null,
          null, markerSize)
    });
  };

  new storeLocator.Panel(panelDiv, {
    view: view
  });
});
  相关解决方案