CINXE.COM
Strava Labs
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no"> <title>Strava Labs</title> <link rel='icon' type='image/png' href="/favicon-32x32.png" sizes='32x32'> <link rel='icon' type='image/png' href="/favicon-96x96.png" sizes='96x96'> <link rel='icon' type='image/png' href="/favicon-16x16.png" sizes='16x16'> <meta property="og:title" content="Strava Labs" /> <meta property="og:site_name" content="Strava Labs" /> <meta property="og:url" content="http://labs.strava.com" /> <meta property="og:description" content="Exploring how Strava data can be used to build interesting things." /> <meta property="og:image" content="http://labs.strava.com/assets/img/fb/heatmap.png" /> <script type='text/javascript' src='/assets/0ebe5520486e4b85e57ee9c72a5ad8bd.js'></script> <link rel='stylesheet' type='text/css' href='/assets/02bfec0208aa219a1deeed56a382f098.css' /> <script type='text/javascript' src='/assets/ba83958dcd954e1d9c2e15fac2e3a2f6.js'></script> <link rel='stylesheet' type='text/css' href='/assets/07558177ddbc9611c3d9c8d2dfb7755f.css' /> <script type='text/javascript' src='/assets/11d9e6a1775c20f82c03a9a00bce40ad.js'></script> <!-- Cookie Policy Banner --> <script src='https://www.strava.com/cookie-banner.js' type='text/javascript'></script> <script type='text/javascript'> jQuery(document).ready(function () { typeof StravaCookieBanner !== 'undefined' && StravaCookieBanner.render() }); </script> </head> <body> <div style="border-bottom: 1px solid #EEE" id="header"> <div class="container"> <nav id="strava-nav" class="navbar navbar-default navbar-static-top"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a href="/" class="navbar-brand"> <img src="/assets/img/strava-labs-logo@2x.svg" alt="Strava Labs" /> </a> <div class="navbar-header pull-right collapsed-sharing"> <ul class="nav navbar-nav navbar-right" style="margin: 0; margin-right: 10px"> </ul> </div> </div> <div class="collapse navbar-collapse" id="navbar-collapse" style="border-top: 0px"> <ul class="nav navbar-nav navbar-left" style="margin-left: 15px"> <li ><a href="/projects">Projects</a></li> <li ><a href="https://medium.com/strava-engineering">Blog</a></li> <li ><a href="https://developers.strava.com">Developers</a></li> <li ><a href="https://www.strava.com/?utm_source=labs">Strava.com</a></li> <li ><a href="https://www.strava.com/careers">Careers</a></li> </ul> <ul class="nav navbar-nav navbar-right collapse-sharing" style="margin-right: 0"> </ul> </div> </nav> </div> </div> <div id="map" class="home-map" style="height: 55px; cursor: default; background: linear-gradient(rgba(200, 200, 200, 0.2), white 20%);"></div> <div class="container" style="margin-top: 40px"> <div class="row"> <div class="col-md-4 col-sm-6 col-xs-12"> <h1>Engineering with a Global Dataset</h1> </div> <div class="col-md-7 col-sm-12 col-xs-12"> <div style="font-size: 18px; font-weight: 300"> The <a href="http://www.strava.com" style="color: #FC4C02">Strava</a> dataset is growing by millions of activities a day and comprises trillions of GPS data points. </div> <div style="line-height: 25px; font-weight: 300; padding-top: 15px;"> Strava Labs showcases interesting side projects enabled by this dataset. These projects are independent of Strava and may be added, removed or break at any time. </div> </div> </div> </div> <div class="container" style="margin-top: 50px"> <div class="row"> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="/projects/" class="labs-section"> <img src="assets/img/icon_projects.png" alt="Projects" /> <h3>Projects</h3> <span>Interactive and experimental software the team is building.</span> </a> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="https://medium.com/strava-engineering" class="labs-section"> <img src="assets/img/icon_tech-writing.png" alt="Blog" /> <h3>Blog</h3> <span>Read about our technology, culture and latest projects.</span> </a> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="https://developers.strava.com" class="labs-section"> <img src="assets/img/icon_developers.png" alt="API" /> <h3>Developers</h3> <span>A comprehensive portal for information about the Strava API.</span> </a> </div> </div> </div> <br /> <div class="container" style="margin-top: 0"> <h3>Featured Projects and Articles</h3> <div class="row" style="margin-top: 30px"> <div class="col-md-6 col-sm-6 col-xs-12"> <a href="https://www.strava.com/maps/global-heatmap" class="project project-top"> <img src="/assets/img/tile-global-heat.jpg" class="project-image" alt="Global Heatmap" /> <div class="info"> <div class="tag">Projects</div> <div class="title">Global Heatmap</div> <div class="description">Over 1 billion activities, 13 trillion data points create the ultimate map of athlete playgrounds.</div> </div> </a> </div> <div class="col-md-6 col-sm-6 col-xs-12"> <a href="/roster" class="project project-top"> <img src="/assets/img/roster.jpg" class="project-image" alt="The Roster" /> <div class="info"> <div class="tag">Projects</div> <div class="title">The Roster</div> <div class="description">Visually analyze your athletic social habits, total group activities and preferred training partners.</div> </div> </a> </div> </div> <div class="row" style=""> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="/flyby/" class="project"> <img src="/assets/img/tile-flyby.png" class="project-image" alt="Flyby" /> <div class="info"> <div class="tag">Projects</div> <div class="title">Flyby</div> <div class="description">Playback your activity along with those riding near you. Find who you passed or 'flew by' while riding.</div> </div> </a> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="/slide/" class="project"> <img src="/assets/img/tile-slide.png" class="project-image" alt="Slide" /> <div class="info"> <div class="tag">Projects</div> <div class="title">Slide</div> <div class="description">Auto-drawing map geometry from the Strava global dataset.</div> </div> </a> </div> <div class="col-md-4 col-sm-4 col-xs-12"> <a href="/kodos" class="project"> <img src="/assets/img/tile-kodos.png" class="project-image" alt="Project KODOS" /> <div class="info"> <div class="tag">Projects</div> <div class="title">Project KODOS</div> <div class="description">Detailed statistics on your personal <span class="app-icon icon-sm icon-kudo icon-color"></span> data.</div> </div> </a> </div> </div> <div style="float: right; clear: both"> <a href="/projects/"><h4>See all projects »</h4></a> </div> </div> <script> var zoom=2,center={lat:22.26876403907398,lng:1.40625};700>$(window).width()&&(center={lat:43.83452678223682,lng:1.40625},zoom=1);var map=L.map("map",{center:center,zoom:zoom,zoomControl:!1,touchZoom:!1,dragging:!1,scrollWheelZoom:!1,doubleClickZoom:!1,boxZoom:!1,attributionControl:!1}),heatmap=new L.HeatmapLayer; L.tileLayer("https://a.tiles.mapbox.com/v4/strava.n64kkmpg/{z}/{x}/{y}.png?access_token=pk.eyJ1Ijoic3RyYXZhIiwiYSI6IlpoeXU2U0UifQ.c7yhlZevNRFCqHYm6G6Cyg",{attribution:"<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox © OpenStreetMap</a>",opacity:.25}).addTo(map);heatmap.addTo(map);var domain="ws://localhost:8300";"localhost"!=window.location.hostname&&(domain="wss://live-labs.strava.com"); function startWebsocket(){var b=new WebSocket(domain+"/live/upload"),d=new Date;b.onmessage=function(a){$("#whatsthis").show();a=JSON.parse(a.data);var b=(new Date).getTime()-d.getTime();d=new Date;for(var c=0;c<a.length;c++)setTimeout(function(a){return function(){heatmap.addData([{lat:a.latitude,lng:a.longitude,css:"animate-dot orange-dot"}])}}(a[c]),c/a.length*b)};b.onclose=function(a){$("#whatsthis").hide();console.warn("socket closed")}}startWebsocket(); </script> <style> .labs-section { display: block; text-align: center; border: 4px solid #E5E5E5; height: 200px; padding: 20px; margin-bottom: 20px; } .labs-section:hover { background-color: #f5F5F5; } .labs-section a { display: block; text-align: center; margin: auto; } .labs-section h3 { color: #000000; font-size: 26px; font-weight: 300; } .labs-section span { font-size: 14px; font-weight: 300; color: #333; } h3 { font-weight: 300; } .leaflet-container { background-color: #FFF; cursor: default; } .leaflet-layer { opacity: 0.25; } </style> <div id="footer" class="footer"> <div class="container"> <div style="padding: 30px 0px; max-width: 600px"> <b>Strava Labs</b> is where Strava engineering occasionally releases side projects independent of our product and share our processes and stories. Projects may be added, removed or break at any time, so use them at your own risk. <br /><br /> <span style="color: #999"> </span> </div> </div> <div style="background-color: #333; padding: 20px 0"> <div class="container"> <a href="https://www.strava.com?utm_source=labs"> <div class="logo"></div> </a> <div class="item"> © 2018 Strava </div> <div style="display: inline-block"> <div class="item"> <a href="https://strava.com/terms?utm_source=labs">Terms of Service</a> </div> <div class="item"> <a href="https://strava.com/privacy?utm_source=labs">Privacy Policy</a> </div> <div class="item"> <a href="http://twitter.com/StravaEng">@StravaEng</a> </div> </div> <br style="clear: both" /> </div> </div> </div> </body> </html>