CINXE.COM
SimpleMappr
<!DOCTYPE html> <html lang="en" prefix="og: http://ogp.me/ns#"> <head> <meta charset="UTF-8"> <meta name="description" content="Create free point maps for publications and presentations" /> <meta name="keywords" content="publication,presentation,map,georeference" /> <meta name="author" content="David P. Shorthouse" /> <meta name="twitter:card" content="summary" /> <meta name="twitter:site" content="@SimpleMappr" /> <meta name="twitter:description" content="Create free point maps for publications and presentations" /> <meta name="twitter:creator" content="@dpsSpiders" /> <meta name="twitter:image" content="https://www.simplemappr.net/public/images/logo_og.png" /> <meta property="og:title" content="SimpleMappr" /> <meta property="og:description" content="Create free point maps for publications and presentations" /> <meta property="og:locale" content="en_US" /> <meta property="og:type" content="website" /> <meta property="og:url" content="https://www.simplemappr.net" /> <meta property="og:image" content="https://www.simplemappr.net/public/images/logo_og.png" /> <title>SimpleMappr</title> <link type="text/css" href="/public/stylesheets/cache/956da5aa.css" rel="stylesheet" media="screen,print" /> <link rel="alternate" href="/?locale=en_US" hreflang="en-us" /> <link rel="alternate" href="/?locale=fr_FR" hreflang="fr-fr" /> </head> <body> <div itemscope itemtype="http://schema.org/WebApplication" id="header" class="clearfix"> <h1 id="site-title" itemprop="name">SimpleMapp<span>r</span></h1> <div id="site-tagline" itemprop="description">create free point maps for publications and presentations</div> <meta itemprop="url" content="https://www.simplemappr.net" /> <meta itemprop="image" content="https://www.simplemappr.net/public/images/logo_og.png" /> <meta itemprop="operatingSystem" content="all" /> <meta itemprop="applicationCategory" content="education" /> <div id="map-loader"><span class="mapper-loading-spinner"></span></div> <div id="site-languages"> <ul> <li><a href="/?locale=en_US#tabs=0" class=selected>English</a></li> <li><a href="/?locale=fr_FR#tabs=0">Fran莽ais</a></li> </ul> </div> <div id="site-session"> <a class="sprites-before login" href="#">Sign In</a> </div> </div> <div id="wrapper"> <noscript> <div id="noscript">Sorry, you must enable JavaScript to use this site.</div> </noscript> <div id="tabs"> <ul class="navigation"> <li><a href="#map-preview">Preview</a></li> <li><a href="#map-points">Point Data</a></li> <li><a href="#map-wkt">Drawings</a></li> <li><a href="#map-regions">Regions</a></li> <li><a href="#map-mymaps" class="sprites-before map-mymaps"> My Maps </a></li> <li class="map-extras"><a href="help?locale=en_US" class="sprites-before map-myhelp">Help</a></li> <li class="map-extras"><a href="about?locale=en_US">About</a></li> <li class="map-extras"><a href="feedback?locale=en_US">Feedback</a></li> <li class="map-extras"><a href="apidoc?locale=en_US">API</a></li> </ul> <form id="form-mapper" accept-charset="UTF-8" action="application/" method="post" autocomplete="off"> <div id="map-points"> <div id="general-points" class="panel"> <p>Type geographic coordinates on separate lines in decimal degrees (DD) or DD掳MM'SS" as latitude,longitude separated by a space (DD only), comma, or semicolon <a href="#" class="sprites-before help show-examples">examples</a></p> </div> <div id="upload-panel" class="panel"><h3>Upload text or csv file</h3><p><input type="file" id="fileInput" /><a href="public/files/demo.txt">Example 1</a>, <a href="public/files/demo2.csv">Example 2</a></p></div> <div id="fieldSetsPoints" class="fieldSets"> <div class="form-item fieldset-points"> <button class="sprites-before removemore negative" data-type="coords">Remove</button> <h3><a href="#">Layer 1</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="coords[0][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="coords[0][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Shape</span> <select class="m-mapShape" name="coords[0][shape]"><option value="">--select--</option> <option value="plus">plus</option> <option value="cross">cross</option> <option value="asterisk">asterisk</option> <optgroup label='solid'> <option value="circle" selected = "selected">circle (s)</option> <option value="star">star (s)</option> <option value="square">square (s)</option> <option value="triangle">triangle (s)</option> <option value="hexagon">hexagon (s)</option> <option value="inversetriangle">inverse triangle (s)</option> </optgroup> <optgroup label='open'> <option value="opencircle">circle (o)</option> <option value="openstar">star (o)</option> <option value="opensquare">square (o)</option> <option value="opentriangle">triangle (o)</option> <option value="openhexagon">hexagon (o)</option> <option value="inverseopentriangle">inverse triangle (o)</option> </optgroup> </select> <span class="fieldset-title">Size</span> <select class="m-mapSize" name="coords[0][size]"><option value="">--select--</option> <option value="6">6pt</option> <option value="8">8pt</option> <option value="10" selected = "selected">10pt</option> <option value="12">12pt</option> <option value="14">14pt</option> <option value="16">16pt</option> </select> <span class="fieldset-title">Color</span> <input class="colorPicker" type="text" size="12" maxlength="11" name="coords[0][color]" value="0 0 0" /> <span class="fieldset-title">Shadow</span> <input class="m-mapShadow" type="checkbox" name="coords[0][shadow]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-points"> <button class="sprites-before removemore negative" data-type="coords">Remove</button> <h3><a href="#">Layer 2</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="coords[1][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="coords[1][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Shape</span> <select class="m-mapShape" name="coords[1][shape]"><option value="">--select--</option> <option value="plus">plus</option> <option value="cross">cross</option> <option value="asterisk">asterisk</option> <optgroup label='solid'> <option value="circle" selected = "selected">circle (s)</option> <option value="star">star (s)</option> <option value="square">square (s)</option> <option value="triangle">triangle (s)</option> <option value="hexagon">hexagon (s)</option> <option value="inversetriangle">inverse triangle (s)</option> </optgroup> <optgroup label='open'> <option value="opencircle">circle (o)</option> <option value="openstar">star (o)</option> <option value="opensquare">square (o)</option> <option value="opentriangle">triangle (o)</option> <option value="openhexagon">hexagon (o)</option> <option value="inverseopentriangle">inverse triangle (o)</option> </optgroup> </select> <span class="fieldset-title">Size</span> <select class="m-mapSize" name="coords[1][size]"><option value="">--select--</option> <option value="6">6pt</option> <option value="8">8pt</option> <option value="10" selected = "selected">10pt</option> <option value="12">12pt</option> <option value="14">14pt</option> <option value="16">16pt</option> </select> <span class="fieldset-title">Color</span> <input class="colorPicker" type="text" size="12" maxlength="11" name="coords[1][color]" value="0 0 0" /> <span class="fieldset-title">Shadow</span> <input class="m-mapShadow" type="checkbox" name="coords[1][shadow]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-points"> <button class="sprites-before removemore negative" data-type="coords">Remove</button> <h3><a href="#">Layer 3</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="coords[2][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="coords[2][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Shape</span> <select class="m-mapShape" name="coords[2][shape]"><option value="">--select--</option> <option value="plus">plus</option> <option value="cross">cross</option> <option value="asterisk">asterisk</option> <optgroup label='solid'> <option value="circle" selected = "selected">circle (s)</option> <option value="star">star (s)</option> <option value="square">square (s)</option> <option value="triangle">triangle (s)</option> <option value="hexagon">hexagon (s)</option> <option value="inversetriangle">inverse triangle (s)</option> </optgroup> <optgroup label='open'> <option value="opencircle">circle (o)</option> <option value="openstar">star (o)</option> <option value="opensquare">square (o)</option> <option value="opentriangle">triangle (o)</option> <option value="openhexagon">hexagon (o)</option> <option value="inverseopentriangle">inverse triangle (o)</option> </optgroup> </select> <span class="fieldset-title">Size</span> <select class="m-mapSize" name="coords[2][size]"><option value="">--select--</option> <option value="6">6pt</option> <option value="8">8pt</option> <option value="10" selected = "selected">10pt</option> <option value="12">12pt</option> <option value="14">14pt</option> <option value="16">16pt</option> </select> <span class="fieldset-title">Color</span> <input class="colorPicker" type="text" size="12" maxlength="11" name="coords[2][color]" value="0 0 0" /> <span class="fieldset-title">Shadow</span> <input class="m-mapShadow" type="checkbox" name="coords[2][shadow]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> </div> <div class="addFieldset"><button class="sprites-before addmore positive" data-type="coords">Add a layer</button></div> <div class="submit"><button class="sprites-before submitForm positive">Preview</button><button id="clearLayers" class="sprites-before clear negative">Clear all</button></div> </div> <div id="map-wkt"> <div id="wkt-introduction" class="panel"> <p>Type Well-Known Text (WKT). Try this <a href="https://rawgit.com/dshorthouse/0afc690b83ed056f6762a96702c041e7/raw/190037de4152654a2e4b1e13394b40ba67249fd4/wkt.html" target="_blank">WKT</a> generator. <em>e.g.</em>POLYGON((-70 63,-70 48,-106 48,-106 63,-70 63))</p> </div> <div id="fieldSetsWKT" class="fieldSets"> <div class="form-item fieldset-wkt"> <button class="sprites-before removemore negative" data-type="wkt">Remove</button> <h3><a href="#">Drawing 1</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="wkt[0][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="wkt[0][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="wkt[0][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="wkt[0][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="wkt[0][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-wkt"> <button class="sprites-before removemore negative" data-type="wkt">Remove</button> <h3><a href="#">Drawing 2</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="wkt[1][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="wkt[1][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="wkt[1][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="wkt[1][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="wkt[1][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-wkt"> <button class="sprites-before removemore negative" data-type="wkt">Remove</button> <h3><a href="#">Drawing 3</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="wkt[2][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="wkt[2][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="wkt[2][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="wkt[2][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="wkt[2][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> </div> <div class="addFieldset"><button class="sprites-before addmore positive" data-type="wkt">Add a drawing</button></div> <div class="submit"><button class="sprites-before submitForm positive">Preview</button><button id="clearWKT" class="sprites-before clear negative">Clear all</button></div> </div> <div id="map-regions"> <div id="regions-introduction" class="panel"> <p>Type countries as Mexico, Venezuela AND/OR bracket pipe- or space-separated State/Province codes prefixed by 3-letter ISO country code <em>e.g.</em>USA[VA], CAN[AB ON]. <a href="#" data-tab="5" class="sprites-before help show-codes">codes</a></p> </div> <div id="fieldSetsRegions" class="fieldSets"> <div class="form-item fieldset-regions"> <button class="sprites-before removemore negative" data-type="regions">Remove</button> <h3><a href="#">Region 1</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="regions[0][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="regions[0][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="regions[0][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="regions[0][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="regions[0][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-regions"> <button class="sprites-before removemore negative" data-type="regions">Remove</button> <h3><a href="#">Region 2</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="regions[1][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="regions[1][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="regions[1][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="regions[1][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="regions[1][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> <div class="form-item fieldset-regions"> <button class="sprites-before removemore negative" data-type="regions">Remove</button> <h3><a href="#">Region 3</a></h3> <div> <div class="fieldset-taxon"> <span class="fieldset-title">Legend<span class="required">*</span>:</span> <input type="text" class="m-mapTitle" size="60" maxlength="60" name="regions[2][title]" /> </div> <div class="resizable-textarea"> <span><textarea class="resizable m-mapCoord" rows="5" cols="60" name="regions[2][data]"></textarea></span> </div> <div class="fieldset-extras"> <span class="fieldset-title">Color:</span> <input type="text" class="colorPicker" size="12" maxlength="11" name="regions[2][color]" value="150 150 150" /> <span class="fieldset-title">Border</span> <input class="m-mapBorder" type="checkbox" name="regions[2][border]" checked /> <span class="fieldset-title">Hatched</span> <input class="m-mapHatch" type="checkbox" name="regions[2][hatch]" /> </div> <button class="sprites-before clear clearself negative">Clear</button> </div> </div> </div> <div class="addFieldset"><button class="sprites-before addmore positive" data-type="regions">Add a region</button></div> <div class="submit"><button class="sprites-before submitForm positive">Preview</button><button id="clearRegions" class="sprites-before clear negative">Clear all</button></div> </div> <div id="map-preview"> <div id="mapWrapper"> <div id="actionsBar" class="ui-widget-header ui-helper-clearfix"> <ul> <li><a href="#" class="sprites tooltip toolsZoomIn" title="zoom in +"></a></li> <li class="divider"><a href="#" class="sprites tooltip toolsZoomOut" title="zoom out -"></a></li> <li><a href="#" class="sprites tooltip toolsCrop" title="crop ctrl+x"></a></li> <li class="divider"><a href="#" class="sprites tooltip toolsQuery" title="fill regions"></a></li> <li><a href="#" class="sprites tooltip toolsUndoDisabled" title="undo ctrl+z"></a></li> <li class="divider"><a href="#" class="sprites tooltip toolsRedoDisabled" title="redo ctrl+y"></a></li> <li><a href="#" class="sprites tooltip toolsNew" title="new ctrl+n"></a></li> <li><a href="#" class="sprites tooltip toolsRefresh" title="refresh ctrl+r"></a></li> <li><a href="#" class="sprites tooltip toolsRebuild" title="rebuild ctrl+b"></a></li> </ul> <h3 id="mapTitle"> </h3> <ul id="map-saveDialog"> <li><a class="sprites-before tooltip map-saveItem toolsDownload" href="#" title="download ctrl+d">Download</a></li> </ul> </div> <div id="map"> <div id="mapImage"> <div id="mapControls"> <div class="viewport"> <ul class="overview"></ul> </div> <div class="dot"></div> <div id="wheel-overlay"> <a href="#" class="sprites tooltip controls arrows up" data-pan="up" title="pan up"></a> <a href="#" class="sprites tooltip controls arrows right" data-pan="right" title="pan right"></a> <a href="#" class="sprites tooltip controls arrows down" data-pan="down" title="pan down"></a> <a href="#" class="sprites tooltip controls arrows left" data-pan="left" title="pan left"></a> </div> <div class="thumb ui-widget-header"></div> </div> <div id="badRecordsWarning"><a href="#" class="sprites-before toolsBadRecords">Data Out of Range</a></div> <div id="mapOutput"><img id="mapOutputImage" src="public/images/basemap.png" alt="" width="900" height="450" /></div> </div> <div id="mapScale"><img id="mapOutputScale" src="public/images/basemap-scalebar.png" alt="" width="200" height="27" /></div> <div id="mapToolsCollapse" class="mapTools-default ui-widget-header"><a href="#" class="sprites tooltip" title="expand/collapse ctrl+e"></a></div> </div> <div id="mapTools"> <ul> <li><a href="#mapOptions">Settings</a></li> <li><a href="#mapLegend">Legend</a></li> </ul> <div id="mapLegend"><p><em>legend will appear here</em></p></div> <div id="mapOptions"> <h2>Layers</h2> <ul class="columns ui-helper-clearfix"> <li> <input type="checkbox" id="countries" class="layeropt" name="layers[countries]" checked /> <label for="countries">Countries</label> </li> <li> <input type="checkbox" id="stateprovinces" class="layeropt" name="layers[stateprovinces]" /> <label for="stateprovinces">State/Provinces</label> </li> <li> <input type="checkbox" id="us_counties" class="layeropt" name="layers[us_counties]" /> <label for="us_counties">US Counties</label> </li> <li> <input type="checkbox" id="lakesOutline" class="layeropt" name="layers[lakesOutline]" /> <label for="lakesOutline">lakes (outline)</label> </li> <li> <input type="checkbox" id="lakes" class="layeropt" name="layers[lakes]" /> <label for="lakes">lakes (greyscale)</label> </li> <li> <input type="checkbox" id="lakes_blue" class="layeropt" name="layers[lakes_blue]" /> <label for="lakes_blue">lakes (blue)</label> </li> <li> <input type="checkbox" id="rivers" class="layeropt" name="layers[rivers]" /> <label for="rivers">rivers</label> </li> <li> <input type="checkbox" id="oceans" class="layeropt" name="layers[oceans]" /> <label for="oceans">oceans (greyscale)</label> </li> <li> <input type="checkbox" id="oceans_blue" class="layeropt" name="layers[oceans_blue]" /> <label for="oceans_blue">oceans (blue)</label> </li> <li> <input type="checkbox" id="relief" class="layeropt" name="layers[relief]" /> <label for="relief">relief</label> </li> <li> <input type="checkbox" id="reliefalt" class="layeropt" name="layers[reliefalt]" /> <label for="reliefalt">relief (alternate)</label> </li> <li> <input type="checkbox" id="reliefgrey" class="layeropt" name="layers[reliefgrey]" /> <label for="reliefgrey">relief (greyscale)</label> </li> <li> <input type="checkbox" id="blueMarble" class="layeropt" name="layers[blueMarble]" /> <label for="blueMarble">Blue Marble</label> </li> <li> <input type="checkbox" id="conservation" class="layeropt" name="layers[conservation]" /> <label for="conservation">biodiv. hotspots</label> </li> <li> <input type="checkbox" id="ecoregions" class="layeropt" name="layers[ecoregions]" /> <label for="ecoregions">ecoregions</label> </li> <li> <input type="checkbox" id="marine_ecoregions" class="layeropt" name="layers[marine_ecoregions]" /> <label for="marine_ecoregions">marine ecoregions</label> </li> <li> <input type="checkbox" id="roads" class="layeropt" name="layers[roads]" /> <label for="roads">roads</label> </li> <li> <input type="checkbox" id="railroads" class="layeropt" name="layers[railroads]" /> <label for="railroads">railroads</label> </li> </ul> <h2>Labels</h2> <ul class="columns ui-helper-clearfix"> <li> <input type="checkbox" id="countrynames" class="layeropt" name="layers[countrynames]" /> <label for="countrynames">Countries</label> </li> <li> <input type="checkbox" id="stateprovnames" class="layeropt" name="layers[stateprovnames]" /> <label for="stateprovnames">State/Provinces</label> </li> <li> <input type="checkbox" id="us_counties_names" class="layeropt" name="layers[us_counties_names]" /> <label for="us_counties_names">US Counties</label> </li> <li> <input type="checkbox" id="lakenames" class="layeropt" name="layers[lakenames]" /> <label for="lakenames">lakes</label> </li> <li> <input type="checkbox" id="rivernames" class="layeropt" name="layers[rivernames]" /> <label for="rivernames">rivers</label> </li> <li> <input type="checkbox" id="placenames" class="layeropt" name="layers[placenames]" /> <label for="placenames">places</label> </li> <li> <input type="checkbox" id="physicalLabels" class="layeropt" name="layers[physicalLabels]" /> <label for="physicalLabels">physical</label> </li> <li> <input type="checkbox" id="marineLabels" class="layeropt" name="layers[marineLabels]" /> <label for="marineLabels">marine</label> </li> <li> <input type="checkbox" id="hotspotLabels" class="layeropt" name="layers[hotspotLabels]" /> <label for="hotspotLabels">biodiv. hotspots</label> </li> <li> <input type="checkbox" id="ecoregionLabels" class="layeropt" name="layers[ecoregionLabels]" /> <label for="ecoregionLabels">ecoregions</label> </li> <li> <input type="checkbox" id="marineEcoregionLabels" class="layeropt" name="layers[marineEcoregionLabels]" /> <label for="marineEcoregionLabels">marine ecoregions</label> </li> </ul> <h2>Options</h2> <ul> <li> <input type="checkbox" id="grid" class="layeropt" name="layers[grid]"/><label for="grid">graticules (grid)</label> <div id="graticules-selection"> <input type="radio" id="gridspace" class="gridopt" name="gridspace" value="" checked /> <label for="gridspace">fixed</label> <input type="radio" id="gridspace-1" class="gridopt" name="gridspace" value="1" /> <label for="gridspace-1">1<sup>o</sup></label> <input type="radio" id="gridspace-5" class="gridopt" name="gridspace" value="5" /> <label for="gridspace-5">5<sup>o</sup></label> <input type="radio" id="gridspace-10" class="gridopt" name="gridspace" value="10" /> <label for="gridspace-10">10<sup>o</sup></label> <input type="checkbox" id="gridlabel" name="hide_gridlabel" /> <label for="gridlabel">hide labels</label> </div> </li> </ul> <h3>Line Thickness</h3> <div id="border-slider"></div> <h2>Projection*</h2> <ul> <li> <select id="projection" name="projection"> <option value="epsg:4326" selected>Geographic</option> <option value="esri:102009">North America Lambert</option> <option value="esri:102015">South America Lambert</option> <option value="esri:102014">Europe Lambert</option> <option value="esri:102012">Asia Lambert</option> <option value="esri:102024">Africa Lambert</option> <option value="epsg:3112">Australia Lambert</option> <option value="epsg:102017">North Pole Azimuthal</option> <option value="epsg:102019">South Pole Azimuthal</option> <option value="epsg:54030">World Robinson</option> <option value="epsg:3395">World Mercator</option> </select> </li> <li id="origin-selector"> <label for="origin">longitude of natural origin</label><input type="text" id="origin" name="origin" size="4" /> </li> </ul> <p>*zoom prior to setting projection</p> </div> </div> </div> </div> <div id="map-mymaps"> <div class="panel"> <p>Save and reload your map data or create a generic template.</p> </div> <div id="janrainEngageEmbed"></div> </div> <div id="badRecordsViewer" title="Data out of range"><div id="badRecords"></div></div> <div id="mapSave" title="Save"> <p> <label for="m-mapSaveTitle">Title<span class="required">*</span></label> <input type="text" id="m-mapSaveTitle" class="m-mapSaveTitle" size="35" maxlength="35" /> </p> </div> <div id="mapExport" title="Download"> <div class="download-dialog"> <p> <label for="file-name">File name</label> <input type="text" id="file-name" maxlength="30" size="30" /> </p> <fieldset> <legend>File type</legend> <input type="radio" id="download-svg" class="download-filetype" name="download-filetype" value="svg" checked /> <label for="download-svg">svg*</label> <input type="radio" id="download-png" class="download-filetype" name="download-filetype" value="png" /> <label for="download-png">png</label> <input type="radio" id="download-tif" class="download-filetype" name="download-filetype" value="tif" /> <label for="download-tif">tif</label> <input type="radio" id="download-pptx" class="download-filetype" name="download-filetype" value="pptx" /> <label for="download-pptx">pptx</label> <input type="radio" id="download-docx" class="download-filetype" name="download-filetype" value="docx" /> <label for="download-docx">docx</label> <input type="radio" id="download-kml" class="download-filetype" name="download-filetype" value="kml" /> <label for="download-kml">kml*</label> </fieldset> <fieldset> <legend>Options</legend> <p id="mapCropMessage" class="sprites-before">map will be cropped</p> <div class="download-options"> <input type="radio" id="download-factor-1" class="download-factor" name="download-factor" value="1" checked /> <label for="download-factor-1">1X</label> <input type="radio" id="download-factor-3" class="download-factor" name="download-factor" value="3" /> <label for="download-factor-3">3X</label> <input type="radio" id="download-factor-4" class="download-factor" name="download-factor" value="4" /> <label for="download-factor-4">4X</label> <input type="radio" id="download-factor-5" class="download-factor" name="download-factor" value="5" /> <label for="download-factor-5">5X</label> <div id="scale-measure">Dimensions: <span></span></div> </div> <div class="options-row"> <input type="checkbox" id="border" /> <label for="border">include border</label> </div> <div class="options-row"> <input type="checkbox" id="scalelinethickness" /> <label for="scalelinethickness">make line thickness proportional to image scale</label> </div> <div class="options-row"> <input type="checkbox" id="legend" disabled="disabled" /> <label for="legend">embed legend</label> </div> <div class="options-row"> <input type="checkbox" id="scalebar" disabled="disabled" /> <label for="scalebar">embed scalebar</label> </div> </fieldset> <p>*does not include scalebar, legend, or relief layers</p> </div> <div class="download-message">Building file for download...</div> </div> <input type="hidden" name="download" id="download" /> <input type="hidden" name="output" id="output" /> <input type="hidden" name="download_token" id="download_token" /> <input type="hidden" name="bbox_map" id="bbox_map" /> <input type="hidden" name="projection_map" id="projection_map" /> <input type="hidden" name="bbox_rubberband" id="bbox_rubberband" /> <input type="hidden" name="bbox_query" id="bbox_query" /> <input type="hidden" name="pan" id="pan" /> <input type="hidden" name="zoom_out" id="zoom_out" /> <input type="hidden" name="zoom_in" id="zoom_in" /> <input type="hidden" name="crop" id="crop" /> <input type="hidden" name="rotation" id="rotation" /> <input type="hidden" name="save[title]" id="save[title]" /> <input type="hidden" name="file_name" id="file_name" /> <input type="hidden" name="download_factor" id="download_factor" /> <input type="hidden" name="width" id="width" /> <input type="hidden" name="height" id="height" /> <input type="hidden" name="download_filetype" id="download_filetype" /> <input type="hidden" name="grid_space" id="grid_space" /> <input type="hidden" name="options[border]" id="options[border]" /> <input type="hidden" name="options[legend]" id="options[legend]" /> <input type="hidden" name="options[scalebar]" id="options[scalebar]" /> <input type="hidden" name="options[scalelinethickness]" id="options[scalelinethickness]" /> <input type="hidden" name="border_thickness" id="border_thickness" value="" /> <input type="hidden" name="rendered_bbox" id="rendered_bbox" value="" /> <input type="hidden" name="rendered_rotation" id="rendered_rotation" value="" /> <input type="hidden" name="rendered_projection" id="rendered_projection" value="" /> <input type="hidden" name="legend_url" id="legend_url" value="" /> <input type="hidden" name="scalebar_url" id="scalebar_url" value="" /> <input type="hidden" name="bad_points" id="bad_points" value="" /> <input type="hidden" name="bad_drawings" id="bad_drawings" value="" /> </form> </div> </div> <script type="text/template" id="dialog-template"> <div id="mapper-message" class="ui-state-error" title="Warning"></div> <div id="button-titles" class="hidden-message"> <span class="save">Save</span> <span class="cancel">Cancel</span> <span class="download">Download</span> <span class="delete">Delete</span> </div> <div id="mapper-loading-error-message" class="hidden-message">There was a problem loading your map.</div> <div id="mapper-saving-error-message" class="hidden-message">There was a problem saving your map.</div> <div id="mapper-saving-message" class="hidden-message">Saving...</div> <div id="mapper-missing-legend" class="hidden-message">You are missing a legend for at least one of your Point Data, Region, or Drawing layers.</div> <div id="mapper-message-delete" class="ui-state-highlight hidden-message" title="Delete">Are you sure you want to delete <span></span>?</div> <div id="mapper-legend-message" class="hidden-message">legend will appear here</div> <div id="mapper-message-help" class="ui-state-highlight hidden-message" title="Example Coordinates"></div> <div id="mapper-message-codes" class="ui-state-highlight hidden-message" title="State/Province Codes"></div> <div id="mapEmbed" class="ui-state-highlight hidden-message" title="Embed"> <div class="header"><h2>Image</h2></div> <p><input id="embed-img" type="text" size="62" value="" /></p> <p><strong>Additional parameters</strong>:<br><span class="indent">width, height, legend <br><em>e.g.</em> /map/<span class="mid"></span>?width=200&height=150&legend=true</span></p> <div class="header"><h2>KML</h2></div> <p><input id="embed-kml" type="text" size="62" value="" /></p> <div class="header"><h2>SVG</h2></div> <p><input id="embed-svg" type="text" size="62" value="" /></p> <div class="header"><h2>GeoJSON</h2></div> <p><input id="embed-json" type="text" size="62" value="" /></p> <p><strong>Additional parameters</strong>:<br><span class="indent">callback (<em>e.g.</em> /map/<span class="mid"></span>.json?callback=myCoolCallback)</span></p> </div> <div id="badFile" title="Unsupported file type">Only files of type text are accepted.</div> <div id="tooMuchData" title="Too many fields of data">A maximum of 30 data fields is supported.</div> </script> <div id="colorpicker"><div class="colorpicker colorpicker_background"><div class="colorpicker_color"><div class="colorpicker"><div class="colorpicker"></div></div></div><div class="colorpicker_hue"><div class="colorpicker"></div></div><div class="colorpicker_new_color"></div><div class="colorpicker_current_color"></div><div class="colorpicker colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="colorpicker_rgb_r colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_g colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_b colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_h colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_s colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_b colorpicker colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="sprites-before colorpicker_submit">Apply</div></div></div> <script> (function(w,d) { if (typeof w.janrain !== 'object') { w.janrain = {}; } w.janrain.settings = {}; w.janrain.settings.language = 'en'; w.janrain.settings.tokenUrl = 'https://www.simplemappr.net/session/'; function isJanrainReady() { janrain.ready = true; }; if (d.addEventListener) { d.addEventListener("DOMContentLoaded", isJanrainReady, false); } else if (w.attachEvent) { w.attachEvent('onload', isJanrainReady); } else if (w.onLoad) { w.onload = isJanrainReady; } })(window,document); </script> <script src="public/javascript/head.load.min.js"></script> <script>head.js({jquery : "//code.jquery.com/jquery-3.2.1.min.js"},{jquery_ui : "public/javascript/jquery-ui-1.12.1.custom.min.js"},{janrain : "public/javascript/janrain.engage.min.js"},{compiled : "/public/javascript/cache/956da5aa.js"}); head.ready("compiled", function () { SimpleMappr.init({ baseUrl : "https://www.simplemappr.net", active : "false", maxTextareaCount : 30});}); </script> </body> </html>