Topic: Attach Tooltips to agm markers

iomote pro asked 5 years ago


Dears, I heed some help to attach a mdbTooltip to agm-markers, in order to show it on mouseOver and hide it on mouserOut events. I would like to avoid to use agm infowindow and use your mdbTooltip component instead. To do so I avoided to declare agm-infowindow tags on html, and added the mdbTooltip stuffs to agm-marker html tags:
<agm-map

    #mainMap

    [latitude]="map.lat"

    [longitude]="map.lng"

    >

    <agm-marker

      *ngFor="let marker of markers; let i = index"

      [latitude]="marker.lat"

      [longitude]="marker.lng"

      label=""

      [title]="marker.label"

      [iconUrl]="marker.markerUrlAsset"

      (mouseOver)="mouseMarkerOver(marker, i, $event)"

      (mouseOut)="mouseMarkerOut($event)"

      (markerClick)="markerClicked(marker, i, $event)"

      placement="top"

      [mdbTooltip]="'Marker label:'+marker.label"

      triggers="mouseenter:click"

      >

      <!-- Commented to avoid to show infoWindow on marker click!!!

      <agm-info-window>

      </agm-info-window> -->

    </agm-marker>

  </agm-map>

Damian Gemza staff answered 5 years ago


Dear iomote, Unfortunately, for now, that's not possible to attach tooltip on agm-marker component. We'll take a deeper look on this in the future and we'll try to resolve this problem. Best Regards, Damian

iomote pro commented 5 years ago

Ok... I'll try to find a workaround. Actually I'm looking for agm-snazzy-info-window, and it seems to be the right component to have such feature.


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 6.2.2
  • Device: any
  • Browser: any
  • OS: any
  • Provided sample code: No
  • Provided link: No