Как отобразить пользовательский элемент DOM в определенной позиции agm-карты

Question

Я собираюсь отобразить свой дом в agm-карту в моем проекте angular6.Когда я использую agm-маркер, я могу отображать только определенный значок и метку.То, что я хочу отобразить, выглядит так:

.user-location i {
  opacity: 0.7;
}
.user-location img {
  border-radious: 100%;
}
...

<a class="user-location">
  <i class="pin-icon"></i>
  <figure>
    <img src="../../assets/layouts/layout/img/new-icon.png" alt="" />
  </figure>
  ...
</a>

Answer 1

Я изменил маркер следующим образом:

<agm-map [latitude]="lat" [longitude]="lng"  [styles]="mapStyle === 'dark' ? styleDark : styleLight">
            <div  *ngFor="let marker of markers;">
                <agm-marker [iconUrl]="'/assets/markers/'+marker.type+'.png'" [latitude]="marker.lat" [longitude]="marker.long" (markerClick)='openMarkerInfo(markerInfo, marker)'>           
                </agm-marker>
            </div>
        </agm-map>

Если вы когда-нибудь захотите настроить карту, вы можете сделать следующее:

[styles]="mapStyle === 'dark' ? styleDark : styleLight"

в вашем файле TS вы будете иметь все свойства. Чтобы узнать больше о том, как настроить карту с помощью значков и цветов на карте, взгляните на этот репозиторий: https://github.com/devpato/SOSmap