In this post, we will talk about how to calculate the Distance & Travel Time between two Mapping point in FileMaker using Html and Javascript. It will work above FileMaker version 16.
Overview:
Initially, we need to create a Google API Key. Using this we can calculate distance between two mapping points through the following steps
Step 1 : Generating Google API Key for Map.
- Go to the Google Developer Console (https://console.developers.google.com/) and create a project.
- Navigate to the Google APIs and Enable the Geocoding API, Places API, Maps JavaScript API and Geolocation API for the Project
- From the Navigation menu, select APIs & Services > Credentials. On the Credentials page, click Create credentials > API key. The API key created dialog displays your newly created API key (an encrypted string).
- Click Close. The new API key is listed on the Credentials page under API keys. (Remember to restrict the API key before using it in production.)
Step 2 : Create a “Mapping Point” database in FileMaker.
- Create a new Database in FileMaker and name it as “Mapping Distance”and have to create a Table “Map Distance” to store the Location information.
- Show the Map in the Web Viewer by including the following HTML code and you must include an API key with every Maps JavaScript API request, replace YOUR_API_KEY with your API key (the encrypted string).
<!DOCTYPE html>
<html>
<head>
<meta name=”viewport” content=”initial-scale=1.0, user-scalable=no”>
<meta charset=”utf-8″>
<title>Mapping Distance</title>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px }
</style>
</head>
<body>
<div id=”map-canvas”></div>
<script src=”https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callb ack=Map”></script>
</body>
</html>
Step 3: Showing the Location Information, On Clicking any point in Map.
- On Clicking any of the Point in the Map we showing the Address, County, Latitude and Longitude information of the Point Marked with two Text Link Button “Set Starting Point” and “Set Destination Point”
- Using the Following Javascript Code we are Retrieving the Location Information and we must have to add this to the HTML code in Web viewer
Step 4: Set Origin Point by Mapping
- While on Clicking any of the point in Map and Clicking “Set Starting Point”, we are showing the “Origin Address”, For that we have to create a Script to store Latitude & Longitude through Parameter and have to call the Script in Javascript through fmp url.
- Here we are passing the Latitude and Longitude in the Script to get the Origin Address
- script we can get the Address of the Location in the XML format by running the following URL
- Then we need to extract the Xml format of the Address through following steps in the Script
- Then we can get the Address of location marked as Origin as Follow
Step 5: Set Destination Point by Mapping
- While on Clicking any of the point in Map and Clicking “Set Destination Point”, we are showing the “Destination Address”, For that we have to create a Script to store Latitude & Longitude through Parameter and have to call the Script in Javascript through fmp url.
- Here we are passing the Latitude and Longitude in the Script to get the Destination Address
- In the script we can get the Address of the Destination Location in the XML format by running the following URL
- Then we need to extract the Xml format of the Destination Address through following steps in the Script
- Then we can get the Address of Destination location marked as Destination as Follow
Step 6 : Calculating Distance & Drive Time
- Now on Clicking the “Calculate Distance” button,”Distance to Location” and “Drive Time” “will be Calculated through the Script as follow
- In the Script, while on running the Following Url we can get the Distance and Drive Time in XML Format
- Then we need to Extract the Distance and Time through the Following steps in Script
- Now the Distance and Drive Time between two Mapping points had been calculated as follow
If we implement the above mentioned steps, then we can Calculate the Distance between two Mapping points in Filemaker
The team at FMDBSolutions hopes this article taught you how to Calculate the Distance between two Mapping point in Filemaker using Html and javascript. FMDBSolutions is a team of well-qualified experts that have a lot of experience with the many versions of FileMaker Pro and the FileMaker Go app too.
Our team knows all about transitioning, migrating, converting, and upgrading for FileMaker. Companies that require FileMaker Integration can also use our services. We have worked with clients from the USA, Australia, and Singapore and will complete your FileMaker assignment in the best possible way at a lower price but the same or higher level of excellence.
If you want solutions to your FileMaker database, we can help. Click the below box for a free FileMaker consultation
You can also leave us your email below for receiving new updates regarding FileMaker and our company.