I am using the tutorial in google maps code found here:
http://code.google.com/apis/maps/articles/phpsqlajax_v3.html
and I am loading my markers from the mysql database.
What I want is to make markers move in an way that they represent the movements of a bus.
Is it possible?
Can it be done with polyline?
This sounds like a simple matter of using Marker#setPosition(). As you get the new positions for buses, get a reference to the marker for each bus and update it's LatLng value. You might maintain an array of markers that you iterate over or some sort of a mapping between bus identifier and it's marker.
And I don't understand how you would represent the movements of a bus using a polyline - that doesn't make sense. However, if you want to update a polyline, then you might do it by updating the path MVCArray passed to create the polyline. According to the documentation:
path MVCArray.|
Array.
The ordered sequence of coordinates of the Polyline. This path may be specified using either a simple array of LatLngs, or an MVCArray of LatLngs. Note that if you pass a simple array, it will be converted to an MVCArray Inserting or removing LatLngs in the MVCArray will automatically update the polyline on the map.
Related
I have a list of geojson polygons that i am showing on my map, i am trying to determine, based on the current bounds of the map, if any part of the polygon is on the map. Any ideas as far as functions in the api to determine this?
I have tried the bounds.contains() method but it looks like that needs a specific point rather than an area.
Eric, I think you can get a center point of each polygon and set marker to it. So you can use it to represent a polygon.
I have managed to add a polyline from a GPX file using Leaflet.js and the leaflet-gpx plus the result is here: http://ruter.pebi.dk/#gpx=https://dl.dropboxusercontent.com/u/1818604/ruter/2016/uge%2034/tl_5.4_km.gpx
I would like to be able to display distance markers along the route - any pointers as how to go about that?
There's a plugin for that, assuming you pass the GPX file to a GeoJSON using omnivore for example.
https://github.com/adoroszlai/leaflet-distance-markers
You'll need to use something like Turf.js or cheap-ruler, and their along() functions.
These functions take a line geometry on the surface of the geoid, and a distance (usually in kilometers), and return a single latitude-longitude point.
Once you have these functions to calculate the (geodetic) length of a line and points along that line given their distance to its beginning, fetching the position of milestones becomes a trivial task. Once you have these positions in a lat-lng format, it's also trivial to display them as markers with Leaflet.
I'm converting a mapping utility from Gmap to Bing. In Google Maps, you can easily add markers to the map, and each time you add a marker, you add the location of the marker to a bounds object, then call setBounds() on the map to recenter the map to fit all markers.
I cannot find a similar method to work with Bing Maps, and the docs are pretty lousy compared to Google's.
So far I've got the map created and markers added-- but the map stays stuck at the initial view, rather than updating to fit the markers.
Is there an equivalent of the setBounds method for the Bing javascript API, or is there another way to handle this?
The way to do this in Bing is:
1) Use the LocationRect.fromLocations function (http://msdn.microsoft.com/en-us/library/gg427621.aspx) to create a bounding box from your pushpins locations
2) pass the LocationRect created in one to the map objects setViewFunction as part of the ViewOptions parameter http://msdn.microsoft.com/en-us/library/gg427628.aspx
i think the question is clear enough .
I have some polygons in my Map , I have also some markers .
I want to count the amount of markers that are in every Polyogn .
The only way of doing this without prior preparation is to iterate through your collection of markers and use point-in-polygon analysis with each polygon until you find which polygon contains that marker. Keep a running total for each polygon.
Prior preparation to make this easier would be to maintain a record of which polygon contained the marker when you added that marker. You could do that with a custom attribute of the marker — marker.containedBy, for example — or the polygon (add the marker to an array attached to the polygon: something like polygon.containsMarkers=[]). Or even both.
Google Maps JavaScript API V3.
My mapping has me dealing with the idea of polygons, and I'm trying to develop a strategy before I dive into the code.
I'm never going to have more than one polygon on the map at a time, so I'm hoping I can define one polygon and reuse it as you can with markers.
Is my understanding correct that the polygons setPath(); function will move the polygon to represent a new array of points? The documentation says... "Inserting or removing LatLngs from the MVCArray will automatically update the polygon on the map." but it doesn't come right out and say that you can use setPath(); to give it an entirely new array of points.
I'm thinking in psuedocode...
// some event fires
polygon.setPath(latlngArray);
bounds = new google.maps.LatLngBounds();
$.each(latlngArray, function(key, ll){
bounds.extend(ll);
});
polygon.setMap(MyMap);
MyMap.fitBounds(bounds);
//a different event fires
polygon.setMap(null);
// build a new latlngArray
// do it again
Am I correct in thinking that I can reuse the same polygon object in this fasion, or do I need to rethink my strategy?
Thanks.
Skip
EDIT: The answer is yes it can. I'm going to hash out my code better and try to provide a well written answer, that shows the caveats I've come across. Such as, the map must be visible for map.fitBounds(); to give cogent results.
Yes it is quite possible to reuse the same polygon object...
I really don't have any code to offer. The psuedocode I listed in the question basically works.
These are the things I learned or chose in fleshing out my solution...
As stated earlier, the map can't be style="display: none;" for map.fitBounds(); to work as expected.
I already keep a container object that holds my markers. I created a container object for the polygon paths, and add a 'polygon' attribute to markers that are associated with a polygon, so multiple markers can reference the same polygon path.
Even for polygons with a single path, I chose to embed my path array, within another array, then use polygon.setPaths(); This way the code will scale easier if I expand to polygons with multiple paths.
When initially parsing the polygon path build a LatLngBounds object, and then save its bounds.getSouthWest(); & bounds.getNorthEast(); along with the path. This allows for quick and easy map.fitBounds(); at display time, and keeps from recalculating the same bounds multiple times.
Anyhow, yes it is certainly possible, and I think quite efficient to reuse the same polygon object with different paths.
San Francisco & Oakland recycling the same polygon object...
That's all i got!
Skip
UPDATE: I found some polygon data with multiple paths. It plugged right in.
yes, you are both correct in your assumption that redefining the setPaths will redefine the polygon, BUT you must setMap afterwards for the polygon to be redrawn. the polygon may be outside the api window, that is irrelevant. for ease of use, once "repointed", since the polygon may be outside your viewing window, it would be good USABILITY practice to redefine the center of the window using the setCenter method on the map. This code is a chunk that i removed from an application that allows users to draw a polyline and then convert it into a polygon (since user may want to fix perimeter, i allow her to go back and forth between polyline and polygon). i always use the same polygon and simply setPathSSSSSSSSS (there is an S in the end for polygons):
function confirmClosePolyline() {
var pathArrayTemp = areaPerimeterPath.getPath();
var decision = confirm("Change POLYGON?");
if (decision) {
areaMapPolygon.setMap(null); //makes polygon "invisible"/ removes
areaMapPolygon.setPaths(pathArrayTemp);
areaMapPolygon.setMap(map);
}
}
Currently, in 2020 Dec, its sufficiently to use only:
myOldPolygon.setPath(newLatLngs)
to redraw one with new path without resetting map property.
Have tried and this works ok.