CINXE.COM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>GPS Visualizer: Help, Examples, & Tutorials</title> <script type="text/javascript"> MOBILE = false; </script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> <link rel="stylesheet" href="/gpsv.css" type="text/css" /> <script type="text/javascript" src="/gpsv.js"></script> <script type="text/javascript" src="/ads-page-ad.js?adunitid=ad"></script> <script src="https://the.gatekeeperconsent.com/cmp.min.js" data-cfasync="false"></script> <script async src="//www.ezojs.com/ezoic/sa.min.js"></script> <script> ezstandalone = window.ezstandalone || {}; ezstandalone.cmd = ezstandalone.cmd || []; ezstandalone.cmd.push(function(){ ezstandalone.enableConsent(); ezstandalone.define(103,104,105); ezstandalone.enable(); ezstandalone.display(); }); </script> <meta name="ezoic" content="block-npa" /> <script async src="https://www.googletagmanager.com/gtag/js?id=G-ME227XBLB8"></script> <script> /* Google Analytics */ window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-ME227XBLB8'); </script> <link rel="shortcut icon" href="/favicon.png" /> <link rel="icon" sizes="144x144" href="/images/g-144x144.png" /> <meta name="theme-color" content="#0D4E0D" /> <link rel="image_src" href="https://www.gpsvisualizer.com/images/gpsvisualizer_thumbnail3.jpg" /> <meta property="og:image" content="https://www.gpsvisualizer.com/images/gpsvisualizer_thumbnail3.jpg" /> </head> <body style="margin:0px;" > <div class="nonmobile_masthead" style="width:100%; background-color:#0d4e0d; padding:0px; color:#ffffff;"> <table cellspacing="0" cellpadding="0" border="0" style="background-color:#0d4e0d;"> <tr align="left" valign="middle"> <td style="padding-right:10px;"><a href="/"><img src="/images/gpsvisualizer_465x74.png" alt="GPS Visualizer" width="465" height="74" border="0" /></a></td> <td style="padding-right:15px;"> <table cellspacing="0" cellpadding="0" border="0"> <tr valign="top"> <td class="header_link" style="padding-left:9px; padding-right:6px;" nowrap> <p><a href="/map_input" style="text-transform:uppercase">Make a map</a></p> <p>- <a href="/map_input?form=leaflet">Leaflet</a>/<a href="/map_input?form=google">Google</a></p> <p>- <a href="/map_input?form=googleearth">Google Earth</a></p> <p>- <a href="/map_input?form=jpg">JPG</a>/<a href="/map_input?form=png">PNG</a>/<a href="/map_input?form=svg">SVG</a></p> </td> <td class="header_link" style="padding-left:9px; padding-right:6px;" nowrap> <p><a href="/profile_input" style="text-transform:uppercase">Make a profile</a></p> <p><a href="/convert_input" style="text-transform:uppercase">Convert a file</a></p> <p><a href="/draw/">Draw on a map</a></p> <p><a href="/calculators">Calculators</a></p> </td> <td class="header_link" style="padding-left:9px; padding-right:6px;" nowrap> <p><a href="/geocoding.html">Geocode addresses</a></p> <p><a href="/elevation">Look up elevations</a></p> <p><a href="/atlas.html">Atlas: Share a map</a></p> <p><a href="/gpsbabel/">GPSBabel</a></p> </td> <td class="header_link" style="padding-left:9px; padding-right:6px;" nowrap> <p><a href="/examples/">Examples</a></p> <p><a href="/tutorials/">Help/FAQ</a></p> <p><a href="/about.html">About GPSV</a></p> </td> </tr> </table> </td> <td valign="top" align="right" width="24" style="padding-top:8px;"> <a target="_blank" href="https://www.facebook.com/gpsvisualizer" class=""><img src="/images/facebook-48x48.svg" width="24" height="24" border="0" /></a> </td> </tr> </table> </div> <table cellspacing="0" cellpadding="0" border="0"><tr align="left" valign="top"> <td id="sidebar" style="height:100%; padding:8px;"> <div id="sidebar_strip" style="padding:0px; min-width:160px; transition:min-width 0.5s;"> <div id="ezoic-pub-ad-placeholder-103"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0538542711751001" crossorigin="anonymous"></script>  <ins class="adsbygoogle" style="display:inline-block;width:160px;height:600px" data-ad-client="ca-pub-0538542711751001" data-ad-slot="7977873699"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> </td> <td class="nonmobile_body" width="99%"> <div id="header_strip" style="padding:3px; height:90px; max-height:90px; xoverflow:hidden !important; transition:min-height 0.5s; text-align:center;"> <div id="ezoic-pub-ad-placeholder-104"> <table id="ez_donation_strip" style="display:none;"><tr><td height="50" valign="middle" nowrap><a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PN7SLQGN4BYNE&source=url"><img src="/images/paypal-130x50.png" border="0" align="absmiddle" style="margin-right:4px;" /></a> <b>No ads? No problem!</b> You can support GPS Visualizer by <a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PN7SLQGN4BYNE&source=url">making a donation with PayPal</a> instead.</td></tr></table> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0538542711751001" crossorigin="anonymous"></script>  <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-0538542711751001" data-ad-slot="6664792025"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <script type="text/javascript"> function ShrinkHeaderAndSidebar() { if (document.getElementById('sidebar_strip')) { //document.getElementById('sidebar_strip').style.minWidth = '80px'; } if (document.getElementById('header_strip')) { document.getElementById('header_strip').style.height = 'none'; document.getElementById('header_strip').style.minHeight = '0px'; } } function CheckForWaldo() { if (!document.getElementById('waldo_donation_strip')) { return false; } var blocked = false; var parent = document.getElementById('waldo_donation_strip').parentNode; var grandparent = (parent && parent.parentNode) ? parent.parentNode : null; if(!document.getElementById('waldo_donation_strip')) { // it's been eliminated blocked = false; } else if (parent && parent.childElementCount == 1) { // nothing was inserted next to the donation message blocked = true; } if (blocked) { ShrinkHeaderAndSidebar(); if (document.getElementById('waldo_donation_strip')) { document.getElementById('waldo_donation_strip').style.display = 'inline-block'; } } } function DonationBanner() { AdBlockerDetected = (self.NoAdBlocker) ? false : true; if (AdBlockerDetected){ // ad blocker IS in use if (document.getElementById('header_strip')) { var msg = '<table id="donation_strip" cellspacing="0" cellpadding="0" border="0" style="height:100%"><tr><td height="50" valign="middle"><a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PN7SLQGN4BYNE&source=url"><img src="/images/paypal-130x50.png" border="0" align="absmiddle" style="margin-right:4px;"><'+'/a><'+'/td><'+'td><b>No ads? No problem.<'+'/b> You can support GPS Visualizer by <a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PN7SLQGN4BYNE&source=url">making a donation with PayPal<'+'/a> instead.<'+'/td><'+'/tr><'+'/table>'; document.getElementById('header_strip').innerHTML = msg; } // ShrinkHeaderAndSidebar(); } // the following line puts in the donation message even if an ad-blocker wasn't detected, by detecting that the "waldo" tag was NOT replaced with an ad. window.setTimeout("CheckForWaldo()",5000); } window.setTimeout('DonationBanner()',2000); </script> </div> <br> <div class="multi_column"><div style="flex:0.7; margin-right:20px;"> <h1>GPS Visualizer Help</h1> <h4 class="tutorial" style="margin-bottom:0px;"><a href="/about.html">About GPS Visualizer</a></h4> <h4 class="tutorial" style="margin-bottom:0px;"><a href="/faq.html">Frequently Asked Questions</a></h4> <p style="margin-top:0px;">The FAQ contains a lot of useful information about specific map formats, as well as some more general information about GPS Visualizer.</p> <h4 class="tutorial" style="margin-bottom:0px;"><a target="help" href="/help.html">Form input help file</a></h4> <p style="margin-top:0px;">This is the file that comes up when you click the little "help" icons in the map and profile input forms; it contains explanations of (almost) all the possible form input widgets.</p> <h4 class="tutorial" style="margin-bottom:0px;"><a href="/examples/">Examples</a></h4> <p style="margin-top:0px;">This page contains a few examples of the kinds of maps you can make with GPS Visualizer.</p> <h1 style="margin-top:24px">Tutorials</h1> <p>If you have data that came directly from a GPS unit, and you just want to see where you've been, using GPS Visualizer is very easy: you upload the file and you get a map.</p> <p>For some purposes, though — including some that take advantage of GPS Visualizer's most powerful features — the data might need to be organized a little bit before being processed, and that's where these tutorials come in.</p> <ul style="padding-left:1em;"> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="waypoints.html">Building Plain-Text Waypoint Files</a></h3> <p style="margin-top:0px;">No matter what you're trying to do with your data, <b>read this one first!</b> There are a lot of important concepts in this tutorial that will help when you are reading the others.</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="tracks.html">Building Plain-Text Track Files</a></h3> <p style="margin-top:0px;">How to force plain-text data to be interpreted as tracks instead of waypoints; how to include multiple tracks in the same file; how to mix in routes and/or waypoints with track data.</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="track_filters.html">Smoothing & Simplifying Tracks</a></h3> <p style="margin-top:0px;">How to use GPS Visualizer's track-smoothing filters to reduce GPS artifacts and create smaller files.</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="elevation_gain.html">Calculating Elevation Gain</a></h3> <p style="margin-top:0px;">Learn why elevation gain is so difficult to get right, and how GPS Visualizer can help.</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="data.html">Mapping Quantitative Data</a></h3> <p style="margin-top:0px;">Learn how to take advantage of GPS Visualizer's ability to resize and/or colorize points based on any field in your data, and how to make GPS Visualizer perform automatic frequency counts on your location-based data (e.g., ZIP codes).</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="heatmaps.html">Heat Maps</a></h3> <p style="margin-top:0px;">If you have a lot of coordinates that you want to plot en masse, where the individual points aren't important but intensity per unit area is of interest, you can add a "heatmap" as a layer to a GPS Visualizer Leaflet map.</p> </li> <li> <h3 class="tutorial" style="margin-bottom:4px;"><a href="../examples/range_rings.html">Drawing circles/range rings around waypoints</a></h3> <p style="margin-top:0px;">GPS Visualizer can draw circles of a specific radius around your points, allowing for definition of circular ranges or triangulation between points.</p> </li> </ul> </div><div style="flex:0.3; margin-top:16px; padding:8px; border:2px solid #004400; border-radius:8px;"> <h2 style="margin-top:0px;">Leaflet/Google Maps Tricks</h2> <p>HTML Maps created by GPS Visualizer can be customized as much as you want. Not everything is documented in detail, but here are a few example maps that demonstrate some of the possibilities:</p> <ul style="padding-left:1em;"> <li style="padding-bottom:3px;"><a href="../tutorials/profiles_in_maps.html">Elevation profile inside a map</a> - If your trackpoints contain elevation data, you can choose to have a profile displayed right inside the map.</li> <li style="padding-bottom:3px;"><a href="../examples/google_custom_backgrounds.html">Custom map backgrounds</a> - Add to or alter the "map type" menu.</li> <li style="padding-bottom:3px;"><a href="../examples/google_folders.html">Folders in a marker list</a> - Organize your waypoints/markers into "folders" that can be collapsed and/or hidden with a click.</li> <li style="padding-bottom:3px;"><a href="../examples/flora_folders.html">More fun with folders</a> - In this example, the folder names were "synthesized" from existing fields in the input data.</li> <li style="padding-bottom:3px;"><a href="../examples/google_filter_with_text.html">Filter markers with a text pattern</a> - Set up links that cause only certain markers to be shown on the map.</li> <li style="padding-bottom:3px;"><a href="../examples/google_spreadsheet.html">Google Docs/Drive Spreadsheet</a> - Create a map whose markers are loaded on-the-fly from an online spreadsheet.</li> <li style="padding-bottom:3px;"><a href="../examples/google_gpx.html">Dynamically loaded GPX</a> or <a href="../examples/google_kml.html">KML</a> - Put a GPS data file (in GPX or KML format) on your site, and have the map load the tracks and waypoints dynamically.</li> <li style="padding-bottom:3px;"><a href="../tutorials/dynamic_php_map.html">Using PHP & GPX to build maps</a> - Create dynamic maps on your Web site using a single PHP template.</li> <li style="padding-bottom:3px;"><a href="../examples/google_database.html">Database-driven map</a> - Markers are loaded from a MySQL database and updated when the map's viewport is moved.</li> <li style="padding-bottom:3px;"><a href="../examples/google_photo_map.html">Geotagged photos</a> - Make a map of the locations of geotagged photos, including thumbnails.</li> <li style="padding-bottom:3px;"><a href="https://www.gpsvisualizer.com/examples/geolocation.html">Geolocation</a> - Center a map on the viewer's current position.</li> </ul> </div></div>  <br> <hr> <p><a href="./">Return to the GPS Visualizer home page</a></p> <br> <div id="footer" style="width:100%;"> <table width="100%" cellspacing="0" cellpadding="0" border="0" style="border-top:1px solid #006600; padding-top:3px;"><tr valign="top"><td class="footer" align="left"> ©2003-2019 <a href="http://adamschneider.net/">Adam Schneider</a>, <img src="/images/email.svg" align="absmiddle" alt="adam [at] gpsvisualizer [dot] com" style="height:1.2em;" />. </td><td class="footer" align="right"> <a href="/privacy.html">Privacy Policy</a> </td></tr></table> </div> </td> </tr></table> </body> </html>