I have a webpage with a Leaflet Map, I can add markers,filter markers and so on. My question is that how can I save it?
1.Load the Map
2.Add some Markers on the Map
3.(Optional) Filter the Markers on the Map
4.Save the map together with the Markers that put on the map in a database(any possible storage)
5.Opening the map in the browser and view same as what i just saved.
Ive search everything but its too hard to do it any possible suggestions?, TYIA
Depends on backend you are using.
For Database you can use Postgresql with PostGIS. You create table with geometry or geography column and save marker latlng there. In other columns you saves additional data that define marker (id, description, whatever).
You can also save current marker layer as geojson file. And load it on opening map.
But you need to write some backend that takes in markers data or geojson and do something with it server side.
You can also take a look at Leaflet.Storage (and django-leaflet-storage as an backend)
Related
There are logs where it is indicated: board number, time, date, latitude and longitude. information about their movement is constantly updated and new boards appear. how to display their movement on the map?
To display markers on a map, you can perhaps use Leafletjs for Javascript.
It is useful library that allows you to use a large array of mapping basemaps, and plot overlays on it, such as adding markers based on latitude or longitude, or drawing polygons or shapes. You can also overlay multiple maps, and there is a lot of functionality linked to the elements.
See their tutorials to get started or reference the documentation to see how you can manipulate the markers on a map.
I use react JS and socket.io to get data (coordinates of drones) from the server side.
Then, use Google API to display drones location as markers on the google Map.
The problem is that my animation is not smooth enough. (teleport)
My marker part code structure is something like
googlemap.js
componentDidMount(){
//setup Map
//setup initial Positions of the Markers
}
// every time it recerives new data from server, it will update the markers position
componentWillReceiveProps(nextProps){
//use setMap(null) to remove past markers on the map
//add the new markers
}
Is there any suggestion or 3rd party library to deal with this problem.
My idea now is to use RequestAnimationFrame?
interpolate some positions?
(I don't plan to use setInterval)
Thanks in advance
I would like get the KML or JSON data for the red polygon (as far as I know it's called polygon) area. I want to display the area in a custom map of my application and I will place some markers within this area.
You can check this example: https://goo.gl/maps/7SIeg
I just need to grab the KML or JSON object of the co-ordinates the red marked area.
I had same question.But, no there is no option that you can get KML of searched area and google maps will extract you a polygon.
But you can use various resources like
http://www.mapmash.in/kmlpolygon.html
http://geojson.io/
to create polygons yourself.
Regards,
Suyash
I am working on a (private) school project.
I am new to javascript and ran into a problem.
On this page, you will find the project: http://www.curlydutchman.nl/fishinglocations/
What I want is to make a search box in where I can search for the markers that are on the map.
I followed this with success (but removed them again): https://www.mapbox.com/mapbox.js/example/v1.0.0/filtering/
but the problem is that these markers are loaded in from a CSV file. It seems that I cannot edit these pins, and add them to my 'search by filter' list... Also, if I would copy the coordinates of my pins in to the CSV file, they would show up on a different location of the map.
So I believe that my only solution is to link a search field to the markers that are located in my Javascript.
Has anyone got an idea on what the solution to my problem might be?
You approach of searching for markers on the map using setFilter for the GeoJSON looks correct.
if I would copy the coordinations of my pins in to the CSV file, they would show up on a different location of the map.
This may be a function of coordinates being reversed.
GeoJSON = longitude, latitude
CSV = latitude, longitude (depends on the field names)
I am creating a website with Google App Engine using Python for the back end and I am trying to give the website some google maps functionality.
I would like to have it so that users can submit a marker onto the map and then that marker's GPS coords will be stored in a database along with some other text info and I am able to do all of this but I am not sure how to put all of these markers with their respective infowindows back out onto a map. I would imagine I could do some sort of for loop but I can't find what the javascript should be to place them all. And it is going to be over 1000 markers and more being added every couple days so just putting them on a map one by one isn't really an option.
See the articles section of the documentation, there are a number of articles about using PHP/mySQL, the concepts of which should be applicable to your system.
This one probably covers what you need:
Using PHP/MySQL with Google Maps
Shows how to use PHP/MySQL and the Google Maps API v3 to create a map that polls data from a database and shows as markers.