谷歌地图：如何制作像Airbnb这样的自定义标记？

Question

我想制作一张包含Airbnb等自定义标记的地图：

即具有价格编号和方形外观的标记。代码是这样的：

<div class="map-marker" style="position: absolute; overflow: hidden; opacity: 0.01; margin-left: 0px; margin-top: 0px; left: 267px; top: 237px; z-index: 238; display: block; cursor: pointer;" onselectstart="return false;" ondragstart="return false;" title="">
  <div class="tooltip tooltip-bottom-middle tooltip-layout tooltip-primary">
    <div class="price-marker__label">
      <div class="price-label">
        <sup class="currency-prefix">$</sup>
        <span class="price-amount">108</span>
      </div>
    </div>
  </div>
</div>

我觉得这很容易。定义一个自定义的html标记组件，将其与坐标一起传递给谷歌地图，它将在那里。

但似乎比那更复杂。

我找到了Custom Google Map Marker like in Trulia map。它与我的问题非常相似。但是MarkwithLable现在不可用。

我在Google API文档中找到的是https://developers.google.com/maps/documentation/javascript/examples/marker-labels。这只是一个带标签的简单标记。而且我没有看到任何自定义HTML组件传入。

更新：

我认为RichMarker（https://github.com/googlemaps/js-rich-marker），也许我正在寻找什么？

Answer 1

您可以设置自定义标记类型，然后根据需要进行分配....

你有没有完成/ this /？

https://developers.google.com/maps/documentation/javascript/tutorials/custom-markers