在storeLocator上设置自定义商店标记.在谷歌商店

Set custom store marker on storeLocator.Store in Google

本文关键字:谷歌 自定义 storeLocator 设置      更新时间:2023-09-26

我试图为我的每个商店设置一个自定义标记。使用Google storelocator,有一个storelocator。使用. setmarker选项存储。

I tried a lot

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);

我一直试图在谷歌上找到一些东西,但没有太多关于storelocator项目。

我设法找到了存储定位器项目的GIT存储库。在这个存储库中有示例示例和演示标记位置的文件。如果您深入到examples目录并查看文件places.js。您可以找到如何用标记填充地方的代码。我正在添加一个小代码片段,有关详细概述,您可以查看整个项目。

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
  });
});