Next code is add circle to map:
var mylayer = L.circle([60, 54.75621], 200).addTo(Window.map);
but I want to add coordinates from variable: eq.coordinates
console.log(eq.coordinates);
Print on console: POINT(31.5 42.2)
I want to do something like:
var mylayer = L.circle(eq.coordinates).addTo(Window.map);
L.circle wants latlng coordinates.
If you want to use pixel coordinates you have to convert them to latlng coordinates using http://leafletjs.com/reference-1.0.0.html#map-containerpointtolayerpoint
If you could put an example online, this would help helping you
Related
i want to use the addLatLng function to add a new point to my multipolyline. I am able to use the function with a normal single polyline, but with for example two lines, i don't know how i can access the second ring to add the new point.
I have tried some of those...
var polyline = L.polyline([[], []], {color: generateRandomColor()}).addTo(map);
var point = {lat: lat, lng: long};
var arr = polyline.getLatLngs();
polyline[1].addLatLng(point); //nope
polyline.addLatLng(arr[1], point); //nope
polyline.addLatLng(point) //yes but adds to the first polyline
I also can't understand the hint from the docs -
addLatLng( latlng, <LatLng[]> latlngs?)
Adds a given point to the polyline. By default, adds to the first ring of the polyline in case of a multi-polyline, but can be overridden by passing a specific ring as a LatLng array (that you can earlier access with getLatLngs).
Can you please give me an example in javascript code?
Thank you so much!
You add the ring in the wrong order. Use following:
polyline.addLatLng(point, arr[1]); //yep
Similar to the problem found in this question
How to convert OpenLayers polygon coordinates into latitude and longitude?
I have setup a basic map to capture a user defined polygon and convert it to GeoJSON, whilst I'm able to do this with its native projection (ESPG:3857) I would like to take the captured GeoJSON and convert it to EPSG:4326 - which I will then save away. Using the above method of capturing the feature on the drawend event and performing a transform however removes the polygon as the new co-ordinates are not represented in the projection of the map any longer. I am unable to figure out how to to save the GeoJSON in the format I need without deleting the existing polygon
I have tried performing this by using getFeatures on the vector source of the polygon and then performing a transform from the projection i'm using to the projection I want, but this still returns the same coords, I have also (like the linked article) tried using the the writeFeatureObject but it still saves incorrectly
https://jsfiddle.net/20gxo3nt/
dragBox.on('drawend', function(evt){
/* geom = evt.feature.getGeometry().transform('EPSG:3857', 'EPSG:4326');
console.log(geom.getCoordinates()); */
});
$( "#save" ).click(function() {
var geom=vectorSource.getFeatures();
console.log(geom);
var writer=new ol.format.GeoJSON();
var geoJsonStr = writer.writeFeatures(geom);
console.log (geom.proj.transform('EPSG:3857', 'EPSG:4326'));
/* console.log(geoJsonStr) */
});
Uncommenting the code on the drawend event will correctly console.log the co-ordinates,as well as demonstrate polygon disappearing
To get a new geojson
var geom = [];
vectorSource.forEachFeature( function(feature) { geom.push(new ol.Feature(feature.getGeometry().clone().transform('EPSG:3857', 'EPSG:4326'))); } );
var writer = new ol.format.GeoJSON();
var geoJsonStr = writer.writeFeatures(geom);
console.log(geoJsonStr);
Openlayers 6, no need to loop on features
var format = new ol.format["GeoJSON"]();
var geoJsonStr = format.writeFeatures(vectorSource.getFeatures(), { dataProjection: 'EPSG:4326', featureProjection: 'EPSG:3857'});
This question about JS, the library Leaflet.js and plugin Leaflet-draw.
how can I get coordinates of circle (radius)? For instance, getting coordinates (the first point) of rect, polygon, etc I'm using this:
var a = layer.getLatLngs();
arrY[i] = a[0].lat;
arrX[i] = a[0].lng;
But for circle it isn't working. Help me please. Sorry for my eng yet once
Check out the leaflet circle reference for all of the available items.
Sounds like you are looking for getLatLng() and getRadius() for your immediate need.
var latLng = layer.getLatLng();
var radius = layer.getRadius();
I want to zoom to a particular house in the google mapS, but when I provide its bounds and lattitude and longitude, it does not show images as well as the particular house. Can anyone provide the solution for this?
Solution would be probably to transporm coordinates first. Unfortunately when You pass coordinates to OpanLayers.LonLat(lon,lat) it is supposed to be WGS:84, while OpenLayer.Bounds() needs coordinates given in EPSG:900913.
You should then use Proj4js.transform and pass transformed coordintes in EPSG:900913
You can transform it like this one:
var map = new OpenLayers.Map('map');
var location.transform(map.getProjectionObject(), new OpenLayers.Projection("EPSG:900913"));
I develop a simple Google Maps application. I need just to place one marker on the map. For whatever reason, the marker is placed outside of the visible area of the map. It's a little bit strange, because the map is centered to the marker's coordinates. Here is the code:
var point1 = new GLatLng(location1.lat,location1.lon);
map1.setCenter(point1, 15);
var marker1 = new GMarker(point1);
map1.addOverlay(marker1);
map1.setCenter(point1);
When we drag the map a little bit, we can see the marker. What do I need is to center the map in the way the marker will be visible without map dragging.
Can anyone help me?
I believe the GLatLng object would accept String arguments as well - but to be safe I would ensure that they are integers - try using:
new GLatLng(parseInt(location.lat), parseInt(location.lon));
I also noticed you call map.setCenter a second time which ought to not be necessary.
Using the following code really ought to do it
map=new GMap(document.getElementById("map"));
var point = new GLatLng(parseInt(location.lat), parseInt(location.lon));
map.setCenter(point,5);
var marker = new GMarker(point);
map.addOverlay(marker);
If you still are having issues I would check that "location" object to make sure the .lat and .lon values are being populated correctly.
Check this code out:
var map = new GMap(document.getElementById("map"));
/* -- snip -- */
map.centerAndZoom(new GPoint(-1.2736, 53.0705), 8);
From a website I made a while ago. Feel free to check the source:
http://www.primrose-house.co.uk/localattractions
Just click the link in the top right to switch to the map view.