The LoCARB Tracker Map

Tracking LoCARB could be considered a project all on its own as it took me several days to get a working version going. I initially searched for open source solutions to use but found them overkill for what I wanted. I just wanted a map which showed current and previous way-points with a way to display sensor and other important information received by LoCARB. Luckily for me I had already found a solution! For the past several years, I have been using a wonderful project called GPS Tracker to track my vehicles, and seemed would work well to track LoCARB with a little bit of modification. I didn’t know how to do it, but hey, I didn’t know how to do anything related to this project when I first started!

The GPS Tracker project by Nick Fox is a lightweight, customizable, and decently documented project which is what LoCARBs tracking system is built from. The only real downside is that development on the project has stopped as Nick has retired from programming and moved to France…He still does try to help as much as he can through website replies though. For more information about this project, head to the codes and guides page for the GPS Tracker link.

The LoCARB Tracker Map

But first, here are some pics of what the map looks like.

Modifying the MySQL database

I wont give a step-by-step tutorial on how to get it working as that is covered on the projects website, but I will include the modifications I made to get LoCARBs tracker working the way I wanted. I installed the GPS Tracker database and procedures using phpMyAdmin, and used these handy instructions here: https://www.websmithing.com/2014/04/21/how-to-set-up-the-gps-tracker-mysql-database-using-phpmyadmin/.

However, I needed to modify the default MySQL database that is used by the GPS Tracker project to work with the Rockseven HTTP POST endpoint I wrote about in order to allow me to include extra information to the map marker popup window which shows when clicking on a waypoint marker on the map.

To do this, instead of copying and pasting the create table command from the GPS Tracker github sql file (following the instructions I linked to above), I used the snippet below:

When you get to the point in the instructions where you are saving the procedures, use the following instead of the one for prcGetRouteForMap:

This should modify the database to include the extra columns needed by the HTTP POST endpoint, and also modify the prcGetRouteForMap routine to include those same columns when the map requests waypoint marker info.

Now all that’s left to do is to modify the maps.js file in the js folder, and the LoCARB GPS tracker is ready to roll!

Modifying the maps.js file

Replace the contents of the maps.js (in the JS folder) with the one below to get the map to display the information saved in the MySQL database.

Whew, all done! If everything was executed correctly one should have a working endpoint, modified MySQL database, and tracking map which shows all the info!

Helpful hints

For a light or Dark theme:

Name either the displaymap-light.php or displaymap-dark.php to index.php depending on whether you want a light or dark themed map page.

To use a Google Maps Layer

If you desire to use the google maps layer like I did, you’ll need to get an API key and modify the index.php file.

Replace this:

With this:

To Change the default map zoom

Edit the code below with a value between 1 and 21.