Skip to content

Instantly share code, notes, and snippets.

@wboykinm
Created May 6, 2014 17:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save wboykinm/a6f93dfea903d62c5c9a to your computer and use it in GitHub Desktop.
Save wboykinm/a6f93dfea903d62c5c9a to your computer and use it in GitHub Desktop.
Passages - Moving a marker along a line
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Northwest-Northeast</title>
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<script src='http://api.tiles.mapbox.com/mapbox.js/v1.5.0/mapbox.js'></script>
<script src='passages.js'></script>
<link href='http://api.tiles.mapbox.com/mapbox.js/v1.5.0/mapbox.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; background-color: #000; }
</style>
</head>
<body>
<div id='map'></div>
<script>
var map = L.mapbox.map('map','landplanner.ln1urf6r', {
maxZoom:7
}).setView([0, 0], 4);
//var polarbase = L.Mapbox.TileLayer('landplanner.antarctic').addTo(map);
var geojsonLayer = L.geoJson(passages),
marker = L.marker([0, 0], {
icon: L.mapbox.marker.icon({'marker-size': 'large', 'marker-symbol': 'ferry', 'marker-color': '0000FF'})
}).addTo(map),
j = 0;
tick();
function tick() {
// set the marker to be at the same point as one of the segments
// of the line
marker.setLatLng(L.latLng(
passages.features[3].geometry.coordinates[j][1],
passages.features[3].geometry.coordinates[j][0]));
// move to the next point in the line or loop to the first point if
// j runs off the end of the array
if (++j < passages.features[3].geometry.coordinates.length) setTimeout(tick, 300);
}
</script>
</body>
</html>
var passages = {
"type": "FeatureCollection",
"crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
"features": [
{ "type": "Feature", "properties": { "Name": "Northwest Passage Route 1" }, "geometry": { "type": "LineString", "coordinates": [ [ -47.81033098180496, -28.342432940899947, 0.0 ], [ -46.931933639740663, -29.473111807838023, 0.0 ], [ -41.661239660469512, -37.866988723543734, 0.0 ], [ -39.382031173177523, -38.118977699513458, -680564733841876926926749214863536422912.0 ], [ -36.274362248200184, -38.665099192641712, 0.0 ], [ -6.017630520282385, -33.426478732907682, 0.0 ], [ 4.313870547689282, -26.444256662809369, 0.0 ], [ 6.087378316976281, -25.193665357496762, 0.0 ], [ 4.327682181803719, -22.022304210373175, 2.0 ], [ 4.719591616366919, -17.746590896967405, 0.0 ], [ 7.566340273129258, -16.188459350999779, 0.0 ], [ 11.920760657952304, -14.927374243512768, 0.0 ], [ 14.69518205914629, -12.058294755578865, 0.0 ], [ 14.532708062467774, -10.786073298637849, 0.0 ], [ 13.384138534185881, -9.462432607715398, 0.0 ], [ 12.582967455212758, -9.001495679208835, 0.0 ], [ 12.896012508734687, -8.154813415316003, 0.0 ], [ 13.538027438296616, -7.392367911693539, 0.0 ], [ 14.346181124932301, -6.79842620471833, 0.0 ], [ 14.897845430819737, -6.121315516128388, 680564733841876926926749214863536422912.0 ], [ 15.412825708960204, -3.189290340405375, 0.0 ], [ 15.436580047515633, -2.545724694948317, 0.0 ], [ 15.679337836562899, -2.376363270222585, 0.0 ], [ 15.624073872497107, -0.541463895183706, 0.0 ], [ 15.758652459358597, 1.879939459684816, -2.0 ], [ 15.655966290788788, 3.423340118348635, 0.0 ], [ 16.704476544934725, 8.559112229335005, 0.0 ], [ 24.092222246195838, 16.919769220744815, 0.0 ], [ 21.139279839126822, 29.931047184444832, 0.0 ], [ 7.550598085081383, 35.870510375533577, 0.0 ], [ 4.92425538896754, 36.623103454960287, 0.0 ], [ 1.933475775073814, 36.542095348790433, 0.0 ], [ -0.608970490934448, 36.203804607964145, 0.0 ], [ -1.470613963418541, 35.190929275707113, 0.0 ], [ -2.601401906559116, 34.950062981217258, 0.0 ] ] } },
{ "type": "Feature", "properties": { "Name": "Northwest Passage Route 2" }, "geometry": { "type": "LineString", "coordinates": [ [ -47.809896776159086, -28.342196547073979, 0.0 ], [ -46.939330472006517, -29.46331739381441, 0.0 ], [ -41.744315793148473, -37.803874354712626, 0.0 ], [ -39.386253834707716, -38.111615211500876, 0.0 ], [ -36.288204326772622, -38.713722252444867, -680647543145812932577697125381984747520.0 ], [ -6.30268406664904, -33.262875736930688, 0.0 ], [ 4.297677395083388, -26.464685505326663, 0.0 ], [ 6.076852771596028, -25.186890469411836, 0.0 ], [ 4.325516871504843, -22.022688740695713, 0.0 ], [ 4.703945080301946, -17.729945749193526, 2.000243354672431 ], [ 7.579971540679533, -16.182416103881444, 0.0 ], [ 11.905707659961063, -14.930034572473426, 0.0 ], [ 14.695958475559799, -12.057376226029165, 0.0 ], [ 16.617112809402563, -9.675456631230215, 0.0 ], [ 15.304135845918685, -8.409523896761662, 0.0 ], [ 15.2118308764072, -8.020693335588341, 0.0 ], [ 15.111235991337836, -7.834417336239393, 0.0 ], [ 15.073846774714355, -7.395913180185822, 0.0 ], [ 15.015014085089664, -6.890630671201781, 0.0 ], [ 14.892837284125561, -6.117605380480313, 0.0 ], [ 15.429955992535014, -2.549693412251159, 680647543145813234809152029039278424064.0 ], [ 15.679489730881832, -2.375361998291863, 0.0 ], [ 15.624518387520322, -0.528482249936519, 0.0 ], [ 15.655747329300018, 3.42433896005606, 0.0 ], [ 16.694399882497553, 8.563330910194384, 0.0 ], [ 24.081581749971463, 16.899194833158166, -2.000243354672432 ], [ 21.088758013978484, 29.933543643510635, 0.0 ], [ 7.584594810544219, 35.821331692983591, 0.0 ], [ 4.889957260083766, 36.583286492413016, 0.0 ], [ -0.617669769558706, 36.203693890474362, 0.0 ], [ -1.457134303631237, 35.186099414418926, 0.0 ], [ -2.630151189859228, 34.939211202573929, 0.0 ] ] } },
{ "type": "Feature", "properties": { "Name": "Northwest Passage Route 3" }, "geometry": { "type": "LineString", "coordinates": [ [ -47.808262518318678, -28.340260946291178, -191561944035483800000753259452074617401837526655696896.0 ], [ -46.934892588488829, -29.469194483619109, 0.0 ], [ -41.724744403175258, -37.881858817393649, 0.0 ], [ -39.241332872012968, -38.311860525553236, 0.0 ], [ -36.299706531778654, -38.6684255310197, 0.0 ], [ -6.30409279509145, -33.43465945621648, 0.0 ], [ 4.270699169650119, -26.495694677658577, 0.0 ], [ 6.108483514129679, -25.153187752371299, 0.0 ], [ 4.326663675246734, -22.006523286238927, 0.0 ], [ 4.713191208384776, -17.734493921992293, 0.0 ], [ 7.592549362249986, -16.176828012169871, 0.0 ], [ 11.907062179467951, -14.920188654484905, 0.0 ], [ 14.709924125737539, -12.040833359288255, 0.0 ], [ 17.599842454751283, -9.755481185816423, 0.0 ], [ 18.588168760376391, -9.188407434201309, 0.0 ], [ 19.038993731073425, -8.522356810127906, 0.0 ], [ 19.36946073390661, -8.545881694939469, 0.0 ], [ 19.626181326572119, -8.480848421170579, 0.0 ], [ 19.863252816194699, -8.493178125314417, 0.0 ], [ 20.008581938271309, -8.264264341569497, 0.0 ], [ 20.040797338312171, -7.986631573312727, -44601491061675263982570001563284651538120704.0 ], [ 20.089017160739825, -7.833653458367216, 0.0 ], [ 20.284032675568724, -7.325934219743435, -10384593871812164779419545448218624.0 ], [ 20.161100945675116, -6.763046907606348, 0.0 ], [ 20.136598989178783, -6.263148920199871, 0.0 ], [ 20.032369815514404, -5.926257755556982, 0.0 ], [ 20.188769410207968, -5.686830000996022, 0.0 ], [ 20.429837884889434, -5.510802440839157, 0.0 ], [ 20.758883904262504, -4.74645358077013, 0.0 ], [ 20.642176246338845, -4.44036899166701, 0.0 ], [ 20.572954224338371, -4.335045357883771, 0.0 ], [ 20.461571473754439, -4.008017877157696, 0.0 ], [ 18.905994126334853, -2.627149919818577, 0.0 ], [ 18.355535037623376, -2.40748889442048, 0.0 ], [ 18.249388678245509, -2.024578389109415, 0.0 ], [ 17.527800795938731, -1.815441782723288, 0.0 ], [ 16.993641364679505, -1.858948079160965, 0.0 ], [ 16.361158667675724, -1.796130019271152, 0.0 ], [ 15.682955837239962, -1.703449633385679, 0.0 ], [ 15.62491913546944, -0.51649882367719, 0.0 ], [ 15.655747329300018, 3.42433896005606, 0.0 ], [ 16.687802437252387, 8.575989807095411, 0.0 ], [ 24.156805238512916, 16.972710864504574, 0.0 ], [ 21.034821243116461, 29.991767979896412, 0.0 ], [ 7.643510217129824, 35.811860558602994, 0.0 ], [ 4.923457750478144, 36.601555322261817, 0.0 ], [ -0.621397052853225, 36.203645971838711, 0.0 ], [ -1.449918603576654, 35.186327192891397, 0.0 ], [ -2.604964236878397, 34.947886517166211, 0.0 ] ] } },
{ "type": "Feature", "properties": { "Name": "Northeast Passage" }, "geometry": { "type": "LineString", "coordinates": [ [ -47.834656724770618, -28.340216244005266, 0.0 ], [ -46.945492349255929, -29.455153599360894, 0.0 ], [ -43.160459807054679, -36.000433806330314, 0.0 ], [ -41.814100848367545, -37.856442079704969, 2.000243354672431 ], [ -36.372585496105842, -38.709295320379205, 0.0 ], [ -6.272623747641203, -33.486530710195616, 0.0 ], [ 4.231334505973182, -26.528396035054644, 0.0 ], [ 3.335566345458766, -24.941523679079307, 0.0 ], [ 4.479238558143793, -22.576019360495586, 0.0 ], [ 3.019957491667905, -21.717417079612936, 0.0 ], [ 0.457888024661406, -20.265335200925321, 0.0 ], [ -2.00116031150515, -19.297812750981471, 0.0 ], [ -4.772938510898255, -18.471016797306021, 0.0 ], [ -6.051125977619898, -17.139602813346372, 0.0 ], [ -9.61710349859413, -13.962108984292591, 680647543145813234809152029039278424064.0 ], [ -11.69375372110791, -11.891902843736757, 0.0 ], [ -12.93770909569707, -8.721304323822459, 0.0 ], [ -12.257800634992117, -5.921732720465294, 0.0 ], [ -11.693280337035519, -4.116414150976304, 0.0 ], [ -11.660081261964075, -3.022475822330536, -2.000243354672432 ], [ -11.845084445324806, -2.382218305754491, 0.0 ], [ -12.368797767323754, -1.881287163748476, 0.0 ], [ -12.87838313135366, -0.978062527814969, 0.0 ], [ -13.940150668690364, -0.115832118164337, 0.0 ], [ -14.55364367016807, 1.13147176914912, 0.0 ], [ -15.813413292302048, 2.74699919259205, 0.0 ], [ -15.591201087515373, 4.289205373082626, -0.000000953681569 ], [ -15.236957312457829, 6.35768022293393, 0.0 ], [ -16.376962234546269, 8.408231647848787, 0.0 ], [ -16.577802449526825, 9.824586690866466, 0.0 ], [ -16.528165675734268, 10.394066452489854, 0.0 ], [ -15.105015175731449, 12.902396334796695, 0.0 ], [ -12.738146635638833, 15.176013581175933, 0.0 ], [ -7.916968343269178, 16.202505252069255, 0.0 ], [ -5.269277987543994, 18.935497141854722, 0.0 ], [ -3.682381506235665, 22.335158812964647, 0.0 ], [ -1.636856693152089, 26.452440348395417, 0.0 ], [ -2.300534114880759, 33.675406024572744, 2.000243354768507 ], [ -2.608381142241824, 34.929946415316252, 0.0 ] ] } }
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment