Skip to content

Commit f927494

Browse files
committed
🎁 map static
1 parent 97dc242 commit f927494

File tree

5 files changed

+272
-248
lines changed

5 files changed

+272
-248
lines changed

website/static/Destination_map.html

Lines changed: 43 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
<meta name="viewport" content="width=device-width,
2626
initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
2727
<style>
28-
#map_fd0bdbf1afb333463da84d559b0abb49 {
28+
#map_fa0d77d1216fb6dd9f7ecd161bb3ac2a {
2929
position: relative;
3030
width: 100.0%;
3131
height: 100.0%;
@@ -39,16 +39,16 @@
3939
<body>
4040

4141

42-
<div class="folium-map" id="map_fd0bdbf1afb333463da84d559b0abb49" ></div>
42+
<div class="folium-map" id="map_fa0d77d1216fb6dd9f7ecd161bb3ac2a" ></div>
4343

4444
</body>
4545
<script>
4646

4747

48-
var map_fd0bdbf1afb333463da84d559b0abb49 = L.map(
49-
"map_fd0bdbf1afb333463da84d559b0abb49",
48+
var map_fa0d77d1216fb6dd9f7ecd161bb3ac2a = L.map(
49+
"map_fa0d77d1216fb6dd9f7ecd161bb3ac2a",
5050
{
51-
center: [12.822871675091914, 80.04708181176677],
51+
center: [12.822853155000528, 80.04493499441284],
5252
crs: L.CRS.EPSG3857,
5353
zoom: 1,
5454
zoomControl: true,
@@ -60,88 +60,88 @@
6060

6161

6262

63-
var tile_layer_f658a464bdd6c7143bf4a38aeeb2a793 = L.tileLayer(
63+
var tile_layer_bbaa681d2631c352372ca6234014f215 = L.tileLayer(
6464
"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
6565
{"attribution": "Data by \u0026copy; \u003ca target=\"_blank\" href=\"http://openstreetmap.org\"\u003eOpenStreetMap\u003c/a\u003e, under \u003ca target=\"_blank\" href=\"http://www.openstreetmap.org/copyright\"\u003eODbL\u003c/a\u003e.", "detectRetina": false, "maxNativeZoom": 18, "maxZoom": 18, "minZoom": 0, "noWrap": false, "opacity": 1, "subdomains": "abc", "tms": false}
66-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
66+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
6767

6868

69-
var poly_line_8c84ade2b4e939e873dad94f95f1adac = L.polyline(
70-
[[12.8214102, 80.045751], [12.8213786, 80.0472489]],
69+
var poly_line_e8fc42081258f8b34ae80a4f097a53e5 = L.polyline(
70+
[[12.8244532, 80.0442973], [12.8244528, 80.0447245]],
7171
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
72-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
72+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
7373

7474

75-
var poly_line_d47ac8460af74869dc8497e5c367f5ed = L.polyline(
76-
[[12.8213786, 80.0472489], [12.8228015, 80.0472822]],
75+
var poly_line_375420f28ef5ea8189d5e7ef274955a1 = L.polyline(
76+
[[12.8244528, 80.0447245], [12.8244513, 80.044885]],
7777
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
78-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
78+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
7979

8080

81-
var poly_line_57c1aa71e6f17dcaf7dce7fc867c2d4a = L.polyline(
82-
[[12.8228015, 80.0472822], [12.8227911, 80.0476581]],
81+
var poly_line_52545e7383b549963737ddc69103794f = L.polyline(
82+
[[12.8244513, 80.044885], [12.8230452, 80.0448834]],
8383
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
84-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
84+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
8585

8686

87-
var poly_line_1ec4c3508eaa65f48e2a539146a328f4 = L.polyline(
88-
[[12.8227911, 80.0476581], [12.8230919, 80.0476715]],
87+
var poly_line_be5426f74c49df9c7705d6027c282ee1 = L.polyline(
88+
[[12.8230452, 80.0448834], [12.8230206, 80.0449142]],
8989
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
90-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
90+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
9191

9292

93-
var poly_line_3b5ea74e099ac4e3e70be5dcf2f49e72 = L.polyline(
94-
[[12.8230919, 80.0476715], [12.8238739, 80.0476825]],
93+
var poly_line_e307d997afa2100467dc4ae1760ad645 = L.polyline(
94+
[[12.8230206, 80.0449142], [12.8229804, 80.0449379], [12.8229344, 80.044944], [12.8228896, 80.0449316]],
9595
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
96-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
96+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
9797

9898

99-
var poly_line_7212e01f0d4b2cb9a61eba66283cad54 = L.polyline(
100-
[[12.8238739, 80.0476825], [12.8238781, 80.0472996]],
99+
var poly_line_95ead7275b0cd11b8ba1f29b44d8d97a = L.polyline(
100+
[[12.8228896, 80.0449316], [12.8228627, 80.0449127], [12.8228418, 80.044887]],
101101
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
102-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
102+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
103103

104104

105-
var poly_line_cab3f21bcf722db39d28974d8d78fd1c = L.polyline(
106-
[[12.8238781, 80.0472996], [12.8243861, 80.0473068]],
105+
var poly_line_ffabd01d4f19bfefe959e5f4843be976 = L.polyline(
106+
[[12.8228418, 80.044887], [12.8214338, 80.0449034], [12.8214293, 80.0450535]],
107107
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
108-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
108+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
109109

110110

111-
var poly_line_c5ebe3f445f83aea645db41755308973 = L.polyline(
112-
[[12.8243861, 80.0473068], [12.8244174, 80.0461111]],
111+
var poly_line_3e975b5524b0d4efe6635157b6195902 = L.polyline(
112+
[[12.8214293, 80.0450535], [12.8214102, 80.045751]],
113113
{"bubblingMouseEvents": true, "color": "#3388ff", "dashArray": null, "dashOffset": null, "fill": false, "fillColor": "#3388ff", "fillOpacity": 0.2, "fillRule": "evenodd", "lineCap": "round", "lineJoin": "round", "noClip": false, "opacity": 1.0, "smoothFactor": 1.0, "stroke": true, "weight": 3}
114-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
114+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
115115

116116

117-
map_fd0bdbf1afb333463da84d559b0abb49.fitBounds(
118-
[[12.8213786, 80.045751], [12.8244174, 80.0476825]],
117+
map_fa0d77d1216fb6dd9f7ecd161bb3ac2a.fitBounds(
118+
[[12.8214102, 80.0442973], [12.8244532, 80.045751]],
119119
{}
120120
);
121121

122122

123-
var marker_af82e3c2c1e59ea249f0fc3ec64f61aa = L.marker(
124-
[12.821276, 80.046031],
123+
var marker_dd2e6bda0d67ca5b6f0656fa600a13d0 = L.marker(
124+
[12.824629, 80.044287],
125125
{}
126-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
126+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
127127

128128

129-
var icon_57bf2b1301ad4156d3af42945a883aa1 = L.AwesomeMarkers.icon(
129+
var icon_2472e0f23e625a6149e3fe506ca900e2 = L.AwesomeMarkers.icon(
130130
{"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "green", "prefix": "glyphicon"}
131131
);
132-
marker_af82e3c2c1e59ea249f0fc3ec64f61aa.setIcon(icon_57bf2b1301ad4156d3af42945a883aa1);
132+
marker_dd2e6bda0d67ca5b6f0656fa600a13d0.setIcon(icon_2472e0f23e625a6149e3fe506ca900e2);
133133

134134

135-
var marker_d61b5303afacbec17aaaa2dd245a85ca = L.marker(
136-
[12.824645, 80.046566],
135+
var marker_7f4daaa47d48f4721bcc1757ed8b49cd = L.marker(
136+
[12.821276, 80.046031],
137137
{}
138-
).addTo(map_fd0bdbf1afb333463da84d559b0abb49);
138+
).addTo(map_fa0d77d1216fb6dd9f7ecd161bb3ac2a);
139139

140140

141-
var icon_ddb23044216c194c579b3bbaa5a4e265 = L.AwesomeMarkers.icon(
141+
var icon_bb3256320caf5c5ec752c164f6c52028 = L.AwesomeMarkers.icon(
142142
{"extraClasses": "fa-rotate-0", "icon": "info-sign", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
143143
);
144-
marker_d61b5303afacbec17aaaa2dd245a85ca.setIcon(icon_ddb23044216c194c579b3bbaa5a4e265);
144+
marker_7f4daaa47d48f4721bcc1757ed8b49cd.setIcon(icon_bb3256320caf5c5ec752c164f6c52028);
145145

146146
</script>
147147
</html>

website/static/css/main.css

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -264,7 +264,8 @@ hr {
264264
.brightness {
265265
background-color: #ebebeb;
266266
display: inline-block;
267-
267+
padding: 2px;
268+
margin-left: 105px;
268269
}
269270
.brightness img:hover {
270271
opacity: .5;

website/templates/Destination_map.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
</head>
3636
<body>
3737

38-
<div class="folium-map" id="map_f5b2c12ae8546e9968f78a2eea0df94b" ></div>
38+
<div class="folium-map" id="map_f5b2c12ae8546e9968f78a2eea0df94b" ></div>
3939

4040
</body>
4141
<script>

website/templates/distance.html

Lines changed: 123 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -74,98 +74,141 @@
7474
</div>
7575
</div>
7676

77+
7778
<br>
7879
<br>
7980
<br>
8081

81-
<!-- Google maps -->
82-
<!-- <div id="map"></div> -->
83-
<style type="text/css">
84-
html,
85-
body {
86-
height: 85%;
87-
margin: 0;
88-
padding: 0;
89-
}
82+
<div class="wrapper">
83+
<style type="text/css">
84+
p{
85+
padding: 7px;
86+
text-align: justify; }
87+
.left{
88+
width: 25%;
89+
float: left; }
90+
.right{
91+
width: 85%;
92+
height: 450px;
93+
float: right; }
94+
.mid{
95+
width: 45%;
96+
float: center;
97+
}
98+
</style>
99+
</head>
100+
<body>
101+
102+
<style>
103+
h1 {
104+
color:Green;
105+
}
106+
div.scroll {
107+
margin:4px, 4px;
108+
padding:4px;
109+
background-color: green;
110+
width: 500px;
111+
height: 700px;
112+
overflow-x: hidden;
113+
overflow-y: auto;
114+
text-align:justify;
115+
}
116+
</style>
117+
<div class="right">
118+
<p style="line-height: 0px; margin-bottom: 10px; color: black; font-size: 20px;">Determine the path between two SRM buildings.</p>
119+
<iframe src="{{ final_map }}"
120+
frameborder="0"
121+
marginheight="0"
122+
marginwidth="0"
123+
width="100%"
124+
height="100%"
125+
scrolling="auto">
126+
</iframe>
127+
128+
</div>
90129

91-
#map {
92-
height: 85%;
93-
}
94-
</style>
95-
<!-- <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAWi9e52vvKDTlblig-9PTx494bFK5M5pA&callback=initMap">
96-
</script> -->
97-
<br>
98-
<div class="container wb">
99-
<div class="row centered">
100-
<div class="col-lg-8 col-lg-offset-2">
101-
<div class="brightness">
130+
<div style="height:500px;
131+
overflow:auto;
132+
margin-left: 1px;
133+
134+
background-color:#00a2e8; color:white; scrollbar-base-color:rgb(0, 38, 255);
135+
font-family:sans-serif;padding:10px;">
136+
137+
<div class="card-body">
138+
102139

103-
<!-- <a href="https://adityamukherjee42-srmap-app-b4ocxl.streamlitapp.com/" > -->
104-
<img src="static/img/distance.png" width="50" height="50" alt=""></img>
105-
<h4 style="color:red">Pathfinder</h4>
106-
</a>
107-
</div>
108-
109-
<p>Determine the path between two SRM buildings.
110-
</p>
111-
</div>
112-
</div>
140+
<style>
141+
.container1 {
142+
width: 100px;
143+
height: 100px;
144+
145+
display: flex;
146+
justify-content: center;
147+
}
148+
149+
.container1 img {
150+
width: 50px;
151+
height: 50px;
152+
}
153+
154+
</style>
155+
156+
<div class="left" >
157+
<div class="row centered">
158+
<div class="container1">
113159

114-
<!-- <h4>DISTANCE DETERMINER</h4>
115-
<p>
116-
<li> Click "START" to begin. </li>
117-
<li> Click along the path between two locations to determine its distance. Click "CLEAR" to start over.</li>
118-
<li>Click on "DONE" when finished.</li>
119-
120-
121-
122-
</p>
123-
<hr>
124-
<h4> The distance is:</h4>
125-
<p>
126-
<div id="distanceHereDiv">.</div>
127-
</p> -->
128-
</div>
129-
</div>
160+
<div class="brightness" >
161+
162+
<img src="static/img/distance.png" width="50" height="50" alt=""></img>
163+
<h4 style="color:red">Pathfinder</h4>
164+
165+
166+
</div>
167+
<!-- <a href="https://adityamukherjee42-srmap-app-b4ocxl.streamlitapp.com/" > -->
168+
169+
130170
</div>
131-
<form method="POST" action="{{ url_for('dist.distance') }}">
132-
<!-- Buttons -->
133-
<div class="row centered">
134-
<div class="col-sm-offset-4">
135-
<div class="col-sm-2">
136-
<h4>Source</h4>
137-
<select name= source>
138-
{% for landmark in landmarks %}
139-
<option value= "{{landmark}}" selected='selected'>{{landmark}}</option>"
140-
{% endfor %}
141-
</select>
142-
143-
</div>
144-
</div>
145-
<div class="col-sm-2">
146-
<h4>Destination</h4>
147-
<select name= target>
148-
{% for landmark in landmarks %}
149-
<option value= "{{landmark}}" selected='selected'>{{landmark}}</option>"
150-
{% endfor %}
171+
</div>
172+
<form method="POST" action="{{ url_for('dist.distance') }}">
173+
<!-- Buttons -->
174+
<div class="row centered">
175+
<div class="col-sm-2">
176+
<h4 style="font-color:rgb(31, 161, 194) ">Source</h4>
177+
<select style="width:180px;" name= source>
178+
{% for landmark in landmarks %}
179+
<option value= "{{landmark}}" selected='selected'>{{landmark}}</option>"
180+
{% endfor %}
151181
</select>
182+
183+
</div>
184+
</div>
185+
186+
187+
188+
<h4>Destination</h4>
189+
<select style="width:180px;" name= target>
190+
{% for landmark in landmarks %}
191+
<option value= "{{landmark}}" selected='selected'>{{landmark}}</option>"
192+
{% endfor %}
193+
</select>
194+
195+
<div class="col-sm-2">
196+
<br>
197+
<button style="padding: 2px;
198+
margin-left: 55px; width: 50px;" type="submit" value="Submit" >Find Path</button>
199+
<!-- col-lg-3 -->
152200
</div>
153-
<button type="submit" value="Submit" >Find Path</button>
154-
<!-- col-lg-3 -->
155201
</div>
156202
</div>
157-
</form>
158-
159-
<br>
160-
<br>
161-
<iframe src="{{ final_map }}"
162-
frameborder="0"
163-
marginheight="0"
164-
marginwidth="0"
165-
width="100%"
166-
height="100%"
167-
scrolling="auto">
168-
</iframe>
203+
</form>
204+
205+
206+
</div>
207+
208+
209+
210+
<div>
211+
169212

170213
<!-- FOOTER -->
171214
<div id="f">

0 commit comments

Comments
 (0)