-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtravels.html
107 lines (86 loc) · 5.88 KB
/
travels.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset= "utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="http://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="Leaflet.vector-markers/dist/Leaflet.vector-markers.css">
<link rel="stylesheet" href="http://cdn.Leafletjs.com/leaflet-0.7.3/leaflet.css" />
<meta name="description" content= "Come learn more about me and the projects I have completed">
<meta name = "keywords" content="Computer Engineer, Tim, Tim Qin, Qin, Programming, Robotics">
<meta name="author" content="Tim Qin">
<title> Travels </title>
<link rel ="stylesheet" type = "text/css" href="main.css">
<link href="http://fonts.googleapis.com/css?family=Libre+Baskerville" rel="stylesheet" type="text/css">
<link rel="icon" href="favicon.ico?" type="image/x-icon">
<link href="http://fonts.googleapis.com/css?family=Titillium+Web" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
</head>
<body id = "second">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-64413529-1', 'auto');
ga('send', 'pageview');
</script>
<div id = "navigation_container">
<div id = "logo"> <a href="index.html"> Tim Qin</a> </div>
<!-- add a hover color change -->
<ul id = "nav_bar">
<li>Projects
<ul id="project"> <!-- drop down menu -->
<a href="https://github.com/tim7398/tim7398.github.io"><li> GitHub </li></a>
<a href="#" ><li> Recent Assignments</li></a>
</ul>
</li>
<li id = "about"> About
<ul id="about_drop">
<a href="WhoAmI.html"><li> Who Am I? </li></a>
<a href="travels.html"><li> Travels </li></a>
</ul>
</li>
<li id = "experience"> Experience
<ul id = "experience_drop">
<a href= "Work_Experience.html"><li> Employment History </li></a>
<a href= "Programming_concepts.html"><li> What Do I Know?</li></a>
</ul>
</li>
<!-- <a href = "contact.html">--><li id = "contact" ><span id ="b"> Contact </span> <span id ="a"> Under Construction</span></li><!--</a>-->
</ul>
</div>
<div id = "main-text-travel">
<h1> <u>Travels</u> </h1>
<div id="map"></div>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="Leaflet.vector-markers/dist/Leaflet.vector-markers.js"></script>
<script>
var map = L.map('map').setView([0, 0], 2);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
detectRetina: true
}).addTo(map);
L.marker([35.6895,139.6917], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#cb4b16'}) }).addTo(map);
L.marker([39.9042,116.4074], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#002b36', iconColor: '#eee8d5'}) }).addTo(map);
L.marker([31.2304,121.4737], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#eee8d5', iconColor: '#002b36'}) }).addTo(map);
L.marker([34.3416,108.9398], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#FF9933', iconColor: 'white'}) }).addTo(map);
L.marker([1.3521,103.8198], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#cb4b16'}) }).addTo(map);
L.marker([36.6485,138.1942], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#002b36', iconColor: '#eee8d5'}) }).addTo(map);
L.marker([35.0116,135.7680], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#eee8d5', iconColor: '#002b36'}) }).addTo(map);
L.marker([-33.8675,151.2070], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#FF9933', iconColor: 'white'}) }).addTo(map);
L.marker([42.3601,-71.0589], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#cb4b16'}) }).addTo(map);
L.marker([40.7128,-74.0059], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#002b36', iconColor: '#eee8d5'}) }).addTo(map);
L.marker([45.2538,-69.4455], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#eee8d5', iconColor: '#002b36'}) }).addTo(map);
L.marker([41.6032,-73.0877], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#FF9933', iconColor: 'white'}) }).addTo(map);
L.marker([39.9526,-75.1652], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#cb4b16'}) }).addTo(map);
L.marker([34.0522,-118.2437], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#002b36', iconColor: '#eee8d5'}) }).addTo(map);
L.marker([28.5383,-81.3792], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#eee8d5', iconColor: '#002b36'}) }).addTo(map);
L.marker([43.6532,-79.3832], {icon: L.VectorMarkers.icon({icon: 'plane', prefix: 'fa', markerColor: '#FF9933', iconColor: 'white'}) }).addTo(map);
</script>
<p> This interactive map shows the places I have traveled to so far. Hopefully I will be adding to this in the future.</p>
</div>
</div>
</body>
</html>