Google Maps v3 marker over infowindow - google-maps-api-3

I need to display marker over opened infowindow.
Here is an example of what I'd like to do
If I understand correctly, the property zindex for marker and infowindow not act for each other.

You are correct, the z-index property works only along with the same type of objects (relative z-index). Marker z-indexes compared with other Markers, Polygons with other Polygons, and InfoWindows with other InfoWindows. Each of these types have their own layer z-index related to each other that cannot be overridden. Maps API #InfoWindowOptions and Maps API #PolylineOptions; check z-index description. It's written throughout the API documentation.
I don't remember the exact order of the main layers, but it can be tested easily. For sure though InfoWindows appear above Markers.

:) 1> marker you can use image to set image of default marker google.
2 : InfoWindowOptions can display HTML inner.

Related

Google maps with color/gradient overlay

On google maps, on the website, is there a way to make it so that all land area is of a gradient color, and no names, text etc shows? so just a gradient color map, with nothing else.
Or is it better to use an image for such a case? The thing is, i need to show pins at specific countries, so idk if its simpler to use an image, and set each pin position separately, or to somehow use google maps, if its possible to set it to gradient color?
any ideas are welcome
You can create your own style map, I suggest you check the documentation
https://developers.google.com/maps/documentation/javascript/styling or https://console.cloud.google.com/projectselector2/google/maps-apis/studio/styles
The second link takes you straight to the management console to create your map.

Change google maps marker on directions

How can i change the marker icon on directions on google maps?
NOTE: The dirty approach of pure CSS based on the classes ids of container elements is not accepted nor a js search-and-replace the img src.
After expired bounty and lots of research im answering my own question: In Google maps API v3, since 24 June 2014 there seems to be no official way to change these markers.
Possible dirty solutions:
CSS:
set display:none to whatever class the image is, and set a custom background on the parent div. set width and height accordingly.
Click functionality between "directions"-"markers on map" will be maintained, but something as little as a change in the class name returned by the API will cause problems. Not semantically correct as the image displayed is a background of a div, and its not clickable.
JS:
Add a listener and after the directions call, when map is idle, search the markup for the image and replace the img src. Will fail if markup returned from API is changed since you have to select by id, class name or something similar.
JS:
Scrap the data, and re-render as you wish. Click functionality between "directions"-"markers on map" of course is lost, and still unstable since is based on scrapping.
In any of the above cases you ll have to suppress markers in markerOptions and also change the marker that is used as point "A" and point "B" to match your dirty solution result.
Will be more than happy to see a better answer than this.

KineticJS canvas on top of Google Map. Shapes fall apart on drag and zoom

I'm trying to display property boundaries on top of a Google Map by using KineticJS and a Google Maps OverviewLayer.
It works great (1000 parcels being shown at a time. Much faster than Google.Maps.Polygon())
When I drag the Google Map down, then zoom in/out, the top shapes get cut off and don't re-draw when I zoom back out.
I'm guessing its a setX, setY thing but I don't understand the underlying concepts enough.
Any help would be appreciated.
Here is my app:
KineticJS and Google Maps OverlayView test site
I added a light-green background to the KineticJS canvas to see what it happening when you zoom in.
The canvas seems to stay locked in place and the same width/height but when you zoom in I'm guessing the canvas should grow proportionally.
I can't figure out how to do that though....
Any help would be appreciated!

Get position of streetview pegman before he is dropped

I'm usually pretty handy with the google maps API, but I'm stumped on this problem. Does anybody know of a way to get the exact latlng of the pegman before you have dropped him (the red circle in the picture below).
I want to know because I want to change the heading of the panorama that will open to be at the point where the pegman was dropped so the view will be "looking at" the area the pegman was dropped.

Handling overlays on Google Streetview custom panoramas

i'm trying to use overlays on a custom google StreetView Panorama.
I was able to simply put one on my pano, but the position is totally random (i made some attempts until the effect was alright), and the change of rendering mode (in chrome which renders as a sphere) changes the effect.
The problem is clear: the custom panorama has no information about its dimensions (it has only a LatLng), so the relative positions are wrong.
Am i missing something?
The only thing i need is to put some clickable labels on the walls of a room, which modify themselves along with the rotating panorama. I searched a lot, but my efforts were inconclusive.
Mapsicle seemed to do what i needed, but if i understood correcly it's a dead project.

Resources