1092 lines
42 KiB
JavaScript
1092 lines
42 KiB
JavaScript
// JavaScript Document
|
|
|
|
//Using library file ccplGoogleMap.js please import this file before using below function
|
|
|
|
//Declaring global variable
|
|
var slat = new Array();
|
|
var slng = new Array();
|
|
var latDif = new Array();
|
|
var nlat = new Array();
|
|
var nlng = new Array();
|
|
var lngDif = new Array();
|
|
var countSmoothCall = 0;
|
|
var drawPathFlag = 0, drawAngle, drawDistance;
|
|
var myPathOptions;
|
|
var uIndex = new Array();
|
|
var vMap;
|
|
var drawTI, drawFlag = 0;
|
|
var serviceTI;
|
|
var difLat = 0, difLon = 0, pointlat1 = 0, pointlat2 = 0, pointlon1 = 0, pointlon2 = 0;
|
|
var pathIndex = 0;
|
|
var cu;
|
|
var upn = 0, unitPath = new Array();
|
|
var mapPro;
|
|
var sv;
|
|
//var pointDrag = false;
|
|
var mapDrag = false;
|
|
//-----------new variables for address------------
|
|
var pointsArrayAt5 = [];
|
|
var pathDescriptons = [];
|
|
var tempArrayinpos = [];
|
|
var pointInfo = null;
|
|
var lastInofCenter = null;
|
|
var rangeOfUnits = null; //this will store the value in of the circle that will cover all the units with in the range
|
|
//------end------------------------------
|
|
var intval = null;
|
|
/*---------------new variable-----------------------------*/
|
|
//variables for makinf the dragable fence
|
|
var geofencePoints = [];
|
|
var geoIndex = -1;
|
|
var geoFencesStore = [];
|
|
var drawGeoFenceFlag = false;
|
|
var fencePolygon = null; //fencePolygon is the polygon object
|
|
var dragfencePoly = false; //ths is used to set the polygon when we grag the markers
|
|
var enableUndo = false;
|
|
var id = 0;
|
|
var tempmap;
|
|
var enablePolyFencecolorChange = false;
|
|
var mouseupEventTimeOut = null;
|
|
var mouseupEvent = null;
|
|
//---------------------------------------------
|
|
//this variable will hold all the markers that points the location on to the path
|
|
var confermationTocloseFence = "Would you like to close fence ?";
|
|
var warning = "Please close fence !";
|
|
checkPointsEq2 = "Need atleast 3 points";
|
|
//this will hold the message that ois
|
|
var enableOneInfo = false;
|
|
/*--------------------------------------------*/
|
|
//Defining Class For ccpl map api
|
|
vtsMap.prototype.constructor = vtsMap;
|
|
//Constructor for ccplmap class
|
|
function vtsMap(mapOptions) {
|
|
vMap = null;
|
|
mapPro = mapOptions.mapPro;
|
|
this.unit = new Array();
|
|
this.infoWindow = new Array();
|
|
this.transinfoWindow = new Array();
|
|
this.circularGeoFence = new Array();
|
|
this.polygonGeoFence = new Array();
|
|
this.pgn = 0;
|
|
this.cgn = 0;
|
|
this.un = 0;
|
|
mapOptions.mapDiv.innerHTML = "";
|
|
vMap = new ccplGoogleMap(mapOptions.mapDiv, mapOptions);
|
|
//registering zoom event for map
|
|
//vMap.zoomEvent();
|
|
tempmap = this;
|
|
/*this event will make it possible to make a geo fence manualy*/
|
|
google.maps.event.addListener(vMap.googleMap, 'drag', function (event) {
|
|
// mapDrag = true;
|
|
// console.log("in drag" + mapDrag);
|
|
// if(mouseupEvent != null)
|
|
// mouseupEvent.stop();
|
|
// //mouseupEvent.remove();
|
|
if (mouseupEventTimeOut != null)
|
|
clearTimeout(mouseupEventTimeOut);
|
|
mapDrag = true;
|
|
mouseupEventTimeOut = setTimeout(function () { mapDrag = false; }, 100);
|
|
});
|
|
google.maps.event.addListener(vMap.googleMap, 'click', function (event) {
|
|
if (mapDrag) {
|
|
return;
|
|
}
|
|
else {
|
|
|
|
if (mouseupEventTimeOut != null)
|
|
clearTimeout(mouseupEventTimeOut);
|
|
mapDrag = true;
|
|
mouseupEventTimeOut = setTimeout(function () { mapDrag = false; }, 200);
|
|
if (drawGeoFenceFlag == true)
|
|
drawGeoFence(event);
|
|
}
|
|
});
|
|
//funciton to give the feature of the key down Event
|
|
//to on or off the keydownEvent
|
|
var EnableKeyDownEvent = true;
|
|
//to hold the last key code
|
|
var holdkeycode = null;
|
|
//this code will provide the functionality of the undo on the when we draw the
|
|
document.onkeydown = function (event) {
|
|
event = event || window.event;
|
|
if (EnableKeyDownEvent == true && holdkeycode == null && event.keyCode == 17) {
|
|
holdkeycode = event.keyCode;
|
|
EnableKeyDownEvent = false;
|
|
}
|
|
};
|
|
|
|
document.onkeyup = function (event) {
|
|
event = event || window.event;
|
|
if (holdkeycode == 17 && event.keyCode == 90) {
|
|
enableUndo = true;
|
|
if (geoIndex >= 0) {
|
|
google.maps.event.trigger(geofencePoints[geoIndex], 'click');
|
|
}
|
|
}
|
|
if (event.keyCode == 10)
|
|
holdkeycode = null;
|
|
EnableKeyDownEvent = true;
|
|
};
|
|
}
|
|
//Function to move map on desired posstion
|
|
vtsMap.prototype.moveMap = function (latitude, longitude) {
|
|
vMap.setCenter(latitude, longitude);
|
|
}
|
|
//this function will set the center of the map on to the unit whose unitID has been passed
|
|
vtsMap.prototype.setUnitCenter = function (unitID) {
|
|
var myMarker = null;
|
|
for (i in this.unit) {
|
|
if (this.unit[i].id == unitID) {
|
|
myMarker = this.unit[i];
|
|
if (myMarker != null && myMarker.getMap() != null)
|
|
vMap.setCenter(this.unit[i].getPosition().lat(), this.unit[i].getPosition().lng());
|
|
break;
|
|
}
|
|
}
|
|
if (myMarker != null && myMarker.getMap() != null) {
|
|
for (i in this.infoWindow) {
|
|
if (this.infoWindow[i].id == unitID) {
|
|
if (lastInofCenter != null) {
|
|
lastInofCenter.close();
|
|
}
|
|
this.infoWindow[i].open(vMap.googleMap, myMarker);
|
|
lastInofCenter = this.infoWindow[i];
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//Function to generate latlng of object
|
|
vtsMap.prototype.LatLng = function (lat, lng) {
|
|
return vMap.generateLatLng(lat, lng);
|
|
}
|
|
//Function to add a units on to the map.unitOptions is json object that has required details to add object
|
|
vtsMap.prototype.addUnit = function (unitOptions) {
|
|
if (this.checkUnitExistance(unitOptions.unitID) == false) {
|
|
this.unit[this.un] = vMap.addMarker(unitOptions);
|
|
//sUnit[this.un] = this.unit[this.un];
|
|
this.infoWindow[this.un] = vMap.attachInfo(this.unit[this.un], unitOptions.unitDescription, unitOptions.triggerInfo);
|
|
this.transinfoWindow[this.un] = vMap.attachInfo(this.unit[this.un].transMarker, unitOptions.unitDescription, unitOptions.triggerInfo);
|
|
this.unit[this.un].transMarker.setMap(null);
|
|
var tempMarker = this.unit[this.un];
|
|
google.maps.event.addListener(tempMarker, 'click', function () {
|
|
if (tempMarker.infoCheck == true) {
|
|
}
|
|
});
|
|
this.un++;
|
|
}
|
|
else {
|
|
this.showHiddenUnit(unitOptions);
|
|
}
|
|
}
|
|
//Function to add multiple units to map
|
|
vtsMap.prototype.addMultipleUnit = function (multipleUnit) {
|
|
for (i in multipleUnit) {
|
|
this.addUnit(multipleUnit[i]);
|
|
}
|
|
}
|
|
//Function to remove unit from map : it takse the unitId and hide the units from the map
|
|
vtsMap.prototype.removeUnit = function (unitID) {
|
|
for (i in this.unit) {
|
|
if (this.unit[i].id == unitID) {
|
|
for (j in this.unit[i].groupID) {
|
|
this.unit[i].groupID[j].setMap(null);
|
|
}
|
|
this.unit[i].setMap(null);
|
|
this.unit[i].transMarker.setMap(null);
|
|
}
|
|
}
|
|
}
|
|
//Function to check that given unit exists on map
|
|
vtsMap.prototype.checkUnitExistance = function (unitID) {
|
|
for (i in this.unit) {
|
|
if (this.unit[i].id == unitID) {
|
|
return true;
|
|
}
|
|
}
|
|
return false;
|
|
}
|
|
//Function to show existing unit on map
|
|
vtsMap.prototype.showHiddenUnit = function (unitOptions) {
|
|
for (i in this.unit) {
|
|
if (this.unit[i].id == unitOptions.unitID) {
|
|
this.unit[i].setPosition(this.LatLng(unitOptions.unitLatitude, unitOptions.unitLongitude));
|
|
this.unit[i].setMap(vMap.googleMap);
|
|
}
|
|
}
|
|
}
|
|
//Function to move units
|
|
vtsMap.prototype.moveUnit = function (unitOptions) {
|
|
for (i in this.unit) {
|
|
|
|
if (this.unit[i].id == unitOptions.unitID) {
|
|
if (unitOptions.geoFlag == 1) {
|
|
this.unit[i].setIcon(this.unit[i].transMarker.getIcon());
|
|
}
|
|
else {
|
|
this.unit[i].transMarker.setMap(null);
|
|
}
|
|
/*for (k in this.unit[i].groupID) {
|
|
this.unit[i].groupID[k].setCenter(new google.maps.LatLng(unitOptions.unitLatitude, unitOptions.unitLongitude));
|
|
}*/
|
|
this.unit[i].setPosition(new google.maps.LatLng(unitOptions.unitLatitude, unitOptions.unitLongitude));
|
|
this.unit[i].transMarker.setPosition(new google.maps.LatLng(unitOptions.unitLatitude, unitOptions.unitLongitude));
|
|
}
|
|
}
|
|
}
|
|
//Function to move multiple units
|
|
vtsMap.prototype.moveMultipleUnit = function (multipleUnits, rt) {
|
|
for (i in multipleUnits) {
|
|
this.moveUnit(multipleUnits[i]);
|
|
}
|
|
}
|
|
//this function will calculate the distance b/w two points
|
|
vtsMap.prototype.calDistance = function (path) {
|
|
var i, distance = 0, len = path.length - 1;
|
|
for (i = 0; i < len; i++) {
|
|
var lat1 = path[i].latitude * Math.PI / 180;
|
|
var lat2 = path[i + 1].latitude * Math.PI / 180;
|
|
var lon1 = path[i].longitude * Math.PI / 180;
|
|
var lon2 = path[i + 1].longitude * Math.PI / 180;
|
|
var R = 6371; // km
|
|
var dLat = (lat2 - lat1);
|
|
var dLon = (lon2 - lon1);
|
|
var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
|
Math.cos(lat1) * Math.cos(lat2) *
|
|
Math.sin(dLon / 2) * Math.sin(dLon / 2);
|
|
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
|
distance = distance + R * c;
|
|
}
|
|
return distance;
|
|
}
|
|
//this function will calculate the distance b/w two points
|
|
function findDistance(path) {
|
|
var i, distance = 0, len = path.length - 1;
|
|
for (i = 0; i < len; i++) {
|
|
var lat1 = path[i].latitude * Math.PI / 180;
|
|
var lat2 = path[i + 1].latitude * Math.PI / 180;
|
|
var lon1 = path[i].longitude * Math.PI / 180;
|
|
var lon2 = path[i + 1].longitude * Math.PI / 180;
|
|
var R = 6371; // km
|
|
var dLat = (lat2 - lat1);
|
|
var dLon = (lon2 - lon1);
|
|
var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
|
|
Math.cos(lat1) * Math.cos(lat2) *
|
|
Math.sin(dLon / 2) * Math.sin(dLon / 2);
|
|
var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
|
distance = distance + R * c;
|
|
}
|
|
return distance;
|
|
}
|
|
//this function will calculate the latlng b/w two points
|
|
function findLatLong(latitude, longitude, distance, angle) {
|
|
var lat1 = latitude * Math.PI / 180;
|
|
var lon1 = longitude * Math.PI / 180;
|
|
var R = 6371000;
|
|
var d = distance;
|
|
var lat = Math.asin(Math.sin(lat1) * Math.cos(d / R) + Math.cos(lat1) * Math.sin(d / R) * Math.cos(angle * Math.PI / 180));
|
|
|
|
var lon = lon1 + Math.atan2(Math.sin(angle * Math.PI / 180) * Math.sin(d / R) * Math.cos(lat1), Math.cos(d / R) - Math.sin(lat1) * Math.sin(lat));
|
|
lat = lat * 180 / Math.PI;
|
|
lon = lon * 180 / Math.PI;
|
|
var opn = {
|
|
latitude: lat,
|
|
longitude: lon
|
|
}
|
|
return opn;
|
|
}
|
|
//this function will calculate the angle b/w to points
|
|
function findAngle(lat1, lat2, dLon) {
|
|
lat1 = lat1 * Math.PI / 180;
|
|
lat2 = lat2 * Math.PI / 180;
|
|
dLon = dLon * Math.PI / 180;
|
|
var y = Math.sin(dLon) * Math.cos(lat2);
|
|
var x = Math.cos(lat1) * Math.sin(lat2) - Math.sin(lat1) * Math.cos(lat2) * Math.cos(dLon);
|
|
var brng = Math.atan2(y, x) * 180 / Math.PI;
|
|
return brng;
|
|
}
|
|
//Function to remove all units
|
|
vtsMap.prototype.removeAllUnit = function () {
|
|
this.removeInfowindow();
|
|
for (i in this.unit) {
|
|
this.unit[i].setMap(null);
|
|
this.unit[i].transMarker.setMap(null);
|
|
}
|
|
}
|
|
//Function to remove all geofence
|
|
vtsMap.prototype.removeAllGeoFence = function () {
|
|
for (i in this.polygonGeoFence) {
|
|
this.polygonGeoFence[i].setMap(null);
|
|
}
|
|
this.removeFence();
|
|
}
|
|
//Function to remove circular geofence from map
|
|
vtsMap.prototype.removeGeoFence = function (geoFenceID) {
|
|
for (i in this.polygonGeoFence) {
|
|
if (this.polygonGeoFence[i].id == geoFenceID) {
|
|
this.polygonGeoFence[i].setMap(null);
|
|
}
|
|
}
|
|
}
|
|
//Function to add polygon geofence to your map that already exist in database
|
|
vtsMap.prototype.addExistingPolygonGeoFence = function (geoFenceOptions) {
|
|
if (geoFenceOptions.path.length != 0) {
|
|
this.polygonGeoFence[this.pgn] = vMap.createExistingPolygonGeoFence(geoFenceOptions);
|
|
this.pgn++;
|
|
}
|
|
}
|
|
//function to add mulitple polygon geofence that already exist in database
|
|
vtsMap.prototype.addMultipleExistingPolygonGeoFence = function (multipleGeoFence) {
|
|
for (i in multipleGeoFence) {
|
|
this.addExistingPolygonGeoFence(multipleGeoFence[i]);
|
|
}
|
|
}
|
|
//new functions
|
|
//-------------------------------------------------------------------------------------------------------------------------------------------------------
|
|
/*this function places the marker when the user clicks on to the map and checks if it is first marker then places the click event on it that will
|
|
*complete our network when we click on it or if not the first marker than places draw the line(fence) starting from the first marker to the End
|
|
* */
|
|
drawGeoFence = function (event) {
|
|
//create the point that shows the joins on to the line
|
|
var point = new google.maps.Marker({
|
|
position: event.latLng,
|
|
map: vMap.googleMap,
|
|
title: 'join',
|
|
draggable: true,
|
|
zIndex: 30,
|
|
raiseOnDrag: false
|
|
});
|
|
id++; //id of the added point
|
|
point.id = id;
|
|
//geofencePoints will store all the point objects
|
|
geofencePoints.push(point);
|
|
geoIndex++;
|
|
if (geoIndex >= 1) {
|
|
/*this is the relation ship that is the parent point of the curently added point is the is the last added node
|
|
*and the child of the last added point is the curently added point*/
|
|
geofencePoints[geoIndex - 1].childPoint = point;
|
|
geofencePoints[geoIndex].parentPoint = geofencePoints[geoIndex - 1];
|
|
}
|
|
if (geoIndex == 0) {
|
|
//this event will place the event to complet the network when we click on the first marker and sets the drawGeoFenceFlag to false to stop
|
|
//the further draw
|
|
google.maps.event.addListener(geofencePoints[0], 'click', function () {
|
|
if (geoIndex == 1) {
|
|
//this concfirm box will check that the user really want to complete the network
|
|
alert(checkPointsEq2)
|
|
}
|
|
if (geoIndex >= 2) {
|
|
//this concfirm box will check that the user really want to complete the network
|
|
var confirmation = confirm(confermationTocloseFence);
|
|
}
|
|
if (geoIndex >= 2 && confirmation) {
|
|
//this will draw the line from first point to the last point added on to the map
|
|
var geoLine = new google.maps.Polyline({
|
|
path: [geofencePoints[0].getPosition(), geofencePoints[geoIndex].getPosition()],
|
|
strokeColor: document.getElementById('ocolor').value || "#ff0000",
|
|
strokeOpacity: 1.0,
|
|
map: vMap.googleMap
|
|
});
|
|
geofencePoints[geoIndex].childPoint = geofencePoints[0];
|
|
geofencePoints[0].parentPoint = geofencePoints[geoIndex];
|
|
geofencePoints[geoIndex].childFence = geoLine;
|
|
geofencePoints[0].parentFence = geoLine;
|
|
geoFencesStore.push(geoLine);
|
|
drawGeoFenceFlag = false;
|
|
enablePolyFencecolorChange = true;
|
|
tempmap.fencePloygon();
|
|
}
|
|
});
|
|
}
|
|
//this will check if there are two markers on to the map it will draw the line between them
|
|
if (geoIndex > 0) {
|
|
var geoLine = new google.maps.Polyline({
|
|
path: [geofencePoints[geoIndex - 1].getPosition(), geofencePoints[geoIndex].getPosition()],
|
|
strokeColor: document.getElementById('ocolor').value || "#ff0000",
|
|
strokeOpacity: 1.0,
|
|
map: vMap.googleMap
|
|
});
|
|
geofencePoints[geoIndex - 1].childFence = geoLine;
|
|
geofencePoints[geoIndex].parentFence = geoLine;
|
|
geoFencesStore.push(geoLine);
|
|
//dragFence();
|
|
}
|
|
//this event will make it possible to undo the last added line until we complete the network
|
|
google.maps.event.addListener(geofencePoints[geoIndex], 'click', function () {
|
|
//this will check that clicked marker has child or not and it must bot have child line
|
|
if (this.childPoint == null && this.childLine == null && enableUndo == true) {
|
|
//vMap.googleMap.removeOverlay(this.parentFence);
|
|
if (geoIndex >= 1)
|
|
this.parentFence.setMap(null);
|
|
geoFencesStore.pop();
|
|
//vMap.googleMap.removeOverlay(this);
|
|
this.setMap(null);
|
|
geofencePoints.pop();
|
|
id--;
|
|
geoIndex--;
|
|
if (geoIndex >= 0)
|
|
geofencePoints[geoIndex].childPoint = null;
|
|
if (geoIndex >= 0)
|
|
geofencePoints[geoIndex].childFence = null;
|
|
enableUndo = false;
|
|
}
|
|
});
|
|
//function to drag the geofece
|
|
google.maps.event.addListener(geofencePoints[geoIndex], 'drag', function (event) {
|
|
if (geoIndex >= 1) {
|
|
if (this.parentFence == null) {
|
|
this.childFence.setOptions(
|
|
{
|
|
path: [this.getPosition(), this.childPoint.getPosition()]
|
|
});
|
|
if (dragfencePoly == true)
|
|
tempmap.adjustFencePolygon();
|
|
}
|
|
else {
|
|
this.parentFence.setOptions(
|
|
{
|
|
path: [this.parentPoint.getPosition(), this.getPosition()]
|
|
});
|
|
if (dragfencePoly == true)
|
|
tempmap.adjustFencePolygon();
|
|
}
|
|
if (this.childFence == null) {
|
|
this.parentFence.setOptions(
|
|
{
|
|
path: [this.parentPoint.getPosition(), this.getPosition()]
|
|
});
|
|
if (dragfencePoly == true)
|
|
tempmap.adjustFencePolygon();
|
|
}
|
|
else {
|
|
this.childFence.setOptions(
|
|
{
|
|
path: [this.getPosition(), this.childPoint.getPosition()]
|
|
});
|
|
if (dragfencePoly == true)
|
|
tempmap.adjustFencePolygon();
|
|
}
|
|
}
|
|
|
|
});
|
|
}
|
|
//function to access the latitude and longitude: it returns the latitude and longitude of the points in the feofence
|
|
vtsMap.prototype.getCoordinates = function () {
|
|
var cordinates = [];
|
|
for (i in geofencePoints) {
|
|
cordinates[i] = geofencePoints[i].getPosition();
|
|
}
|
|
var checkClosedNewtork = (drawGeoFenceFlag == false) ? true : false;
|
|
//console.log({ 'cordinates': cordinates, 'isNetworkClosed': checkClosedNewtork });
|
|
return ({ 'cordinates': cordinates, 'isNetworkClosed': checkClosedNewtork });
|
|
}
|
|
//function to enable the drawing of the geoFence on map
|
|
vtsMap.prototype.enableDrawGeofence = function (flag) {
|
|
this.removeFence()//remove if any fence is on the map
|
|
this.resetFlags();//reset all the intial values that are used to draw the polygon
|
|
drawGeoFenceFlag = flag;
|
|
}
|
|
//function to remove Geofence
|
|
vtsMap.prototype.removeFence = function () {
|
|
for (i in geofencePoints) {
|
|
geofencePoints[i].setMap(null);
|
|
}
|
|
for (var j in geoFencesStore) {
|
|
geoFencesStore[j].setMap(null);
|
|
}
|
|
if (fencePolygon != null)
|
|
fencePolygon.setMap(null);
|
|
}
|
|
//function to showGeoFence
|
|
vtsMap.prototype.showGeofence = function () {
|
|
for (i in geofencePoints) {
|
|
geofencePoints[i].setMap(vMap.googleMap);
|
|
}
|
|
for (var j in geoFencesStore) {
|
|
geoFencesStore[j].setMap(vMap.googleMap);
|
|
}
|
|
}
|
|
//function to draw the plygon inside the geofense
|
|
vtsMap.prototype.fencePloygon = function () {
|
|
var polygonPath = this.getCoordinates().cordinates;
|
|
fencePolygon = new google.maps.Polygon(
|
|
{
|
|
paths: polygonPath,
|
|
strokeColor: document.getElementById('ocolor').value,
|
|
strokeOpecity: 0.8,
|
|
strokeWeight: 2,
|
|
fillColor: document.getElementById('ocolor').value,
|
|
fillOpacity: 0.35,
|
|
map: vMap.googleMap
|
|
});
|
|
dragfencePoly = true;
|
|
}
|
|
//this fuction is used to adjust the polygon that is inside tha map
|
|
vtsMap.prototype.adjustFencePolygon = function () {
|
|
var newpath = this.getCoordinates().cordinates;
|
|
fencePolygon.setPath(newpath);
|
|
}
|
|
//this functions is called when we change the color of the fence in to the text box
|
|
vtsMap.prototype.changeColor = function () {
|
|
|
|
var color = document.getElementById('ocolor').value;
|
|
for (i in geoFencesStore) {
|
|
geoFencesStore[i].setOptions({
|
|
strokeColor: color
|
|
});
|
|
}
|
|
if (enablePolyFencecolorChange == true)
|
|
|
|
fencePolygon.setOptions({
|
|
strokeColor: color,
|
|
fillColor: color
|
|
});
|
|
}
|
|
//----------------------------------------------------------------------------------------
|
|
//funciton to change the infowindow of content of the marker
|
|
vtsMap.prototype.updateInfoWindow = function (unitId, description) {
|
|
for (i in this.infoWindow) {
|
|
if (this.infoWindow[i].id == unitId) {
|
|
this.infoWindow[i].setContent(description);
|
|
}
|
|
}
|
|
}
|
|
//function to update multi infowindow
|
|
vtsMap.prototype.updateMultipleInfoWindow = function (changeInfoOptions) {
|
|
for (var i in changeInfoOptions) {
|
|
this.updateInfoWindow(changeInfoOptions[i].unitID, changeInfoOptions.description[i]);
|
|
}
|
|
}
|
|
//------------------------------------------------------------------------------------------
|
|
//these are the funcitons that are used to open the only one infowindow at a time
|
|
//or multiple info window at a time
|
|
//Map.prototype.enable the infoWindow
|
|
vtsMap.prototype.removeInfowindow = function () {
|
|
for (i in this.infoWindow) {
|
|
this.resetInfoCheckFlag()
|
|
this.infoWindow[i].close();
|
|
this.transinfoWindow[i].close();
|
|
}
|
|
}
|
|
//this function is used to show the infowindow of unit
|
|
vtsMap.prototype.showInfowindow = function (marker) {
|
|
for (i in this.infoWindow) {
|
|
if (this.infoWindow[i].id == marker.id) {
|
|
this.infoWindow[i].open(vMap.googleMap, marker);
|
|
}
|
|
}
|
|
}
|
|
//flag to set the true if we have to open a infowindow at a time
|
|
vtsMap.prototype.enableSingleInfo = function (flag) {
|
|
enableOneInfo = flag;
|
|
}
|
|
//this function is used to draw the the fence that is adjustabe on to the map,user can adjust the cordinates on to the map
|
|
vtsMap.prototype.drawFence = function (geoOptions) {
|
|
this.resetFlags();
|
|
for (i in geoOptions.path) {
|
|
var point = new google.maps.Marker({
|
|
position: new google.maps.LatLng(geoOptions.path[i].latitude, geoOptions.path[i].longitude),
|
|
map: vMap.googleMap,
|
|
title: 'join',
|
|
draggable: true
|
|
});
|
|
geofencePoints.push(point);
|
|
google.maps.event.addListener(point, 'drag', function () {
|
|
|
|
tempmap.adjustFencePolygon();
|
|
});
|
|
}
|
|
this.fencePloygon();
|
|
enablePolyFencecolorChange = true;
|
|
dragfencePoly = false;
|
|
}
|
|
//function to reset all the flags that have been used to draw the geo fence
|
|
vtsMap.prototype.resetFlags = function () {
|
|
geofencePoints = [];
|
|
geoIndex = -1;
|
|
geoFencesStore = [];
|
|
drawGeoFenceFlag = false;
|
|
fencePolygon = null; //fencePolygon is the polygon object
|
|
dragfencePoly = false; //ths is used to set the polygon when we grag the markers
|
|
enableUndo = false;
|
|
id = 0;
|
|
enablePolyFencecolorChange = false;
|
|
object = {
|
|
fenceId: null,
|
|
geofencePoints: [],
|
|
geoFencesStore: [],
|
|
polygon: null
|
|
}
|
|
}
|
|
//--------------------------------@uthor Sunil Kumar-------------------------------------------
|
|
//these functions draw the path followed by the units on the map draw the points on to the path to show there info
|
|
//at a particular posstion on click of that point
|
|
vtsMap.prototype.drawUnitPath = function (pathOptions) {
|
|
|
|
if (pathOptions.path.length > 1) {
|
|
|
|
var path = vMap.drawPath(pathOptions);
|
|
path.alias = pathOptions.alias;
|
|
unitPath[upn] = path;
|
|
upn++;
|
|
path.markers = [];
|
|
var sourceinfo = this.geoCode1(pathOptions.path[0], path, pathOptions);
|
|
var destinationInfo = this.geoCode2(pathOptions.path[pathOptions.path.length - 1], path, pathOptions);
|
|
this.findPointOnPath(pathOptions, path);
|
|
var pathLength = pathOptions.path.length;
|
|
if (pathLength > 1) {
|
|
var centerPoint = pathLength / 2;
|
|
centerPoint = Math.round(centerPoint);
|
|
path.centerLat = pathOptions.path[centerPoint].latitude;
|
|
path.centerLng = pathOptions.path[centerPoint].longitude;
|
|
this.moveMap(pathOptions.path[centerPoint].latitude, pathOptions.path[centerPoint].longitude);
|
|
}
|
|
}
|
|
else {
|
|
return;
|
|
}
|
|
|
|
}
|
|
|
|
vtsMap.prototype.drawUnitPath1 = function (pathOptions) {
|
|
if (pathOptions.path.length > 1) {
|
|
var path = vMap.drawPath(pathOptions);
|
|
path.alias = pathOptions.alias;
|
|
}
|
|
else {
|
|
return;
|
|
}
|
|
|
|
}
|
|
//function to remove the unit path
|
|
vtsMap.prototype.removeUnitPath = function (alias) {
|
|
for (var i in unitPath) {
|
|
if (unitPath[i].alias == alias) {
|
|
for (var j in unitPath[i].marker) {
|
|
unitPath[i].marker[j].setMap(null);
|
|
}
|
|
unitPath[i].setMap(null);
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
//function to show the unit path
|
|
vtsMap.prototype.showUnitPath = function (alias) {
|
|
for (var i in unitPath) {
|
|
if (unitPath[i].alias == alias) {
|
|
for (var j in unitPath[i].marker) {
|
|
unitPath[i].marker[j].setMap(vMap.googleMap);
|
|
}
|
|
unitPath[i].setMap(vMap.googleMap);
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
//function to remove all unit path
|
|
vtsMap.prototype.removeAllUnitPath = function () {
|
|
for (var i in unitPath) {
|
|
for (var j in unitPath[i].markers) {
|
|
unitPath[i].markers[j].setMap(null);
|
|
unitPath[i].markers[j].info.close();
|
|
}
|
|
unitPath[i].setMap(null);
|
|
}
|
|
if (pointInfo != null)
|
|
pointInfo.close();
|
|
}
|
|
//function to show the all unit paths on to the map
|
|
vtsMap.prototype.showAllUnitPath = function () {
|
|
for (var i in unitPath) {
|
|
for (var j in unitPath[i].marker) {
|
|
unitPath[i].marker[j].setMap(vMap.googleMap);
|
|
}
|
|
unitPath[i].setMap(vMap.googleMap);
|
|
}
|
|
}
|
|
//this will draw the nultiple paths at a time on to the map
|
|
vtsMap.prototype.drawMultipleUnitPath = function (pathOptions) {
|
|
for (var i in pathOptions) {
|
|
this.drawUnitPath(pathOptions[i]);
|
|
}
|
|
}
|
|
//------------------------------------------function to add the hower effects on to the line-------------------------------
|
|
//this function will give the over effect on to the patgh of a unit
|
|
vtsMap.prototype.pathOverEffect = function (alias) {
|
|
for (var i in unitPath) {
|
|
if (unitPath[i].alias == alias) {
|
|
unitPath[i].setOptions({
|
|
strokeOpacity: 1.0
|
|
});
|
|
break;
|
|
}
|
|
}
|
|
this.setPathCenter(alias);
|
|
}
|
|
//this function will give the out effect on to the patgh of a unit
|
|
vtsMap.prototype.pathOutEffect = function (alias) {
|
|
for (var i in unitPath) {
|
|
if (unitPath[i].alias == alias) {
|
|
unitPath[i].setOptions({
|
|
strokeOpacity: 0.6
|
|
});
|
|
break;
|
|
}
|
|
}
|
|
this.setPathCenter(alias);
|
|
}
|
|
//------------------------------------------------------end By Sunil Kumar--------------------------------------------------------------------
|
|
//this will get the location name information about the sorcepoint of unit
|
|
vtsMap.prototype.geoCode1 = function (pathPoint, path, pathOptions) {
|
|
var location = null;
|
|
var geocoder = new google.maps.Geocoder();
|
|
geocoder.geocode({
|
|
'latLng': new google.maps.LatLng(pathPoint.latitude, pathPoint.longitude)
|
|
}, function (results, status) {
|
|
if ((status == google.maps.GeocoderStatus.OK) && (!(typeof results[1] === 'undefined'))) {
|
|
//if (!(typeof results[1] === 'undefined')) {
|
|
if (results[1]) {
|
|
location = results[1].formatted_address;
|
|
|
|
var marker = tempmap.sourceInfo(pathPoint, location, pathOptions);
|
|
path.markers.push(marker);
|
|
}
|
|
} else {
|
|
location = "Unknown Location";
|
|
var marker = tempmap.sourceInfo(pathPoint, location, pathOptions);
|
|
path.markers.push(marker);
|
|
}
|
|
});
|
|
}
|
|
//this will get the location name information about the destination point of unit
|
|
vtsMap.prototype.geoCode2 = function (pathPoint, path, pathOptions) {
|
|
var location = null;
|
|
var geocoder = new google.maps.Geocoder();
|
|
geocoder.geocode({
|
|
'latLng': new google.maps.LatLng(pathPoint.latitude, pathPoint.longitude)
|
|
}, function (results, status) {
|
|
if ((status == google.maps.GeocoderStatus.OK) && (!(typeof results[1] === 'undefined'))) {
|
|
if (results[1]) {
|
|
location = results[1].formatted_address;
|
|
|
|
var marker = tempmap.DestinationInfo(pathPoint, location, pathOptions);
|
|
path.markers.push(marker);
|
|
}
|
|
} else {
|
|
location = "Unknown Location";
|
|
var marker = tempmap.DestinationInfo(pathPoint, location, pathOptions);
|
|
path.markers.push(marker);
|
|
}
|
|
});
|
|
}
|
|
//this function will give the inforamtion of the starting point of the unit
|
|
vtsMap.prototype.sourceInfo = function (pathPoint, info, pathOptions) {
|
|
var img = pathOptions.sourceImage;
|
|
var marker = new google.maps.Marker({
|
|
position: new google.maps.LatLng(pathPoint.latitude, pathPoint.longitude),
|
|
icon: img,
|
|
map: vMap.googleMap,
|
|
zIndex: 10
|
|
});
|
|
var content = "";
|
|
var info = new google.maps.InfoWindow(
|
|
{
|
|
content: content
|
|
});
|
|
var infoMap = vMap.googleMap;
|
|
/* google.maps.event.addListener(marker, 'click', function () {
|
|
info.open(infoMap, marker);
|
|
});*/
|
|
marker.info = info
|
|
return marker;
|
|
}
|
|
//this function will give the inforamtion of the destination point of the unit
|
|
vtsMap.prototype.DestinationInfo = function (pathPoint, info, pathOptions) {
|
|
var content = "";
|
|
var img = pathOptions.destinationImage;
|
|
var marker = new google.maps.Marker({
|
|
position: new google.maps.LatLng(pathPoint.latitude, pathPoint.longitude),
|
|
icon: img,
|
|
map: vMap.googleMap,
|
|
zIndex: 10
|
|
});
|
|
var info = new google.maps.InfoWindow(
|
|
{
|
|
content: content
|
|
});
|
|
var infoMap = vMap.googleMap;
|
|
marker.info = info;
|
|
return marker;
|
|
}
|
|
//this function will set the center of the map at the polyline;
|
|
vtsMap.prototype.setPathCenter = function (alias) {
|
|
for (var i in unitPath) {
|
|
if (unitPath[i].alias == alias) {
|
|
this.moveMap(unitPath[i].centerLat, unitPath[i].centerLng);
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
//this function will find the points from the pathOptoins of the unit
|
|
vtsMap.prototype.findPointOnPath = function (pathOptions, path) {
|
|
for (var i = 0; i < pathOptions.points.length; i++) {
|
|
pointsArrayAt5.push(pathOptions.points[i]);
|
|
}
|
|
var tempArray = {
|
|
alias: pathOptions.alias,
|
|
pointDescripton: pointsArrayAt5
|
|
}
|
|
pathDescriptons.push(tempArray);
|
|
this.placeMarkerOnPath(pointsArrayAt5, path, pathOptions.imgCircle);
|
|
}
|
|
/*/function will return the
|
|
vtsMap.prototype.returnPath = function () {
|
|
var temp = [];
|
|
temp = tempArrayinpos;
|
|
tempArrayinpos = [];
|
|
return temp;
|
|
}*/
|
|
//this function will place the points on to the paths at a particular posstion and have the location name information at that point
|
|
vtsMap.prototype.placeMarkerOnPath = function (pathPoints, path, img) {
|
|
for (var i = 0; i <= pathPoints.length - 1; i++) {
|
|
var title = pathPoints[i].recordTime;
|
|
var marker = new google.maps.Marker({
|
|
position: new google.maps.LatLng(pathPoints[i].latitude, pathPoints[i].longitude), //new google.maps.LatLng(24,35),
|
|
icon: img,
|
|
map: vMap.googleMap,
|
|
zIndex: 20,
|
|
title: title
|
|
});
|
|
path.markers.push(marker);
|
|
var info = new google.maps.InfoWindow(
|
|
{
|
|
content: ""
|
|
});
|
|
marker.info = info;
|
|
var infoMap = vMap.googleMap;
|
|
(function (i, marker) {
|
|
google.maps.event.addListener(marker, 'click', function (event) {
|
|
//this.infowork(latlng,info);
|
|
var geocoder = new google.maps.Geocoder();
|
|
geocoder.geocode({ 'latLng': marker.getPosition() }, function (results, status) {
|
|
if (status == google.maps.GeocoderStatus.OK) {
|
|
var location = results[0].formatted_address;
|
|
//console.log(pathPoints[i]);
|
|
var content = tempmap.PathPointInfoContent(location, pathPoints[i].latitude, pathPoints[i].longitude, pathPoints[i].recordTime, pathPoints[i].distance);
|
|
info.setContent(content);
|
|
if (pointInfo != null)
|
|
pointInfo.close();
|
|
pointInfo = info;
|
|
info.open(infoMap, marker);
|
|
}
|
|
else {
|
|
if (pointInfo != null)
|
|
pointInfo.close();
|
|
pointInfo = info;
|
|
info.setContent("Unknown Location");
|
|
info.open(infoMap, marker);
|
|
}
|
|
});
|
|
});
|
|
})(i, marker);
|
|
}
|
|
pointsArrayAt5 = [];
|
|
}
|
|
//function will open the ifowindow of the pathpoints on the given the latlng
|
|
vtsMap.prototype.infoOpen = function (latlng) {
|
|
var infoMap = vMap.googleMap;
|
|
var pos = new google.maps.LatLng(latlng.latitude, latlng.longitude);
|
|
var info = new google.maps.InfoWindow(
|
|
{
|
|
content: "",
|
|
position: pos
|
|
});
|
|
var geocoder = new google.maps.Geocoder();
|
|
geocoder.geocode({ 'latLng': pos }, function (results, status) {
|
|
if (status == google.maps.GeocoderStatus.OK) {
|
|
var location = results[0].formatted_address;
|
|
var content = tempmap.PathPointInfoContent(location, latlng.latitude, latlng.longitude, latlng.recordTime, latlng.distance);
|
|
info.setContent(content);
|
|
if (pointInfo != null)
|
|
pointInfo.close();
|
|
pointInfo = info;
|
|
info.open(infoMap);
|
|
}
|
|
else {
|
|
if (pointInfo != null)
|
|
pointInfo.close();
|
|
pointInfo = info;
|
|
info.setContent("Unknown Locatoin");
|
|
info.open(infoMap, pos);
|
|
}
|
|
});
|
|
}
|
|
//this function will call to play the path that will be used show the history of the path with player of the path
|
|
vtsMap.prototype.playPath = function (pathOption) {
|
|
var counter = 1;
|
|
var sourceMarker = new google.maps.Marker(
|
|
{
|
|
position: new google.maps.LatLng(pathOption.path[0].latitude, pathOption.path[0].longitude), //new google.maps.LatLng(24,35),
|
|
icon: pathOption.sourceImage,
|
|
map: vMap.googleMap,
|
|
title: "title"
|
|
});
|
|
var destinationMarker = new google.maps.Marker(
|
|
{
|
|
position: new google.maps.LatLng(pathOption.path[pathOption.path.length - 1].latitude, pathOption.path[pathOption.path.length - 1].longitude), //new google.maps.LatLng(24,35),
|
|
icon: pathOption.destinationImage,
|
|
map: vMap.googleMap,
|
|
title: "title"
|
|
});
|
|
var marker = new google.maps.Marker(
|
|
{
|
|
position: new google.maps.LatLng(pathOption.path[0].latitude, pathOption.path[0].longitude), //new google.maps.LatLng(24,35),
|
|
icon: pathOption.imgCircle,
|
|
map: vMap.googleMap,
|
|
title: "title"
|
|
});
|
|
var t = setInterval(function () {
|
|
var upath = [marker.getPosition(), new google.maps.LatLng(pathOption.path[counter].latitude, pathOption.path[counter].longitude)];
|
|
var path = new google.maps.Polyline(
|
|
{
|
|
path: upath,
|
|
strokeColor: pathOption.color,
|
|
strokeOpacity: 1.0,
|
|
strokeWeight: 4,
|
|
map: vMap.googleMap
|
|
});
|
|
marker.setPosition(new google.maps.LatLng(pathOption.path[counter].latitude, pathOption.path[counter].longitude));
|
|
path.markers = [];
|
|
path.markers.push(sourceMarker);
|
|
path.markers.push(destinationMarker);
|
|
path.markers.push(marker);
|
|
unitPath.push(path);
|
|
counter++;
|
|
if (counter >= pathOption.path.length) {
|
|
clearInterval(t);
|
|
}
|
|
}, 100);
|
|
}
|
|
//function to get the units with in the range of a unit
|
|
vtsMap.prototype.getUnitsInRange = function (options) {
|
|
if (rangeOfUnits != null)
|
|
rangeOfUnits.setMap(null);
|
|
var info = [];
|
|
for (var i in this.unit) {
|
|
if (this.unit[i].getMap() != null) {
|
|
var path = [{
|
|
latitude: this.unit[i].getPosition().lat(),
|
|
longitude: this.unit[i].getPosition().lng()
|
|
},
|
|
{
|
|
latitude: options.latitude,
|
|
longitude: options.longitude
|
|
}]
|
|
var d = findDistance(path);
|
|
if (d <= options.distance) {
|
|
var temp = { alias: this.unit[i].id, distance: d, name: this.unit[i].unitName };
|
|
info.push(temp);
|
|
}
|
|
}
|
|
}
|
|
var geofenceOptions = { centerLatitude: options.latitude, centerLongitude: options.longitude, radius: options.distance * 1000, color: options.color };
|
|
rangeOfUnits = vMap.createCircularGeoFence(geofenceOptions)
|
|
this.moveMap(options.latitude, options.longitude);
|
|
return info;
|
|
}
|
|
//function to get the latlng of the address
|
|
vtsMap.prototype.getAddressRange = function (distance, address, color, unitInRange) {
|
|
distance = parseInt(distance);
|
|
var geocoder = new google.maps.Geocoder();
|
|
geocoder.geocode({ 'address': address }, function (results, status) {
|
|
if (status == google.maps.GeocoderStatus.OK) {
|
|
var latlng = results[0].geometry.location;
|
|
latlng = { latitude: latlng.lat(), longitude: latlng.lng(), color: color, distance: distance };
|
|
var units = [];
|
|
units = tempmap.getUnitsInRange(latlng);
|
|
unitInRange(units);
|
|
} else {
|
|
alert("Geocode was not successful for the following reason: " + status);
|
|
}
|
|
});
|
|
}
|
|
//function will return all the nerrby units from the given unit
|
|
vtsMap.prototype.getNearByUnits = function (options) {
|
|
for (var i in this.unit) {
|
|
if (this.unit[i].id == options.id && this.unit[i].getMap() != null) {
|
|
var latlng = this.unit[i].getPosition();
|
|
latlng = { latitude: latlng.lat(), longitude: latlng.lng(), color: options.color, distance: options.distance };
|
|
return this.getUnitsInRange(latlng);
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
//this function will hide the circle that covers the nearset units wih in a range
|
|
vtsMap.prototype.hideNearestUnitRange = function () {
|
|
if (rangeOfUnits != null)
|
|
rangeOfUnits.setMap(null);
|
|
}
|
|
//this function will hide the circle that covers the nearset units wih in a range
|
|
vtsMap.prototype.showNearestUnitRange = function () {
|
|
if (rangeOfUnits != null)
|
|
rangeOfUnits.setMap(vMap.googleMap);
|
|
}
|
|
//this function will reset the array that contains all the units that we have added on to the map
|
|
vtsMap.prototype.resetUnitArray = function () {
|
|
this.unit = [];
|
|
}
|
|
//this flag will check that the info window is of open or not this function makes this flag set to false
|
|
vtsMap.prototype.resetInfoCheckFlag = function () {
|
|
for (var i in this.unit) {
|
|
this.unit[i].infoCheck = false;
|
|
this.unit[i].transMarker.infoCheck = false;
|
|
}
|
|
}
|
|
//this is the information window content of the points that will be displayed on to the map
|
|
vtsMap.prototype.PathPointInfoContent = function (location, latitude, longitude, recordTime, distance) {
|
|
var content = '<div class="infoTableContainer">' +
|
|
'<table class="InfoWindowTbl" cellspacing="0" cellpadding="0" width="100%" border="0">' +
|
|
// '<thead>' +
|
|
// '<tr>' +
|
|
// '<th colspan="4">Address</th>' +
|
|
// '</tr>' +
|
|
// '</thead>' +
|
|
'<tbody>' +
|
|
'<tr>' +
|
|
'<td class="rowInfo">Address</td><td colspan="3" class="rowValue">' + location +
|
|
'</tr>' +
|
|
'<tr>' +
|
|
'<td class="rowinfo">latitude</td>' +
|
|
'<td class="rowvalue">' + latitude + '</td>' +
|
|
'<td class="rowinfo">longitude</td>' +
|
|
'<td class="rowvalue">' + longitude + '</td>' +
|
|
'</tr>' +
|
|
'<tr>' +
|
|
'<td class="rowInfo">Time</td>' +
|
|
'<td class="rowValue">' + recordTime + '</td>' +
|
|
'<td class="rowInfo">Distance</td>' +
|
|
'<td class="rowValue">' + distance + '</td>' +
|
|
'</tr>' +
|
|
'</tbody>' +
|
|
'</table>' +
|
|
'</div>';
|
|
return content;
|
|
}
|
|
vtsMap.prototype.showUnit = function (id) {
|
|
for (i in this.unit) {
|
|
if (this.unit[i].id == id) {
|
|
this.unit[i].setMap(vMap.googleMap);
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
/*********************************************This function was added to add for the open geo fence****************************************************************/
|
|
vtsMap.prototype.drawOpenFence = function (pathOptions) {
|
|
this.polygonGeoFence[this.pgn] = vMap.drawOpenFence(pathOptions);
|
|
this.pgn++;
|
|
}
|
|
vtsMap.prototype.drawMultiOpenFence = function (multiPathOptions) {
|
|
for (i in multiPathOptions) {
|
|
this.drawOpenFence(multiPathOptions[i]);
|
|
}
|
|
}
|
|
|
|
/*****************************************************************************************************************************************************************/ |