I have loaded a KML file into a Google map using both V3 and geoxml3. The file contains one line, saved from Maps walking directions. I want to add mile markers to the line, but I can't find any documentation on how to get a polyline from the KmlLayer (or from the geoXML3 object).
V3:
var layer = new google.maps.KmlLayer('http://blah.kml');
layer.setMap(map);
geoXML3:
var kml_parser = new geoXML3.parser({
map: map,
processStyles: true,
createMarker: add_marker
});
kml_parser.parse('blah.kml');
Does anyone know
The first Polyline is accessible in geoxml3 by:
kml_parser.docs[0].gpolylines[0]
or as a property of the placemark
kml_parser.docs[0].placemarks[0].polyline
(the Polylines are not accessible in KmlLayer, they are rendered on tiles)
Example from a search of SO for [google-maps-api-3] geoxml3 polyline)
Another example:
http://www.geocodezip.com/geoxml3_test/v3_geoxml3_kmltest_linktoB.html?type=k&filename=http://www.geocodezip.com/geoxml3_test/SO_IT_info_kmlC.xml
Related
I have nearly 4 to 5 thousand markers plotted on the map. I want user to allow to draw a polygon on the map and then delete those markers which are within the shaded polygon. Can anyone please guide me on how to find which markers are within the shaded area of polygon ?
Firstly you'll need to use the geometry library. Append libraries=geometry to the query string of the URL you use for loading the Maps API:
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
Then you can use the containsLocation function to check if each marker is inside the polygon.
for (var i = 0; i < markers.length; i++) {
if (google.maps.geometry.poly.containsLocation(markers[i].getPosition(), yourPolygon)) {
markers[i].setMap(null);
}
}
I'm assuming here you've got these 5k markers in an array called markers. And by 'delete those markers' you simply mean remove them from the view. You'd perhaps also want to fire off an ajax request at this point, and/or remove them from that markers array.
I have been rendering KML files in the google maps by the geoXML library by the following way.
var geoXml = new geoXML3.parser({
map : map,
singleInfoWindow : true
});
geoXml.parse('http://DomainName/GeoSystem/redrawKML');
I came to know by the following way we could render KML files in the google maps.
var ctaLayer = new google.maps.KmlLayer({
url: 'http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml'
});
ctaLayer.setMap(map);
These two approach made me to ask following, (If it is stupid, I will update it in appropriate way)
Which is faster to render KML Files in google maps and why ?
Which is providing good support for handling events (mouse click, Key press, etc.)
Which is providing best support to validate the KML file which is being rendered from Server.
geoXML3 was created when maps API v3 did not have native KML support yet. It makes use of other API v3 objects like google.maps.Polygon, of which you can use all it event possibilities.
google.maps.KmlLayer support of events is limited. (only mouse click). There is also a limit of number of KML files which can be displayed on a map: https://developers.google.com/kml/documentation/mapsSupport
the native KML support is probably the most easy one to implement. geoXML3 however gives more possibilities.
both do the same job to validate the KML file
I have a google map and I am using the drawing library to let the user draw polygons on the map by clicking to add points.
As a comparison I looked at trulia.com. I don't know how the drawing library setup is being made on trulia (uses backbone and other stuff). While I draw a shape, I want it to get filled as soon as I have 3 points, even if I am still drawing, and the fill should change as I add new points (indicating what the shape/area would be if you'd close it in that moment).
On trulia.com, as soon as you have a 3rd point, the area designated by the existing points gets filled, even though you haven't finished adding points. They're using google maps api, right? But I can't find the setting for something like "fill shape as you add points". I've searched google a lot, no luck.
Does anyone know how to setup the map or the drawing library to have that behavior? I don't think that this behavior can be setup in the polygonOptions (I've looked at all the options documented on developers.google.com)... so, the setting must be somewhere else...
MrCroft, it seems #ddtpoison777 asked a similar question and found the solution among some Google Maps API samples. This is the relevant code taken from the example:
var poly;
var path = new google.maps.MVCArray;
function initialize() {
poly = new google.maps.Polygon({
strokeWeight: 3,
fillColor: '#5555FF'
});
poly.setMap(map);
poly.setPaths(new google.maps.MVCArray([path]));
google.maps.event.addListener(map, 'click', addPoint);
}
function addPoint(event) {
path.insertAt(path.length, event.latLng);
var marker = new google.maps.Marker({
position: event.latLng,
map: map,
draggable: true
});
markers.push(marker);
marker.setTitle("#" + path.length);
}
How do we add the weather overlay option to a Google map, just like on Google my maps?
I've searched for it, but i can't find the answer.
Do i have to call a weather web service?
You can display the WeatherLayerdev-guide on your map by taking two steps:
First, load the WeatherLayer library by adding the libraries parameter to the URL you use to load the map:
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?libraries=weather&sensor=false">
</script>
Then, you must create an instance of the google.maps.weather.WeatherLayerapi-doc class, passing any options in a WeatherLayerOptionsapi-doc object, and attach the WeatherLayer to the map:
var weatherLayer = new google.maps.weather.WeatherLayer({
temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
});
weatherLayer.setMap(map);
In addition to the WeatherLayer, there is also a separate google.maps.weather.CloudLayerapi-doc class that you may create in a similar way:
var cloudLayer = new google.maps.weather.CloudLayer();
cloudLayer.setMap(map);
There is no separate library that you must load to use the CloudLayer; adding the libraries=weather parameter to the URL that loads the map makes both the WeatherLayer and the CloudLayer available on your map. There as a Google Maps JavaScript API v3 Example: Weather Layer, that shows the usage of both layers.
I have got same trouble when I tried to use Google map apiv3 with weather layer. But luckily, I found this site http://code.google.com/p/gmaps-samples-v3/ that provides all Google map api v3 samples and they are worked. Hope this help.
Cuong Vo
I recently created a store locator using the "Google Maps API Store Locator" example.
Now I'm trying to implement the MarkerClusterer Library so that I can display a large single marker instead of multiple markers when users are zoomed out at a certain distance.
When I add the output code:
...
GDownloadUrl(searchUrl, function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName('marker');
map.clearOverlays();
var markerCluster = new MarkerClusterer(map, markers);
...
I get the following error:
marker.getLatLng is not a function
Has anyone tried to implement this piece in the past?
I think you're trying to use some Google Maps v2 or possibly v1 code with the v3 api, hence you get the error 'getLatLng is not a function'..
Try the v3 marker cluster library:
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/docs/examples.html
Here's an example:
http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclusterer/1.0/examples/advanced_example.html?