draw border surround country on which user clicked in openlayers - javascript

I am working on openlayers application. One of the task that I am going to do is when user clicks on the map or any country, then It should select that map and outline that country by drawing a border in vector form. Is this possible? If yes then please give me some code links for examples.

hi yes this is quite easily done. There are many ways to do so,
You will need to have a web service which will return the geojson (vector) boundary based on lat long passed.
on clinet side you will need to add a vector layer on top of your base map.
Assign a click handler on map (use a tool) and then on the click of the tool, call the web service passing the latlon , eventually when you get back the response from your web service inject the geojson to the vector layer.
Also look here https://gis.stackexchange.com/questions/35395/how-to-highlight-a-selected-country

Related

Draw custom shape on Google Map and store into Oracle database using C#

Is it possible to make a Custom shape (Using Mouse) on the Google Map using Gmap library in C# and then save it into the database and on the client request draw the stored shape on Google Map again? Is there any possibility for doing such operation in any other library or in Gmap (I am not expecting the code. Just an overview of doing it.)?
Oh Boy....this is absolutely doable! And I do it on day to day basis! Let me share how I achieve it. Another thing to keep in mind that this works for Google Maps and Bing Maps.
First, you have to represent Maps as not just coordinates but as collection of small squares. Now what do I mean by that?!
Have a look at this following picture. It's image of Czech Republic on google maps.
Now Czech Republic a.k.a Czechia, on google maps can be seen as collection of smaller square images or grids. You need to understand this concept very well in order to make this idea work. Now take a look at the following image where it shows how the image of Czechia on Google Maps can be visualised as collection of small square boxes or grid. These small square boxes hold images of parts of Czechia.
If you want to Zoom into a co-ordinate Xm,Ym (Easting:Xm, Northing:Ym), which is a place in Czechia and the name of that place is "Hermanuv Mestec" (as shown in the above picture) then you need to choose the bounding small box with co-ordinates (X1,Y1),(X1,Y2),(X2,Y1)&(X2,Y2), and fetch the underlying images in that box. This feature to fetch underlying images within that bounding box is actually Zooming In. So when you Zoom In or in other words fetch the underlying images within that bounding box, you get something as the following image:
Now, I hope you got the underlying concept of how Zoom In or Zoom Out (reverse process) and mapping co-ordinate system works if you want to achieve what you want to achieve because this concept is very important to grasp before you proceed.
You need to write a program which can do this transformation. And as of your question how to achieve this as follows:
Step 1: Use a Panel (Control) on Windows Form or WPF or asp.net application, which you are building.
Step 2: Use GMap Library in C# to fetch the image within a bounding box as mentioned above and populate/draw that image on the Panel.
Step 3: Have a function that tracks mouse events on the panel. This function/method will track the X,Y position of mouse move event on the panel and use Panel Drawing tools to draw objects on the panel based on this.
Step 4: Write another program to transform these mouse X,Y positions on the panel to co-ordidnates on the map. This piece/part of the program is important because this is what enables you to translate your representation of small square image breakdowns of maps into panel drawable objects, so that you can draw them again and again in future if saved properly in the database.
Step 5: When you draw an abject on the panel you track the X,Y mouse bounds on the panel and transform those points into co-rodinates using your custom program and then you save the co-ordinates in the database table.
Thats it! And in case you need to draw the same object saved in the database, you first need to fetch/draw the google maps image on the panel again, then need to fetch that shape of the object from the database by fetching the co-ordinates of that object saved in the database table, use your translation program to convert those co-ordinates into panel drawable points and draw the object back on the same panel.
Now, you can write this translation program (Easting Northing co-ordinates to Drawing Panel co-ordinates) yourself, which might take good few months or at least some time. Or you can buy customised program specialised to achieve this exact same function for a good amount of price.
Hope this helps.
You can also achieve this with Google Maps drawing object with JavaScript as mentioned in another answer but the issue is with the translation and saving the coordinates in the database. It's much faster and responsive in this aforementioned method. Anyway, this is how I do this, so kind of personal opinion.
Technologies required for the aforementioned technique is as follows:
Google Map Library/Bing Map Library (whichever you choose)
C# with .Net Framework 3.5 or above (.net framework lesser than this is also fine but may require bit more lines of code to achieve some functionality if you want to achieve complexity in this)
SQL Server Management Studio or anything equivalent depending on
the type of database and query you are planning to use.
I think you want to make a map overlay, and you can use Goggle Drawing Tools in conjunction with your map. See: https://developers.google.com/maps/documentation/javascript/examples/drawing-tools
This will create the overlay. Presumable you could write javascript code that would save the coordinates and attributes of the overlay to a hidden field once you hit a "Save button" . Then after form submission you could save this info to a database using standard techniques, and then when rendering the map the next time, insert the overlay info into the javascript output by your page,
I am not going to spend the time making this for you, but this is the approach I would take.
steps:
1) Get the geometry/shape out from google api.
2) Send/post to server using some popular exchange format, GeoJSON or WKT
3) Prepare a server's service/asp/web service to accept the request and translate/validate those geometries into Oracle SDO_Geometry user define type/struct.
4) Use some C# oracle library,
a) create Connection,
b) create command with parameter,
c) Initial an OracleObject, assign all the required properties like SDO_GTYPE, SDO_SRID.
d) Assign the OracleObject to the the named parameter in the command.
e) Execute the command and commit.
Hope this help.

