ngx-mapbox-gl icon indicating copy to clipboard operation
ngx-mapbox-gl copied to clipboard

Can I show popup on mouse hover on marker?

Open sudhanshu-hytech opened this issue 2 years ago • 2 comments

I am currently showing markers and popups on click of markers. We have a requirement now to show popups on hover.

my template is like below :

                            <mgl-map #map1 
                                [style]="'mapbox://styles/mapbox/streets-v11'" 
                                [zoom]="[4]"
                                [maxZoom]="maxZoom"
                                [center]="[-95.7129, 37.0902]"
                                [fitBounds]="bounds"
                                [fitBoundsOptions]="boundsOptions">
                                <mgl-control mglNavigation [showCompass]="false"></mgl-control>
                                <ngContainer *ngFor="let deal of unlockedDeals">
                                    <mgl-marker #myMarker [lngLat]="lngLat[deal.deal_id]">
                                        <div class="marker"></div>
                                        <span><b>{{ deal.deal_name }}</b></span>
                                    </mgl-marker>
                                    <mgl-popup [marker]="myMarker" class="" [closeButton]="true" [closeOnClick]="false"
                                        [anchor]="'top'">
                                        <div class="marker-popup-details">
                                         custom popup
                                        </div>
                                    </mgl-popup>
                                </ngContainer>
                            </mgl-map>

no code relevant to map in component.

Kindly advise

sudhanshu-hytech avatar Apr 01 '22 11:04 sudhanshu-hytech

any help on this?

sudhanshu-hytech avatar May 24 '22 11:05 sudhanshu-hytech

Mapbox don't have hover event on marker. Maybe you can use a layer, and add hover event on it

791045873 avatar Jul 15 '22 01:07 791045873