Attach Tooltips to agm markers

Topic: Attach Tooltips to agm markers

iomote pro asked 6 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>

Add comment

Damian Gemza staff answered 6 years ago

0 0 Best answer

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 6 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.

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Resolved

Specification of the issue

User: 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

iomote

Pro User

25Support score
3Questions 1Answers

0Snippets likes 0Snippets