Googlemaps and geolocation

In PHsPeed it is very easy to integrate google maps...

We are currently busy building and implementing a community web application for the Dutch 'coalitie for inclusie' that maintains a community of ambassadors working in the field of 'inclusion' ((UN treaty for disabled people). No better test for version 1.2 than to use this new version in the field. There is a lot to talk about, but one of the features is a Google Map that shows the ambassadors' location in the Netherlands. Depending on the province, or kind of disability (i.e., visual disabled), you can find an ambassador that can help with all kinds of regulation, whether it is school, laws, etc.

Using Google Maps in PHsPeed is extremely easy. It is just a matter of putting the component on the form and apply some parameters.

Vnamba Min

However, as the locations are stored in a database, some minimal code is required to set up the map with locations. PHsPeed is a low code platform, not a 'no-code' platform. Before ambassadors are visible, they need to apply to a form (enabled for visually disabled people) and say something about the things they do. Besides this information, they also need to supply information about the city and postal code where they are located. (Not a full address, due to GDPR guidelines). This postal code and city are used to geolocate the location (also a PHsPeed component) and then stored in the database as a longitude/latitude pair. If you click on the icon, then the user text pops up with a link to require even more information.

Let's see how a map like this is built.

First, we need to design a form containing the google map. This is very similar to any visual design environment and if you need to see more, then look at our videos to see how simple this is. Next, we need to apply some code. Before the map is rendered, we implement an event used just before the map is rendered.

function gmaps_1_onBeforeRender($app)
{
  $$q->setSQL('select * from initiatief where poolid=:p');
  $$q->setStringFieldByName(':p', 'A');
  $rv=$$q->simpleOpen(true);
  if($rv===false) {
    return;
  } else {
    $c=0;
    while(!$$q->simpleEof()) {
       $icon='mm_20_blue.png';
       $$gmaps_1->newCoordinate($rv['lo'],$rv['la'], $rv['organisatie'], $rv['naam'], $icon, '', $c);
       $c++;
       $rv=$$q->simpleRead();
    }
  }
}

This is the ONLY code that has been written to implement the map that is shown above. The $$ notation is something specific for PHsPeed and points to fields that are on the form. The rest is plain PHP. You don't need code to set up anything else; the map will be fully bootstrap responsive!
You do need sufficient Google rights to be allowed to make use of the API of google. In PHsPeed there is a function to store all API keys for all kinds of external services.

Once the application is made, we will make a series of videos about how we did it. You'll be amazed at how simple things have become!

Happy coding!

21 Feb 2021 Blog None