Quick jump |
You can display the location data as a separate map for each table record or insert a large map to the List page. ASPRunner.NET supports several map providers, so that you can select the suitable one on the Miscellaneous screen -> Map settings.
To insert a large map into the List page, follow the instructions below:
1.Proceed to the Page Designer and select a page you wish to modify.
2.Click Insert - Custom Map on the main toolbar.
3.Enter the address, latitude, and longitude as text fields. If you do not have a field with address or if you want only to use the Latitude/Longitude fields, comment out the following line:
//mapSettings["addressField"] = "Address";
If you use Google Maps and store the latitude/longitude information, you can enable the clustering or heat map option.
To enable clustering, add this code:
mapSettings["clustering"]=true;
You can use custom clustering icons as well. There is a "source" subfolder in your project folder. Proceed there and create an "images" folder. Place images named m1.png, m2.png, m3.png, m4.png, and m5.png into the folder. These icons are used when the clustering is turned on.
An example of a clustered map:
To enable the heat map, add this code:
mapSettings["heatMap"]=true;
An example of a heat map:
4.Click OK.
5.Now the map is added to your web page. You can drag the map element to change its location.
Click Edit map settings to edit the code. Click Remove to delete it.
You can also edit the code on the Events page.
The result might look like this:
Note: clickable markers on the large map point to the View record page.
How to place a description on each map marker
1. Modify an SQL Query to create a calculated field with a custom name and address:
SELECT
CustomerID,
CompanyName,
ContactName,
ContactTitle,
Address,
Lat,
Lng,
concat(ContactName, '\n', Address) as DisplayOnMap
FROM customers
Notice the '\n' argument: it allows you to create multiline descriptions. concat() function is MySQL specific, similar functions exist in all databases.
2. Insert a map into the List page. Here are the settings you may use for this specific table:
// Longitude and latitude or address field should be specified
// name of the field in the table that used as an address for map
mapSettings["addressField"] = "DisplayOnMap";
// name of field in table that used as a latitude for map
mapSettings["latField"] = "Lat";
// name of field in table that used as a longitude for map
mapSettings["lngField"] = "Lng";
Latitude and Longitude fields are required, as we use the address field for marker description purposes.
How to display GPS locations (map markers) by date
For example, you have new geo-coordinates that were inserted into the database on a specific day. If you to display the GPS locations (map markers) by date, add a WHERE clause to the SQL query for the table you insert your map into.
You can use this query to select today's data:
SELECT * FROM mytable WHERE DATE(posted) = CURDATE()
Maps API providers have limits on the number of geocoding requests you can send per day, and also on a request rate. For example, if you use Google Maps API and have a page with 20 records with a map for each one, only about 10 maps will be displayed. To overcome those limits, you need to open a Premier account with Google that costs $10,000 per year.
The solution is to use latitude/longitude pairs instead of addresses for mapping purposes. Enable the Geocoding option on the Choose pages screen to update latitude/longitude information each time when a record is added or updated. The main question is how to convert the existing addresses to latitude/longitude pairs? We have added a small utility to ASPRunner.NET that does the job for you. Here are the instructions:
1. Proceed to the table that stores addresses and add two new fields to that table. Fields need to be able to store floating-point numbers. Use Decimal(10,6) or Double in MySQL. In MS Access use Number with 'Field size' Double.
2. Proceed to the field that is set up as a Map. Make sure that the Address and Latitude/Longitude fields are selected.
3. Proceed to the List page, choose to display all records, select all records, click Edit, then Save all. It takes some time to update all records, but you only need to do this once. New/updated records will update longitude/latitude automatically.
To speed up this process, you may want temporarily remove View as Map field from the List page and add it back once the geocoding process is finished.
Page Designer articles:
•Working with additional pages
•Using geolocation data in your web application
See also:
