Drag multiple polygons at once in Google Maps Javascript API v3 - javascript

It is extremely easy to make a polygon draggable in the Google Maps API v3 with the 'draggable' option.
How could I go about dragging multiple polygons at once, however?
The idea is that the user selects some polygons somehow (not the issue here: could be by clicking, drawing a bigger polygon, etc.), and then is able to drag any one of them and see them all move together to the destination.
Thank you.

The easiest approach would be to create a single polygon instead of multiple polygons. Polygons may have multiple paths, so you could merge all polygons into 1.

Related

How to draw millions of points on google maps?

I have millions of points I want to draw on google maps coming from an array.
I was looking at circles example
However, the problem is circles are... circles. Is there some way to draw circles such that it is like a canvas so it doesnt really matter how many points I draw on it?
I believe the answer is don't. That's too many markers. Per the table below (grabbed from geek.com) you would have a screen with nothing but markers and no map, even if each marker were only 1 pixel each, which they aren't.
There are ready solutions for marker clustering like Markerclusterer or Markerclustererplus.
You can find these libraries on github:
https://github.com/googlemaps/v3-utility-library/tree/master/markerclusterer
https://github.com/googlemaps/v3-utility-library/tree/master/markerclustererplus
Sample pages and documentation are inside these repositories. Could it work for you?

How to select a polygon covered by another polygon using Google Maps API V3

I am using Overlay Shapes with Google Maps API V3 using Google’s Drawing Manager. I basically allow the user to draw a polygon and save it to a database. They can then edit these polygons at will or create new ones.
The issue I am having is that often new polygons will completely cover existing polygons. Then the user cannot select the polygon beneath the latest one.
I wondered if anyone had managed to devise a script that enabled a user to cycle through the selection of every polygon in a potential stack under the mouse cursor (or pointer/finger...)
The attached image illustrates the predicament. Ideally I'd like something like CTRL+Click to select the polygon beneath the currently selected polygon.
No idea how to even approach this and I could not fine any examples in existence.
Thanks in advance.
You can try using control click to change the z order.

Google Maps markers ontop of each other

So I have a probably not so unique scenario. The simplest way to explain it is a google map with all 50 US states, each state will have two markers. The markers are both driven by the same lat/long value. The problem Im having is that the markers are rendering ontop of one another. I somehow need to have them render next to one another or offset so that I can see both. The problem is how do I get it to not overlap into another state.
I saw some really neat "spider" functionality where it renders one marker and then if you click on it the others fan out, but the website was in another language.
I am going to try and use the following library.
https://github.com/jawj/OverlappingMarkerSpiderfier
The problem with the above implementation is that I am using a combination of KML and google maps client-side. I dont see a way to implement that for the kml markers
The Overlapping Marker Spiderfier project on GitHub will probably accomplish what you need.
Otherwise you can play around with the Marker's icon property. The icon can accept a Symbol which has and anchor that can be shifted from the default location (0,0).
Symbol documentation: https://developers.google.com/maps/documentation/javascript/reference#Symbol

Drawing routes on google maps

Is it possible to draw routes with google maps or any other map api? Like when you're looking for direction from point a to point b on google map with Get Directions button.
I'd like to draw a line that follows certain road but without the directions I don't need those. And if I can draw multiple lines between multiple points on the map that would be awesome.
Has anyone had experience with this before?
You can either use the Directions API or, if you really prefer to ignore the directions Google generates, you can use the maps API drawing functions to draw your own lines on the map.
You can also employ "drawing library"
https://developers.google.com/maps/documentation/javascript/drawing
But,this experimental tool cant specify colors nor line-thick via GUI.
My enhanced example is at:
http://members.jcom.home.ne.jp/tcltk-d/ge-navi.html
(select "Drawing" view to draw)

touch or click/drag to draw arbitrary area on Google Maps

I am familiar with how to draw circles and polygons on a Google Map using the javascript API. However, I've been looking at some android apps that allow you to "touch and draw" a freehand area on a map, not a collection of polyline/points or geometric shapes.
Is this functionality accessible to the js API? If so, how? I only find documentation on the polygons etc.
Note: this type of functionality is not what I'm looking for! Clicking at multiple points to define an area is fine, but I'm trying to do a real "drawing" style.
Thanks

Categories