Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Page I made to use Google's Distance Matrix API
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Find a route using Geolocation and Google Maps API</title>
<script type="text/javascript" src="jquery-2.1.1.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="read-csv.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
var initOutput = null;
var outData = null;
var timesArray = null;
function handleFiles(files) {
// Check for the various File API support.
if (window.FileReader) {
// FileReader are supported.
console.log("handleFiles pass");
getAsText(files[0]);
} else {
alert('FileReader are not supported in this browser.');
}
}
function getAsText(fileToRead) {
var reader = new FileReader();
// Read file into memory as UTF-8
reader.readAsText(fileToRead);
// Handle errors load
reader.onload = loadHandler;
reader.onerror = errorHandler;
}
function loadHandler(event) {
var csv = event.target.result;
processData(csv);
}
function processData(csv) {
var allTextLines = csv.split(/\r\n|\n/);
var lines = [];
for (var i=0; i<allTextLines.length; i++) {
var data = allTextLines[i].split(';');
var tarr = [];
for (var j=0; j<data.length; j++) {
tarr.push(data[j]);
}
lines.push(tarr);
}
console.log(lines);
initOutput = lines;
}
function errorHandler(evt) {
if(evt.target.error.name == "NotReadableError") {
alert("Cannot read file !");
}
}
function runParse(inData) {
outDataTemp = [];
for (var i=1; i<inData.length; i++) {
allSplit = initOutput[i][0].split(',');
surveyLat = Number(allSplit[0]);
surveyLng = Number(allSplit[1]);
southLat = Number(allSplit[2]);
southLng = Number(allSplit[3]);
list = [surveyLat, surveyLng, southLat, southLng];
outDataTemp.push(list);
}
outData = outDataTemp;
}
function calculateDistances(compiledString) {
var origin1 = [];
for (var i1 = 1; i1 < compiledString.length; i1++) {
var originSpecPoint = { "lat" : compiledString[i1][2] , "lng" : compiledString[i1][3] };
origin1.push(originSpecPoint);
}
var destinationA = [];
for (var i2 = 1; i2 < compiledString.length; i2++) {
var destSpecPoint = { "lat" : compiledString[i2][0] , "lng" : compiledString[i2][1] };
destinationA.push(destSpecPoint);
}
var service = new google.maps.DistanceMatrixService();
service.getDistanceMatrix(
{
origins: origin1,
destinations: destinationA,
travelMode: google.maps.TravelMode.WALKING,
unitSystem: google.maps.UnitSystem.METRIC,
avoidHighways: false,
avoidTolls: false
},
callback);
}
function callback(response, status) {
timesArrayTemp = [];
if (status != google.maps.DistanceMatrixStatus.OK) {
alert('Error was: ' + status);
}
else {
var origins = response.originAddresses;
var destinations = response.destinationAddresses;
for (var i = 0; i < origins.length; i++) {
var results = response.rows[i].elements;
for (var j = 0; j < results.length; j++) {
timesArrayTemp.push(results[j].distance.text);
}
}
}
timesArray = timesArrayTemp;
}
</script>
</head>
<body>
<h1>Route calculator</h1>
<input type="file" id="csvFileInput" onchange="handleFiles(this.files)"
accept=".csv">
<button onclick="runParse(initOutput)">Parse Transit Matrix</button>
<button onclick="calculateDistances(outData)">Calculate Distances</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.