I am working on a application and I want to get directions for more than 2 points
Which I assume other than origin and destination other locations are waypoints.
So I am trying to use directions.setWaypoint() to add waypoints to the map but it doesn't work
please help for me to understand what I do wrong.
I have created a JsFiddle https://jsfiddle.net/3uzm1nh0/1/
and this is the documentation I am referring to https://github.com/mapbox/mapbox-directions.js/blob/mb-pages/API.md
Thanks in advance.
You need someting like this
// = L.mapbox.directions({profile: 'mapbox.driving'})
var directions = L.mapbox.directions();
var directionsLayer = L.mapbox.directions.layer(directions).addTo(map);
var directionsRoutesControl = L.mapbox.directions.routesControl('routes', directions).addTo(map);
directions.setOrigin(L.latLng(14.6059596413528, -90.49169592683657));
directions.addWaypoint(0,L.latLng(14.60026436463006, -90.49669902226937));
directions.addWaypoint(1,L.latLng(14.59689160135752, -90.49520561914318));
directions.addWaypoint(2,L.latLng(14.60036292858185, -90.49586222238077));
directions.setDestination(L.latLng(14.6059596413528, -90.49169592683657));
directions.query();
Related
Im currently creating a map with leaflet and as the page loads all the checkboxes of my created layers are unchecked and im looking for a possibility to have them checked from the beginning, is there any way to do so?
Im a beginner when it comes to coding, did some research online and on the leaflet website but couldn't find any answer to my problem.
in the following code, the s0001 are my markers.
var BE = L.layerGroup([s0001]);
var GE = L.layerGroup([s0002]);
var ZH = L.layerGroup([s0003]);
var kantone = {
"Bern": BE,
"Genf": GE,
"Zürich": ZH,
};
L.control.layers(null, kantone).addTo(map);
Is this part of the code enough or do i need to put more of the code in my question?
Do i need to add/remove code or change up the code to make it work to have the checkboxes already checked as i load the page?
Many thanks in advance for your help and comprehension of me being a beginner !!
If you add some/all of the layerGroups to the map before you add the layers control, they will show up checked.
eg
var BE = L.layerGroup([s0001]).addTo(map);
var GE = L.layerGroup([s0002]).addTo(map);
var ZH = L.layerGroup([s0003]).addTo(map);
var kantone = {
"Bern": BE,
"Genf": GE,
"Zürich": ZH,
};
L.control.layers(null, kantone).addTo(map);
I would like to extract coordinates in GeoJSON/WKT format from user drawn polygon. I found next code:
drawnItems = new L.FeatureGroup();
drawnItems.addLayer(layer);
myjson = drawnItems.toGeoJSON();
console.log(myjson)
But in console I see only Object {__ob__: Observer} like this
I used example from here
What I am doing wrong?
If you were expecting to get a string, then you just missed the JSON.stringify(myjson) on the next line of the example you refer to.
I am using OpenLayers GWT. I want to put an GeoJSON shape on top of a Google Maps layer. I have done as follows:
String gson = "{here I put a valid GeoJSON string}";
GeoJSON geoJSON = new GeoJSON();
VectorFeature[] vf = geoJSON.read(gson);
myShapeLayer.addFeature(vf[0]);
The shape is showing on the map, but not a the right position. I think I have to transform the Vector to EPSG:900913 but I don't know how to do that with the VectorFeature. There is no transform function to use.
How can I apply the transformation to a GWT VectorFeature?
This question is not getting responses. I would like to explain better what I want to know:
In javascript Openlayers you can do:
var projWGS84 = new OpenLayers.Projection("EPSG:4326");
var proj900913 = new OpenLayers.Projection("EPSG:900913");
feature.geometry.transform(projWGS84, proj900913);
How can I do the same in the GWT version of OpenLayers?
Thanks in advance.
OpenLayers-GWT is missing the GeoJSON constructor that will take an options parameter, this has to be added in the OpenLayers-GWT source. In the mean time this has been added to the KML Vector class. So now you can do like this:
String kmlString = "{<string with KML>}";
FormatOptions formatOptions = new FormatOptions();
formatOptions.setInternalProjection(new Projection("EPSG:900913"));
formatOptions.setExternalProjection(new Projection("EPSG:4326"));
KML kml = new KML(formatOptions);
VectorFeature[] vf = KML.read(kmlString);
myShapeLayer.addFeature(vf[0]);
In the same way it should be added to the GeoJSON class to make the tranformation work.
If you have 2 pushpins on 'London' at the same geolocation, is there anything in the API to move them apart so they are both visible?
I can only find documentation on their old map points API which had PreventIconCollisions, this is what I want but can't see any reference to this in the new API.
I am using the JavaScript API.
So if I understand correctly, you have similar information on the same location, it this correct?
In order to display both information, you will have two options:
Merge information in the textbox using an appropriate way to present the information inside this ui element (using your own tabbed infobox for example)
Decluster the point manually when you're at a certain level of zoom
There is no default property to set this and it would really messy to do this on many pushpins, but in the main idea, you would have to: detect viewchangeend event, if you're at a certain level of zoom (or higher zoom level) then you're declustering them (I call it decluter nearby pushpins).
// Bind pushpin mouseover.
Microsoft.Maps.Events.addHandler(pin, 'mouseover', function (e) {
var currentPin = e.target;
currentPin.setOptions({ visible: false });
var currentLocation = currentPin.getLocation().clone();
var currentPoint = bmGlobals.geo.map.tryLocationToPixel(currentLocation);
if (currentPin.associatedCluster.length == 2) {
// Display the first pushpin
var pinA = createPin(currentPin.associatedCluster[0]);
var locA = bmGlobals.geo.map.tryPixelToLocation(new Microsoft.Maps.Point(currentPoint.x - pinA.getWidth(), currentPoint.y));
pinA.setLocation(locA);
bmGlobals.geo.layerClusteredPin.push(pinA);
// Display the second pushpin
var pinB = createPin(currentPin.associatedCluster[1]);
var locB = bmGlobals.geo.map.tryPixelToLocation(new Microsoft.Maps.Point(currentPoint.x + pinB.getWidth(), currentPoint.y));
pinB.setLocation(locB);
bmGlobals.geo.layerClusteredPin.push(pinB);
}
});
I will try to write a bing maps module about this, but in the fact, you'll have to get your clustered pushpins (or your own pushpin that has two associated data object) and then you will have to set their position based on the rendering on the client side.
I know this question is really old, but if someone is looking for something similar (clustering the pins) here is a good start: http://rtsinani.github.io/PinClusterer/
I'm using the GMaps, Location and User locations module on my Drupal site. I would like to have a map which can display the "coverage" of my users. The coverage radius is stored in a custom content type with reference to the user.
How is it possible to display users with only their coverage circle on a map? I saw a display type like this when playing with the GMap macros, so I think it would be possible to use GMaps that way.
I suppose most likely this isn't supported out-of-the-box with the GMap module. Anyway, I would be really glad if anybody could point me into the right direction...
I've managed to do this after all with the help of the Hungarian community. (I would be happy to link the original thread, but it seems it got deleted.)
Basically the "trick" was to make a little custom module with a hook:
function MODULENAME_preprocess_gmap_view_gmap(&$vars) {
if ( $vars['view']->name == "my_gmap_view" ) {
$map_object = $vars['map_object'];
$map_object['id'] = 'my_view_id';
foreach ($vars['view']->result as $key => $row) {
$shapes[$key]['type'] = 'circle';
// we have a profile field for the radius, but it could be anything...
$shapes[$key]['radius'] = $row->profile_values_profile_radius_value;
// center the circles on the coord
$shapes[$key]['center'][0] = $row->location_latitude;
$shapes[$key]['center'][1]= $row->location_longitude;
}
// we don't need any markers, just the circles
$map_object['markers'] = NULL;
$map_object['shapes'] = $shapes;
$vars['map'] = theme('gmap', array('#settings' => $map_object));
}
}