On my website: http://mapa.polskieszlaki.pl/ I'm using FusionTables for displaying markers (over 5000 of them). I've got also GroundLayer with regions (pink ones). But I wanted to change them to polygon (less loading) and have one problem.
FusionTable layer is below polygon and I want it to be above (markers are most important).
Is there a way to do it?
Put the polygon in a FusionTableLayer, load that first, then load the FusionTablesLayer with the markers.
Related
I have displayed a google map using a KML file as source. The map has a number of polygon areas marked in it. Is there any way to get the center coordinates of each of the polygons without the click event ? I need to display an info window above each polygons when the map is displayed.
Thanks
google.maps.KmlLayer is uses tile based rendering, you can't (at least at present) access the coordinates of the polygons except on a click.
You could use:
FusionTablesLayer, import your KML into that, then query it using either a Fusion Tables API v1.0 or a google.visualization (GViz) query) for the coordinates to get their center.
example using FusionTablesLayer and GViz
A third party KML parser like geoxml3 or geoxml-v3 to render the polygons as native google.maps.Polygon objects, and get their center. This will have performance issues with complex KML.
example using geoxml3
The question is pretty descriptive.
I am working on a website that provides locations for filming.
All the data in the site is currently stored in a MySQL database including geocode data for google maps.
I need to show polygon areas for the different london boroughs that has locations.
I have all the data as kml files, idealy i would like to store this in the MySQL database.
I have had success using fusion tables to display this data, but it seems silly to me to have to have this data duplicated on google just to use a fusion map layer, can i simply use a kml layer to render this data rather than having to create a fusion table and rendering it from that?
If so, is there a resource someone could point me to for more information?
UPDATE:
Thank you for the responses so far, i thought i would update the question with a little more info .
I eventually want to have all the areas displayed at the same time on my map and then when an area is clicked on ideally it would take you to another page on the website showing locations for that specific area.
I had initially tried using KML layers but i was getting errors saying my KML was invalid.
The KML was initially stored in a field in my database table, i think probably the errors were due to me not understanding exactly how google read in the KML data.
Using polygons would be far simpler to implement as i can get this data via JSON and then render the polygons from that.
I know now its not possible to have info windows with polygons, but i would just prefer to jump directly to another website page with info for that particular area using a click handler rather than show an info window.
Alternatively as suggested showing a tool-tip with a brief description of the area and a link to the page would be better, how the tooltip itself, is it possible to render on top the map?
I am slightly worried that I will reach the layer limit for the KML.
Is it possible to have multiple polygons rendered with KML on one layer, or do i need a separate layer for each clickable area?
The Google Maps API provides a pretty straightforward method to draw polygons.
Basic Example:
var polygon = new google.maps.Polygon({
map: your_google_map_instance,
paths: array_of_latlng_points,
fillColor: "#336699",
fillOpacity: .5,
})
EDIT: For this approach, you would need to parse your KML files (sorry, must've missed that when I first read it). You can import the KML files to a KML layer
You can overlay Polygons using KmlLayer, FusionTablesLayer (as you know), or native google.maps.Polygon objects.
KmlLayer and FusionTablesLayer render them as tiles, so for lots of Polygons (if you only need click events) will be more efficient. There are limitations on the number of KmlLayers that can be displayed on the map at one time and on FusionTablesLayer (but those don't seem to be causing you problems).
There are also third party parsers available for KML (geoxml3, geoxml-v3) which will take your KML and render it as native google.maps.Polygon objects. For lots of Polygons, this will be less efficient than tile based rendering, but it does allow mouseover/mouseout, and changing the properties of the Polygons dynamically.
You could also try data layers what have lots of events so you can display tooltips, info window, status text on various mouse events.
See samples in documentation:
https://developers.google.com/maps/documentation/javascript/datalayer
If you have many polygons (where the actual value of many depends on multiple factors, can be anywhere between 100 and 1,000) the best is to use a built in layer type. The fastest are the ones rendered on server, e.g. kml layer because this doesn't create hundreds of DOM elements in browser but still exposes click events so infoboxes can be displayed for each item.
In the worst case you can implement your own rendering with an image map, obviously by using an existing library like mapnik.
https://developers.google.com/maps/documentation/javascript/maptypes#ImageMapTypes
I have a map where at some point I draw around 14000 markers. If the bounds of the map is set to the entire area where the markers are drawn, it takes a long time to draw the markers (about 8 seconds). But if I zoom into an area where few/no markers will be drawn, then drawing the 14000 markers goes really fast, like 2-3 seconds.
I assume this is because the most time consuming process is to actually draw the marker icons to the tiles, and since the markers are added one at a time, the map is rendered a ton of times in a very short time span.
Therefore I wonder if it's possible to disable the map updating/rendering while I add my icons, then re-enable it when all the icons are added.
Any solutions with the similar effect is welcome
The rendering time goes down because api v3 doesn't add the 14 000 when you're zoomed in more tightly. It only adds the markers that are in the current bounds PLUS markers that are in the tile layer buffer around the edges (probably one or two tiles).
I'm kind of confused as to what you mean, but perhaps you want to add the markers only after the map has already been loaded:
google.maps.event.addListenerOnce(map,'tilesloaded',addMarkersFunction);
All that being said, 14 000 markers is A LOT of markers. Clustering markers when you have this many is not even what I would consider optional any more.
Yes, you could create a lot of markers, not associate them with the map. Then afterwards, call the setMap() function on each of them.
You could also only do this that fall within the current bounds.
And have you considered marker clustering to reduce the number of markers?
Would be useful to see your code.
Try using the MarkerManager library in the Google Maps API v3 Utility Library. It was designed for such problems. While there isn't much in the way of documentation, there are several useful examples and plenty of comments in the source code.
I have a list of markers that I want to create a polygon around (showing the area around the markers and not the markers themselves). So instead of having the poly points be the direct lat/long of the markers, I want the poly to "wrap" around the markers to show the relative area around them.
Any ideas on how I could accomplish something like this?
This is called a convex hull. There's an example at http://www.geocodezip.com/v3_map-markers_ConvexHull.asp which uses the algorithm described at http://softsurfer.com/Archive/algorithm_0203/algorithm_0203.htm
I'm working on a project where, after creating some nice code for creating polygons and attaching mouse events to them, the addition of KML layers (mainly placemarkers) results in uncooperative behaviour between the placeholders of the KML layer and the generated polygons.
If I create the polygons first and set the KML file afterwards, clicking on the placemarkers brings up the infowindow () as expected. However, mouseovers on the polygons below yield no result, whereas before they get highlighted and are clickable (which they aren't).
Setting the KML layer to null doesn't help either. The placemarkers disappear, but my polygons aren't registering.
When I first call the KML with placemarkers, the polygon layer called later goes on top of the placemarkers. The polygons are opaque, so you can see the placemarkers like you could through a window, but you can't click or interact with the placemarkers.
Setting the polygons to null results in the same behaviour as before. Placeholders still cannot be clicked on.
Help? I couldn't find a zIndex reference for the KML layer code, and I'm hoping that's all it is. I read somewhere else - and imagine this to be true - that the KML and user-gernated content "layers" are conflicting with one another - the latter one that's put on the map takes focus, captures events, etc. I would've thought that it wouldn't matter, in the same way that you can have divs on top of other divs, especially if you use indexing.
If you simply want to display the information in the KML layer and not have it react to user events, you can add the suppressInfoWindows flag to the constructor:
var myKmlLayer = new google.maps.KmlLayer('http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml', { suppressInfoWindows: true });
This will effectively shut off all interactions and let your other layers receive interactions.
Edit: Forgot to mention that a good source of information is the Google API V3 site discussing KML layers