Geofencing - I am beginner in OS MAPS.We are planning to develop user defined fence,when user click on points of his own choice on map then it should join with a line and finally coming to last point loop should be closed.
To achieve that we have used Vector layer to draw the polygon.Now after finishing the polygon.
a)How could we get the co-ordinates(lat,long) values of the drawn polygon.
b)Also how can I load from the database and draw the same fence with the saved co-ordinates.
Could anyone suggest some solutions for the above.
A partial answer, actually, I think you should split the b) part to another question since it raises many questions out of Openlayers scope, like: PHP, Database. So a) part:
draw.on('drawend', function(evt){
var feature = evt.feature;
var geom = feature.getGeometry();
var coords = geom.getCoordinates();
console.info(coords);
if(geom instanceof ol.geom.Polygon){
coords[0].forEach(function(each){
var formated = ol.coordinate.toStringXY(each, 2);
//just to visualize
element_coords.innerHTML += formated + '<br>';
});
}
});
Your Fiddle updated.
Related
I'm building a NativeScript app using the nativescript-google-maps-sdk.
I have added an eventlistener for the coordinateTapped event and now that it is working I want to plot a marker on the map at the position at which I tap.
I cannot find an example of this online or in the sdk documentation.
I feel I am very close and just have a few minor corrections to make.
var mapsModule = require("nativescript-google-maps-sdk");
function onCoordinateTapped(args) {
console.log("coordinate tapped!");
var mapView = args.object;
var marker = new mapsModule.Marker();
marker.position = mapsModule.Position.positionFromLatLng(args.latitude,args.longitude);
mapView.addMarker(marker);
}
Note: I've labelled this question with the google-maps tag as there is no nativescript-google-maps tag.
Never it's too late to answer this kind of questions.
The problem was that the args object doesn't have a latitude nor a longitude attribute, so you are trying to add a marker with latitude and longitude as undefined.
Inside your function onCoordinateTapped(args) you can access to two different positions.
First, args.object.latitude and args.object.longitude.
var lat = args.object.latitude;
var lng = args.object.longitude;
Those attributes stand for the current position of the map (you know, the center of it).
Second, args.position.latitude and args.position.longitude.
var lat = args.position.latitude;
var lng = args.position.longitude;
In this case, those attributes represents the actual position of your tap on the map.
Also, this works on coordinateLongPress.
Hey #Danoram you code looks'n'feels right and although there is no XML file I guess you have used the coordinateEvent to pass the fallback function onCoordinateTapped like here
<maps:mapView coordinateTapped="onCoordinateTapped" />
Is that working out for you or are you experiencing some kind of error/unexpected behaviour? It is not entirely clear from your post where the issue is...
NO, THE ABOVE ANSWERS DON'T ANSWER MY QUESTION. PLEASE READ MY UPDATE BELOW TO SEE THE CLARIFICATION WHY THIS IS A DIFFERENT CASE!!!
I'm using Google maps API V3. When I write this code:
map.fitBounds(map.getBounds());
the map zooms out!
I understand that it's according to the documentation since fitBounds ensures to show the given bounds on the map so that all the edges are shown inside the map. Therefore, the answer I'm looking for lies into the following:
How to modify the result of getBounds to be used for fitBounds without zoom effect afterwards?
Basically, I'm quite sure this can be calculated because that's what the map does, but in the opposite direction, when adding margins, to show the given bounds completely. In these terms, tell me how to calculate the margins (and therefore, how to calculate the correct input for fitBounds having output from getBounds) and your answer will be accepted.
Thanks in advance!
Update:
Zoom and Center retrieval and setting does not work for me! here's the reason why:
I am going to hold the map's viewport information in the database. Later on, I want to re-create the map and show the exact same location again. However, the mapping platform can differ from user to user. Therefore, zoom and center is not standard between different mapping platforms/frameworks and cannot be used in all them with the same results. Therefore, the only standard way is to hold the bounds in the database. So the question needs an answer exactly in the direction it is asking for.
Store instead of the bounds the zoom and center of the map and restore these values later.
I had the exact same problem and decided to shrink the bounding box resulting from getBounds() with 15%. That does the job nicely for me:
var neLat = map.getBounds().getNorthEast().k;
var neLong = map.getBounds().getNorthEast().B;
var swLat = map.getBounds().getSouthWest().k;
var swLong = map.getBounds().getSouthWest().B;
var boundingBoxPerc = 0.15;
var mapWidth = neLong - swLong;
var mapHeight = neLat - swLat;
var ne = new google.maps.LatLng(neLat - mapHeight * boundingBoxPerc, neLong - mapWidth * boundingBoxPerc);
var sw = new google.maps.LatLng(swLat + mapHeight * boundingBoxPerc, swLong + mapWidth * boundingBoxPerc);
map.fitBounds(new google.maps.LatLngBounds(sw, ne));
I am displaying two different leaflet maps in the same page. After a certain event. I want a Polyline to appear on both of them. I would like to avoid, if possible, to create a copy and keep two different variables.
I am trying yo use the following:
var line_coordinates = [[1,2],[3,4]];
var my_polyline = L.polyline(line_coordinates);
my_polyline.addTo(map1);
my_polyline.addTo(map2);
However, if I run the above code, the Polyline will be displayed only on the map2.
Afterwords, I will need to change again its coordinates to some new_line_coordinates, and I will run the following:
my_polyline.setLatLngs(new_line_coordinates);
my_polyline.redraw();
The polyline should now appear updated to the new coordinates. However, again, it appears only on map2.
What am I doing wrong? Is it possible to achieve what I am trying to do?
As geocodezip mentioned in a comment, adding a polyline to a map sets the polyline object's this._map instance variable. Therefore, there is no way to have the object rendered on both maps with the way in which it is currently implemented.
You can view the relevant source code here.
You can't add the same layer to multiple Leaflet maps. But I had a similar problem using a more complex GeoJSON layergroup and ultimately solved it by getting the GeoJSON object from the layer using toGeoJSON() and using it to create a new layer for the second map. For a simple polyline, you could use getLatLngs(). So:
var line_coordinates = [[1,2],[3,4]];
var my_polyline = L.polyline(line_coordinates);
my_polyline.addTo(map1);
var new_polyline = L.polyline(line_coordinates);
new_polyline.addTo(map2);
should work, as would:
var line_coordinates = [[1,2],[3,4]];
var my_polyline = L.polyline(line_coordinates);
my_polyline.addTo(map1);
var my_polyline_latlngs = my_polyline.getLatLngs();
var new_polyline = L.polyline(my_polyline_latlngs);
new_polyline.addTo(map2);
I'm using the Google maps API to allow users to set a location by clicking on a map. Wherever the user clicks, the marker is placed and it works quite well. My problem is, my users are adding duplicate locations to my application despite the fact that they can visually see there's already a marker at that location (I'm loading markers for existing locations from my database).
Is there a way, within the Google Maps API, to fire an event if a marker is placed within X distance of a marker already on the map? I know I could probably use the haversine algorithm in javascript in some way, but I'd like to avoid that kind of complexity on the client side if I can.
Another approach, which doesn't require any further calculating of distances or similar:
For every marker placed on the map also create a circle at the same position.
Hide the circle by setting fillOpacity and strokeOpacity to 0 and apply a radius that fit's your needs.
Result: the circle is not visible, but still exists. The map will not respond to click-events when the user clicks on the hidden circle.
Please try this method.. this may be require some modification based on your need, this will be client side but the logic can be implemented server side also.
function CheckIFMarkersAreNearBy(preExistingMarkersArray, milesToCheck, lat, lon){
var range = milesToCheck/70;
var minLat = lat - range;
var maxLat = lat + range;
var minLon = lon - range;
var maxLon = lon + range;
var markersNearBy = 0;
for( var i = 0; i < preExistingMarkersArray.length; i++){
if(preExistingMarkersArray[i].lat > minLat && preExistingMarkersArray[i].lat < maxLat && preExistingMarkersArray[i].lon > minLon && preExistingMarkersArray[i].lon < maxLon){
markersNearBy++;
}
}
alert('you have ' + markersNearBy + 'markers near by you current selection');
}
I don't think there is specific function for that. The closest thing you will find is going to be google.maps.geometry.spherical which includes a function to computeDistanceBetween(from:LatLng, to:LatLng, radius?:number)
So before you drop a new marker on your map just get the distance between your current markers and the newly requested one. Keep in mind, that even if Google Maps API provided way to do it, it would still be on the client side, so you would not be avoiding the "complexity on the client side" anyways.
I am getting line latitude & longitude as
LINESTRING(1491215.4689647 6893983.2031826,1494163.0718675 6894785.7919795)
after seeing this solution.
how to get points return from OpenLayers.Control.DrawFeature
Now what I want to do is that I want to display start point & end point on my web page.
So how can I extract latitude & longitude from here so that I can show it in my page.
If your linestring is already in OpenLayers, there is no reason to convert it to WKT. Linestring geometry contains array of Points. You can access components of geometry in several ways, for example:
drawControls[key].events.register('featureadded', drawControls[key], function(f) {
// First point
var firstPointGeom = f.feature.geometry.components[0].clone();
// Last point
var secondPointGeom = f.feature.geometry.components[f.feature.geometry.components.length - 1].clone();
// Now you got geometries, let's create features from them...
var firstPointFeat = new OpenLayers.Feature.Vector(firstPointGeom);
var secondPointGeom = new OpenLayers.Feature.Vector(secondPointGeom);
yourVectorLayer.addFeatures([firstPointFeat, secondPointGeom]);
});
Pay attention - this works with LineStrings. Probably it's not necessary to go into detail about clone(), it's up to particular use case, whether you need it, or you can use just var firstPointGeom = f.feature.geometry.components[0];
Thats WKT format, you're looking at. You'll potentially need to reproject those coordinates to the target projection if they are not in the same projection. After than, you should be able ot ask openlayers for the points of any given geometry using the base geometry functionaily. Get the point array from the linestring instance and iterate over it. Make sure you know the right coordinate order for your projection / data model.
Hope that helps!