Dynamically create markers in OpenLayers 3

I'm developing an application that loads lots of markers in OpenLayers 3.
However, I would like to dynamically display and load markers while user is panning at a certain zoom level.
Could someone provide me an example, or directions to do that?
For instance, I would like to first create an example that drops a marker where user has clicked on the map.
So, with this information, I will be able to handle the rest and post my solution here.
I've managed to create a way for setting this up:
http://weebah.com/weebah_examples/click_to_create.html

how to highlight a state in google maps on click any area in the state of a country

I am willing to highlight a state in the Google maps when user click on any area in the particular state. Supprose if I click on any area in the Washington sate. Then the Washington should be highlighted. Can you help me if any api or js is available to do like that.
There is no automatic API for this. You are going to have to draw a polygon either dynamically when the user clicks, or pre-draw all the U.S. State polygons in advance and hidden, then dynamically make the proper one visible when the user clicks.
As for making polygons in the shape of at least U.S. states, several persons have posted pre-defined polygon lists. One is here in StackOverflow: Geographical boundaries of states/provinces -> Google Maps Polygon
However, if you are looking at world-wide regions, states, and provinces, I doubt you will find pre-defined lists of them all. You may well have to create your own polygons by manually drawing on a Google Map or Google Earth, then export the polygon's lat/lng waypoints.
recently I am creating some relative, the tests I made was based on OpenStreetMap Nominatim (https://wiki.openstreetmap.org/wiki/Nominatim), is something like:
Click on map get Lat, Lng
Search by reverse Geocode, get state (or city)
Use Nominatim API to get a polygon_text (I use the geo WKT format), parse it
Draw the polygon or polygons (if multiplygon) with Google Maps API
Hope it could make some ideas come.

How to make selectable states in Australia (web map)?

The following link provided is something that I am after for a web mapping project.
http://developers.arcgis.com/javascript/samples/fl_dgrid/
The following link contains the utilisation of ESRI base layer map, and what seems to be a layer polygon possibly created in Arcmap, which allows users to select individual states, which when selected displays in a table.
I am trying to achieve the similar user interaction but just for Australia; for example, users will be able to select Western Australia, Northern territory est, which would then show which state the user selected in a table and generate data/information.
So far from my understanding, it seems as though ArcGIS for server could have been used in order to save the feature polygon layer, which is then called as a service from the coding and generated onto the base layer map of ESRI.
I am wondering if anyone can help me in terms of how to get this user interaction working just for a map of Australia. Would I create the polygon layer in arcmap, make that as a service using ArcGIS for server and then call it from coding?
Also, for the actual selection of each state and showing in a table, my understanding is javascript is used?
I guess I am just trying to get a more thorough understanding so I can go on from there, in order to create something similar just for Australia. Any help will be much appreciated.
Thanks in advanced.
There are probably a few different ways to go about getting this to work depending on what data you have available to you. My answer is based off what I see in the example you posted.
Assuming you had the polygons for Australia available to you, you should be able to modify the example and have a working version pretty easily.
Grid
For the grid, it looks like they are using the dgrid plugin which unfortunately I have no experience with so you would need to look up info on that.
Map
If you are wanting to have a polygon shown for each state/territory then you would need to have a service with all the polygon objects available to you. Not sure if this is already available or if you would need to create each polygon somehow.
When the map loads you would want to load all the polygons. When a user clicks on a state you would want to create a query to select the given polygon so that it is highlighted (they are using the OBJECTID field in the example which would be unique to each polygon). When selecting the polygon in the map you would also select the row in the grid(This is also done by the ID aka OBJECTID field from the polygon).

How to make a Google mashup, allowing multiple users to pinpoint multiple locations on a map?

I need some inputs on how to show a map (public to all) and allow any user (whose email I should be able to track) to click several points on the map and make appropriate markers (it should just be visible as a point, nothing special). Other users SHOULD see those points as well. I should be able to access data on the backend as to who selected what point.
Any code pointers?
Have a look at this example in the google maps API here to get the basic feel of how to play with markers.
Basically I would bind a mouse click event handler to the gmap, then use this to create a new marker at that position and add it to the map using map.addOverlay(marker).
You will then need some sort of server side script that you can pass the marker information to via an ajax call.

Categories