search

AckerApple / agm-overlays

Custom marker overlay for the @agm/core package
MIT License
25 stars 24 forks source link

Transparent image blocking hover state #24

Closed clpalmer closed 5 years ago

clpalmer commented 5 years ago

This might be related, I think, to the last comment in Issue #14 regarding the AGM marker image being present.

I'm using agm-overlay to render a custom (agm-snazzy-info-window) markers on the map, which look fine, but I also need to apply a hover state to the custom marker. This works fine except for a 40px by 40px transparent image rendered in the center by agm-marker, which I can't see any way (as agm-overlay is implemented currently) to get around it. The image is not identified in any particular way and is rendered in a separate are of the DOM with a managed z-index causing it to appear above my custom marker.

A solution for this that works in my case is to specify a custom iconUrl to the agm marker of size 0, but agm-overlay hard-codes that iconUrl and doesn't allow me to override it.

Propose either providing an iconUrl input that, if provided, will override the " " string here: https://github.com/AckerApple/agm-overlays/blob/2ee7c8624401149477c95b87a96da92cdba90f7d/src/AgmOverlay.component.ts#L160

Or, if that marker is truly never desired, then instead of setting: this.overlayView.iconUrl= " " set: this.overlayView.iconUrl = {"url": "", "scaledSize": {"height": 0, "width": 0}};

For me, that removes the transparent icon entirely so the hover state works as desired.

AckerApple commented 5 years ago

You’re overloading me with information and I’m uncertain how to proceed.

Can you be more brief and consise?

clpalmer commented 5 years ago

In a nutshell, I would like to be able to modify iconUrl in the line I specified, to remove the transparent icon preventing hovering on my custom overlay. Please provide an input I can set and use that to set iconUrl, if provided.

Or if you don't want to provide an input, change it as above to the icon object with 0 size.

clpalmer commented 5 years ago

Looked more at it and it seems that setting the scaledSize to 0 still results in a transparent marker of 16px. Another approach that seems to work better is to leave iconUrl as is and just set: this.overlayView.visible = false; along with the other iconUrl/latitude/longitude sets. This will hide the marker instead of rendering a transparent image that blocks hovering.

AckerApple commented 5 years ago

Sorry, I’ll admit I still can’t connect the dots of what you need or are reporting. I’m closing this issue and you need to start a new report from scratch. If it matters enough, you’ll find out how to express yourself or make a pull request.

I’m a dad with a lot on my plate, you’ll have to be super consise but also include enough context for me to grasp your needs or what it isn’t you’re saying

clpalmer commented 5 years ago

sigh not sure how I can be more concise than 'Insert this exact line of code in this exact place' but forget it. I'll make a PR instead.