Home >Web Front-end >JS Tutorial >Determining Coordinates to Be in a Certain Geofence with Turf.js
In this article I want to share how to determine the coordinates of a particular geofence using Turf.js. Before going into further explanation, we must first understand what a geofence is.
Geofence is an area defined by geographic boundaries. In this context, geofence can be used to identify whether a coordinate point is inside or outside a particular geofence.
To determine whether a coordinate point is inside or outside a geofence, we can use an algorithm called "point-in-polygon". This algorithm compares the coordinates of the point with the boundaries of the geofence and determines whether the point is inside or outside the geofence.
This algorithm can be implemented using various programming languages, including JavaScript. Using Turf.js, we can easily implement this algorithm to determine whether a coordinate point is inside or outside a particular geofence.
Before we start, make sure that we have Turf.js installed
npm install @turf/turf
Next we will create geofence data which we will use to test the point-in-polygon algorithm. We will create two geofences, namely geofence A and geofence B. In the real case we will probably use more geofence data.
const geofences = [{ name: "GEOFENCE A", area: "POLYGON ((-3.7217298785969 115.63838090675, -3.7220537413814 115.63826288955, -3.7223187199346 115.63816096562, -3.7225248143097 115.63800003307, -3.722653288701 115.63812341469, -3.7227978223688 115.63841577547, -3.7229048843297 115.63859548347, -3.7229209436227 115.63871886509, -3.7227576741301 115.63893880623, -3.7225248143097 115.63905950563, -3.7222705420217 115.63909437435, -3.7220912131008 115.63894148844, -3.7217057896247 115.63839968221, -3.7217298785969 115.63838090675))", }, { name: "Geofence B", area: "POLYGON ((-3.5699621771882275 115.63114368378018, -3.5702533651161104 115.63077406680864, -3.570797790703304 115.63111814910975, -3.571560426039895 115.63171246019817, -3.57190071482121 115.63216460943543, -3.5718740282540185 115.63274971077597, -3.5715080520186318 115.63328235185222, -3.571560820118364 115.63401612755369, -3.570722133147773 115.63472029448724, -3.570180630987183 115.63457002462798, -3.5697266007773276 115.63434087693018, -3.5693196959252274 115.63479148804018, -3.5691590755393277 115.63496314942017, -3.5686665061805276 115.63457691132018, -3.5692982798754276 115.63397609650018, -3.5699835932226276 115.63331090867018, -3.5703262497044275 115.63302123009018, -3.5706046580017277 115.63276373803018, -3.5705189939192272 115.63218438088018, -3.5700799653710273 115.63169085442019, -3.5699621771882275 115.63114368378018))", }, ]
Next we will create the coordinates that we will use to test the point-in-polygon algorithm. We will create two coordinate points, namely Truck A and Truck B.
const trucks = [{ id: "Truck A", location: [-3.57011986, 115.633629] }, { id: "Truck B", location: [-3.7403366, 115.6200883] }, ];
Because the geofence data we have is in string form, we need to convert it into an array of coordinates that can be used by Turf.js. Here is a function to convert geofence data into an array of coordinates that can be used by Turf.js:
function formatGeofences(geofences) { return geofences .map((geofence) => { if (!geofence.area || typeof geofence.area !== "string") { console.warn(`Area for geofence ${geofence.name} is missing or invalid.`); return null; } try { // Mengambil bagian dalam dari string POLYGON ((...)) const coordinatesString = geofence.area.replace("POLYGON ((", "").replace("))", ""); // Mengonversi string koordinat menjadi array koordinat [lat, lng] let coordinates = coordinatesString.split(", ").map((point) => { const [lat, lng] = point.split(" ").map(Number); return [lat, lng]; }); // Memastikan geofence tertutup (titik pertama sama dengan titik terakhir) const isClosedPolygon = coordinates[0][0] === coordinates[coordinates.length - 1][0] && coordinates[0][1] === coordinates[coordinates.length - 1][1]; if (!isClosedPolygon) { console.warn(`Geofence ${geofence.name} is not a closed polygon and will be removed.`); return null; } return { name: geofence.name, geofence: coordinates, }; } catch (error) { console.error(`Error formatting geofence ${geofence.name}:`, error); return null; } }) .filter(Boolean); // Delete null from array }
Once we have the geofence data and point coordinates, we can use Turf.js to implement the point-in-polygon algorithm. Here is a function to test whether a coordinate point is inside or outside a certain geofence:
const turf = require("@turf/turf"); const { geofences } = require("./geofences"); function checkTrucksInGeofences(trucks, geofences) { const results = []; for (const truck of trucks) { const point = turf.point(truck.location); let isInAnyGeofence = false; for (const geofence of geofences) { const polygon = turf.polygon([geofence.geofence]); // Validasi geofence polygon untuk memastikan titik pertama dan terakhir sama const isClosedPolygon = JSON.stringify(geofence.geofence[0]) === JSON.stringify(geofence.geofence[geofence.geofence.length - 1]); if (!isClosedPolygon) { console.warn(`Geofence ${geofence.name} is not a closed polygon.`); continue; } // Cek apakah truk berada dalam geofence const isInGeofence = turf.booleanPointInPolygon(point, polygon); if (isInGeofence) { results.push({ id: truck.id, geofence: geofence.name }); isInAnyGeofence = true; break; // Berhenti jika truk ditemukan dalam geofence } } // Jika truk tidak ditemukan dalam geofence mana pun, atau data tidak valid, tandai dengan `null` if (!isInAnyGeofence) { results.push({ id: truck.id, geofence: null }); } } return results; } // Memanggil fungsi dan mencetak hasilnya const truckLocations = checkTrucksInGeofences(trucks, geofencesNew); console.log(truckLocations);
In this tutorial, we successfully implemented the point-in-polygon algorithm using Turf.js. Using Turf.js, we can easily test whether a coordinate point is inside or outside a particular geofence.
The above is the detailed content of Determining Coordinates to Be in a Certain Geofence with Turf.js. For more information, please follow other related articles on the PHP Chinese website!