Embedding the Green-Gps map with the position of your devices on your website facilitates real-time visualization of device locations for visitors. This allows users to see the locations without needing direct access to Green-Gps, and you can protect this visualization using your own authentication mechanism, independent of Green-Gps's login credentials.

Below are the steps to embed the map on your website, showing current information of selected devices from a group.

Instructions to Embed the Map

Step-by-Step

To embed the map on your website, follow these steps:

1. Enable API access for your account: Follow the instructions to enable the API in your Green-Gps account. This includes generating an API Key.
2. Enable device access via the API: Configure the devices you want to display on the map so that they can be accessed via the API.
3. Create a group with the devices you want to display: In Green-Gps, create a group and include all the devices you want to visualize on the map.
4. Find the Group Identifier: Edit the created group and copy the group identifier (Group ID), which is needed to configure the API.
5. Embed the HTML code for the map on your website: Use the following HTML code, replacing my_group_id with the group identifier you copied in the previous step:
   <div id="map_canvas" style="width:100%;height:400px">Cargando...</div>
   <script type="text/javascript">plaspy_api_group_key="my_group_id";</script>
   <script type="text/javascript" src="https://s.trackservers.net/api/loadMapG.js"></script>

Integration Example

To see a functional example of this integration, you can refer to the following video: See functional example

Final Considerations

• Customization: Ensure that the map is well integrated into your webpage design, adjusting the size and style as necessary.
• Security: Verify that your website is configured to securely handle communication with the Green-Gps API.
• User Experience: Provide clear and accessible information so that your users understand that they are viewing real-time data from the devices through your site.

Embedding the Green-Gps map on your website is an effective way to provide visitors with access to real-time positions of your devices. By following the mentioned steps, you can easily integrate the map using the Green-Gps API, facilitating visualization and improving the user experience on your site.