Big Sur Trailmap logo

Big Sur Trailmap Display using Google Maps

To display a user-specified route or location or kml/kmz file
on a webpage with a Big Sur Trailmap background

(see examples at bottom)
(Updated: Aug 17, 2024)

Route Map Display Usage

A webpage displaying a user-specified highlighted route on the Big Sur Trailmap can be created by using the URL generated by the "Create Route Display/Metrics Link" button on the Big Sur Trail Route Metrics webpage, ala the following example (but using your route-specific parameters):

https://bigsurtrailmap.net/cgi-bin/googlemaps_display.cgi?c=1&u=0&r=1&g=0&X=1&viaptsfile=SkinnerRidgeTrail:Wend_TO_VentanaDoubleConeTrail:Send.0000

For info on route URL creation, see:  How to create a URL to display any Big Sur Trailmap route

You can send your route-specific URL as text to someone else, so they can display it in their own browser, or save it (e.g. as a bookmark) for later use yourself.  To re-display the route, either use a bookmarked URL directly or paste/type the URL text into the browser's URL box and hit the "Enter" key or click the "Go" button.  [Also, other parameters can be added to alter, for example, the titles as described under "Embedding a route ..." below.]



Location Map Display Usage

A webpage displaying the Big Sur Trailmap at a user-specified location, with or without a name+icon at its central location, can be created by using a URL ala the following example:

https://bigsurtrailmap.net/cgi-bin/googlemaps_display.cgi?map=36.25183,-121.68988,15&icon=Sykes_Hot_Spring

where "36.25183,-121.68988" should be replaced with your desired lat/lon values for the map center, "12" by your desired map zoom level (higher is more zoomed in), and "Sykes_Hot_Spring" by your center location name with underlines used instead of spaces (valid characters are letters, numbers, hyphen, and underscore) - for no name+icon, omit the "icon=..." parameter.  [Also, other parameters can be added to alter, for example, the titles as described under "Embedding a route ..." below.]



KML/KMZ File Display Usage

A webpage displaying a KML/KMZ file (which must be access-able via the internet) overlaid onto a Big Sur Trailmap background can be created by using a URL ala the following example:

https://bigsurtrailmap.net/cgi-bin/googlemaps_display.cgi?map=36.218,-121.675,14&kml=https://bigsurtrailmap.net/Big_Sur_Trail_Trailwork.kml&kmltitle=Big_Sur_Trail_Trailwork_-_July_2014

where "36.218,-121.675" should be replaced with your desired lat/lon values for the map center, "14" by your desired map zoom level (higher is more zoomed in), "https://bigsurtrailmap.net/Big_Sur_Trail_Trailwork.kml" by your file's URL, and "Big_Sur_Trail_Trailwork_-_July_2014" by your descriptive name with underlines used instead of spaces (valid characters are letters, numbers, hyphen, and underscore) - for no title name, omit the "kmlname" parameter.  [Also, other parameters can be added to alter, for example, the titles as described under "Embedding a route ..." below.]



Embedding a route or location map into another webpage

A route or location display map can be embedded into another webpage (i.e. not displayed in a separate webpage) via an "iframe" by inserting text ala the following html code into a webpage

    <iframe width="450" height="550" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="URL"></iframe>

where URL is a link URL as described in previous sections.  The "width" and "height" parameters set the size of the region reserved in the webpage (obviously they should be large enough that the map and titles do not get cut off!).  The other html parameters ("frameborder, "scrolling", "marginheight", and "marginwidth") allow additional control over the frame's appearance if desired. 

In addition to the required parameters, optional parameters can be added in URL to alter the display for your webpage needs.  These are: 
    Parameter "title" optionally adds a title above the default title   (html markup tags are allowed)
    Parameter "subtitle" optionally adds a subtitle below the default title   (html markup tags are allowed)
    Parameter "titles" controls the internally-specified title lines:   (for a location map display, values 2 and 4 are not used)>    
      setting this parameter to "0" will skip all internally-specified title lines    
      including a "1" adds a social-sharing link (facebook, google+, twitter)    
      including a "2" adds a link to the route creation webpage   (not used for location display)    
      including a "3" adds the default title: route start/finish (for route display) or location (for location display)    
      including a "4" adds a link to the route metrics   (not used for location display)    
      including a "5" adds interactive map usage information    
      including a "7" adds show/hide buttons for the route and trailmap    
      (if parameter "titles" not used, all titles will be displayed) 
      (if parameter "s" is not used, the map size will be 500x500 pixels) 
    Parameter "e" controls the elevation profile - adding e=0 eliminates the elevation profile
      (if parameter "e" is not used, the elevation profile is included) 
    Parameter "b" sets the initial map type: "b=t" for USGS Topo [maxZoom=15], "b=T" for Google terrain [maxZoom=15], "t=R" for Google roadmap [maxZoom=15], "t=S" for satellite [maxZoom=22], "t=q" for USGS quadrangles [maxZoom=16], and "t=s" for shaded USGS quadrangles [maxZoom=15]
      (if parameter "b" is not used, the initial map type is Google terrain) 
    For a route display, parameter "m" adds a marker to map and elevation profile at the specified location (must be along route)
      (latitude,longitude are in degrees, name is limited to spaces and alphanumeric characters)
      (if parameter "p" is not used, no markers are added) 



Examples

Route display inside iframe

Below is a route display example for a 400x400 pixel map with 3 title lines in a 450x640 pixel frame with border.  Note that the optional "m" argument is used to display a marker at a specified location.  It uses the following code:
    <iframe width="450" height="640" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="/cgi-bin/googlemaps_display.cgi?c=1&u=0&r=1&g=0&X=1&viaptsfile=SkinnerRidgeTrail:Wend_TO_VentanaDoubleConeTrail:Send.0000&m=36.36379,-121.74517,Pat Spring Camp&titles=1345"></iframe>




Location display inside iframe

Below is a location display example for a 400x400 pixel map on a USGS quadrangle background with 3 title lines in a 450x480 pixel frame with border.  It use the following code:
    <iframe width="450" height="480" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="/cgi-bin/googlemaps_display.cgi?map=36.25186,-121.68990,15&icon=Sykes_Hot_Spring&b=q&titles=135"></iframe>