Custom panel example: Users in a Geofence

Custom panels in GpsGate are mash-ups that use REST API resources. You can dynamically display data from GpsGate and other business systems in the Vehicle Tracker. In this article, we will describe how to right-click on a geofence and list all vehicles inside it.

Learn more about custom panels.

Custom Panels setup

In this example, we use a script resource that will create a mash-up panel. We recommend that you host all your custom panels under the ”\GpsGateServer\IIS\VehicleTracker\CustomPanels” folder on your GpsGate server.

Paste the content of the CustomPanels.zip file in your local server in the following path:

GpsGateServer\IIS\VehicleTracker\CustomPanels\

If you have a hosted server, please contact support.

App Builder setup

The following step is to configure the App Builder and add the right-click script option for your geofences.

1. Select Admin > Developer > App Builder

2. Select + App

App builder 2.PNG

3. Add a name and a description and click on Save

Edit App 1.PNG

4. Select + Click Script

5. Put a name to your new script and select in Kind the option GeofenceRightClickMenu

6. Click on Edit

7. Paste the following code into the editor:

ui.iframe(
 'usersingeofence', 
 'Geofence/Users', 
 'https://myserver/gpsgateserver/VehicleTracker/CustomPanels/GeofenceUserPanel/geofenceuser.html?applicationid=' + application.id + '&geofenceid=' + geofence.id, 
 100, 100, 1300, 650
);

Where myserver is the URL of your current server. Note that you should use either HTTP or HTTPS in the URL according to how your server is configured.
Where appID is your application ID number. You can see this number at the end of the URL of your app.

8. Select a Geofence from your Geofence panel and click on Run Script button

Then click on Save.

image (5).png