Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Map-demo #49

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Map-demo #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
d44ae83
api key + airport information
kranthitatoju Aug 10, 2017
150bd51
removing the maker
kranthitatoju Aug 10, 2017
5e4c8ca
sorting the dropdown
kranthitatoju Aug 10, 2017
e516ae3
center map to marker
kranthitatoju Aug 10, 2017
fac519e
imporovments to display
kranthitatoju Aug 10, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 18 additions & 5 deletions Map.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
#airport-settings {
width: calc(100% - 8px);
width: 650px;
border: 2px solid black;
height: 128px;
height: 150px;
padding: 4px;
margin: 10px 14px 10px 0px;
}
Expand All @@ -24,12 +24,12 @@
}

#airport-map{
width: 800px;
height: 600px;
width: 600px;
height:400px;
}

#airport-data {
margin: 12px;
margin: 14px;
}

#exercise-toggle {
Expand All @@ -41,4 +41,17 @@
vertical-align: text-bottom;
font-size: 32px;
font-weight: bold;
}

#full_width_div {
width:100%;
}
.left_part {
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.right_part {
float:right;
white-space:nowrap;
}
29 changes: 17 additions & 12 deletions Map.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,15 @@
<title>Map Sample</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE&callback=initMap"></script>
<!-- updated google maps api key -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDXfPUcfHuYwkHCE_gj070GNxAvl1wGrZ4&callback=initMap"></script>
<script src="siteData.js"></script>
<script src="Map.js"></script>
<link href="Map.css" rel="stylesheet">
<link rel="stylesheet" href="https://bootswatch.com/4-alpha/superhero/bootstrap.min.css">
</head>
<body>
<h1>LLamasoft Map Exercise
</h1>
<h1 class="jumbotron">LLamasoft Map Exercise</h1>

<div id="exercise-description">
<div id="instruction-toggle"><span>Instructions</span> <span id="exercise-toggle">-</span></div>
Expand Down Expand Up @@ -58,17 +59,15 @@ <h1>LLamasoft Map Exercise
</p>
</div>
</div>

<div id="airport-map">
</div>

<div id="airport-data">
<!-- added some css to make the map and list look much more easy for user -->
<div id="full_width_div">
<div class="right_part">
<div id="airport-data" >
<div id="airport-controls">
Airports: <select id="airport-list">
</select>
</div>

<div id="airport-settings">
</div>
<div id="airport-settings" class="card-block">
<div id="setting-name">
<div>Code</div>
<div>City</div>
Expand All @@ -81,11 +80,17 @@ <h1>LLamasoft Map Exercise
<div id="setting-code"></div>
<div id="setting-city"></div>
<div id="setting-state"></div>
<div id="setting-name"></div>
<div id="setting-fsname"></div>
<div id="setting-lat"></div>
<div id="setting-long"></div>
</div>
</div>
</div>
</div>
<div class="left_part">
<div id="airport-map">
</div>
</div>
</div>
</body>
</html>
22 changes: 22 additions & 0 deletions Map.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,11 @@ var MapFcns = {
for (var i in sites) {
var newOption = $('<option value="' + sites[i].Code + '">' + sites[i].Code + '</option>');
airportList.append(newOption);
// sorting the ariport codes in ascending order
$("#airport-list").append($("#airport-list option").remove().sort(function(param1,param2) {
var code1 = $(param1).text(), code2 = $(param2).text();
return (code1 < code2)?1:((code1 > code2)?-1:0);
}));
}
},

Expand All @@ -20,12 +25,29 @@ var MapFcns = {
var currAirport = _.findWhere(sites, {Code: airportCode});
$('#setting-code').text(currAirport.Code);
$('#setting-city').text(currAirport.City);
$('#setting-state').text(currAirport.State);
$('#setting-fsname').text(currAirport.FullSiteName);
$('#setting-lat').text(currAirport.Latitude);
$('#setting-long').text(currAirport.Longitude);
// added extra code to display complete airport information

var marker = new google.maps.Marker({
position: {lat: currAirport.Latitude, lng: currAirport.Longitude},
map: globalMap,
title: currAirport.Code
});




// adding code to listen the clicks on marker and make them null ( remove my the user click)
google.maps.event.addListener(marker,"click", function() {
marker.setMap(null);
});

// centering the map view to the most recent selected airport heping user to find the airport easily
globalMap.setCenter(marker.position);

}
}
}
Expand Down