Alta Map Spartanburg
How do I make an alta map spartanburg?
Multiple kmz files on one google map.google documentation: https://developers.google.com/maps/documentation/javascript/examples/layer-kml-features. What is a alta map spartanburg? How do you make a alta map spartanburg? This script and codes were developed by Pollardld on 08 November 2022, Tuesday.
Alta Map Spartanburg - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Alta Map Spartanburg</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="map-canvas"></div>
<div id="legend"> <ul> <li><input type="checkbox" id="existing-trails" checked> <label for="existing-trails">Existing Trails</label></li> <li><input type="checkbox" id="existing-bikeways" checked> <label for="existing-bikeways">Existing Bikeways</label></li> <li><input type="checkbox" id="proposed-trails" checked> <label for="proposed-trails">Proposed Trails</label></li> <li><input type="checkbox" id="proposed-bikeways" checked> <label for="proposed-bikeways">Proposed Bikeways</label></li> </ul>
</div>
<div class="colors"> <ul> Existing Trails <li><i></i> Paved Trail</li> <li><i></i> Natural Surface</li> <li><i></i> Neighborhood Greenway</li> <li><i></i> Blueway</li> Proposed Trails <li><i></i> Paved Trail</li> <li><i></i> Natural Surface</li> <li><i></i> Cultural Trail</li> <li><i></i> Blueway</li> Existing Bikeways <li><i></i> Signed Route</li> <li><i></i> Bike Lane or Sharrow</li> <li><i></i> 4' shoulder</li> Proposed Bikeways <li><i></i> Bike Route</li> <li><i></i> Bike Lane</li> <li><i></i> Paved Shoulder</li> <li><i></i> Shared Lane Marking</li> <li><i></i> Wide Outside Lane</li> </ul>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false'></script> <script src="js/index.js"></script>
</body>
</html>
Alta Map Spartanburg - Script Codes CSS Codes
@import url(https://fonts.googleapis.com/css?family=Fanwood+Text);
html, body, #map-canvas { font-family: 'Fanwood Text', serif; height: 100%; margin: 0px; padding: 0px;
}
.colors { background: #f2f2f2; box-size: border-box; color: #666; font-size: .75em; max-height: 60%; overflow: scroll; right: 0; padding: 1rem; position: absolute; top: 0;
}
.colors ul { list-style: none; margin: 0; padding: 0;
}
.colors ul li { margin-bottom: .25rem;
}
.colors ul li i { box-sizing: border-box; display: inline-block;
}
.colors ul li:nth-of-type(1) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(2) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(3) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(4) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(5) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(6) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(7) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(8) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(9) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(10) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(11) i { border: 2px solid #000; height: .875em; margin: .25rem .25rem 0 .75rem; width: .875em;
}
.colors ul li:nth-of-type(12) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(13) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(14) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(15) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(16) i { height: .75em; margin: 0 .25rem 0 .75rem; width: .75em;
}
.colors ul li:nth-of-type(1) i { background: #33a02c;
}
.colors ul li:nth-of-type(2) i { background: #b15928;
}
.colors ul li:nth-of-type(3) i { background: #6a3d9a;
}
.colors ul li:nth-of-type(4) i { background: #1f78b4;
}
.colors ul li:nth-of-type(5) i { background: #33a02c;
}
.colors ul li:nth-of-type(6) i { background: #b15928;
}
.colors ul li:nth-of-type(7) i { background: #6a3d9a;
}
.colors ul li:nth-of-type(8) i { background: #1f78b4;
}
.colors ul li:nth-of-type(9) i { background: yellow;
}
.colors ul li:nth-of-type(10) i { background: #e31a1c;
}
.colors ul li:nth-of-type(11) i { background: #ff7f00;
}
.colors ul li:nth-of-type(12) i { background: yellow;
}
.colors ul li:nth-of-type(13) i { background: #e31a1c;
}
.colors ul li:nth-of-type(14) i { background: #ff7f00;
}
.colors ul li:nth-of-type(15) i { background: #cd6699;
}
.colors ul li:nth-of-type(16) i { background: #fdbf6f;
}
#legend { background: rgba(255, 250, 242, 0.95); bottom: 0; box-size: border-box; color: #666; font-size: 1em; max-height: 40%; overflow: scroll; padding: 1rem 1.5rem; position: absolute; right: 0;
}
#legend ul { list-style: none; margin: 0; padding: 0;
}
#legend ul li { line-height: 1.5em; margin-bottom: .75em;
}
#legend ul li:last-of-type { margin-bottom: 0;
}
#legend ul li label { cursor: pointer;
}
#legend ul li input[type="checkbox"] { cursor: pointer; display: inline-block; height: 1em; margin-right: .5em; position: relative; top: 0; width: 1em;
}
#legend ul li input[type="checkbox"]:after { background: #fff; border: .1675em solid #8fdaaa; box-sizing: border-box; border-radius: 50%; color: #666; content: ''; height: 1.5em; left: -.25em; position: absolute; top: -.25em; width: 1.5em;
}
#legend ul li input[type="checkbox"]:before { background: #fff; box-sizing: border-box; border-radius: 50%; content: ''; height: .75em; left: .125em; position: absolute; top: .125em; width: .75em; z-index: 1; transition: .1s all ease;
}
#legend ul li input[type="checkbox"]:checked:before { background: #8fdaaa;
}
.gm-style-iw table tbody:first-child { visibility: hidden;
}
.gm-style-iw table tbody table tbody:first-child { visibility: visible;
}
Alta Map Spartanburg - Script Codes JS Codes
function initialize() { var spartanburg = new google.maps.LatLng(34.942,-81.922); var mapOptions = { zoom: 11, center: spartanburg } var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); // Black background layers var exisitingTrailsBackground = new google.maps.KmlLayer({ url : 'http://diccfish.com/ExistingBackground_Trails.kmz', suppressInfoWindows : true, preserveViewport : true, zIndex : 0 }); var exisitingBikewaysBackground = new google.maps.KmlLayer({ url : 'http://diccfish.com/ExistingBackground_Bikeways.kmz', suppressInfoWindows : true, preserveViewport : true, zIndex : 0 }); // Existing Layers var existingTrailsLayer = new google.maps.KmlLayer({ url : 'http://diccfish.com/ExistingTrails_030714.kmz', preserveViewport : true, zIndex : 1 }); var existingBikewaysLayer = new google.maps.KmlLayer({ url : 'http://diccfish.com/ExistingBikeways_030714.kmz', preserveViewport : true, zIndex : 1 }); // Proposed Layers var proposedTrailsLayer = new google.maps.KmlLayer({ url : 'http://diccfish.com/ProposedTrails_031314_Dash.kmz', preserveViewport : true, zIndex : 2 }); var proposedBikewaysLayer = new google.maps.KmlLayer({ url : 'http://diccfish.com/ProposedBikeways_031314_Dash.kmz', preserveViewport : true, zIndex : 2 }); // Add all trails to map exisitingTrailsBackground.setMap(map); exisitingBikewaysBackground.setMap(map); existingTrailsLayer.setMap(map); existingBikewaysLayer.setMap(map); proposedTrailsLayer.setMap(map); proposedBikewaysLayer.setMap(map); // Legend Controls var existingTrailsCheckbox = document.getElementById( 'existing-trails' ), existingBikewaysCheckbox = document.getElementById( 'existing-bikeways' ), proposedTrailsCheckbox = document.getElementById( 'proposed-trails' ), proposedBikewaysCheckbox = document.getElementById( 'proposed-bikeways' ); jQuery( 'input[type="checkbox"]' ).on( 'click', function() { if ( existingTrailsCheckbox.checked ) { existingTrailsLayer.setMap(map); exisitingTrailsBackground.setMap(map); } else { existingTrailsLayer.setMap(null); exisitingTrailsBackground.setMap(null); } if ( existingBikewaysCheckbox.checked ) { existingBikewaysLayer.setMap(map); exisitingBikewaysBackground.setMap(map); } else { existingBikewaysLayer.setMap(null); exisitingBikewaysBackground.setMap(null); } if ( proposedTrailsCheckbox.checked ) { proposedTrailsLayer.setMap(map); } else { proposedTrailsLayer.setMap(null); } if ( proposedBikewaysCheckbox.checked ) { proposedBikewaysLayer.setMap(map); } else { proposedBikewaysLayer.setMap(null); } });
}
google.maps.event.addDomListener(window, 'load', initialize);
Developer | Pollardld |
Username | pollardld |
Uploaded | November 08, 2022 |
Rating | 3.5 |
Size | 4,679 Kb |
Views | 12,144 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Form Submit to Google Forms | 5,606 Kb |
SR2S Stable | 7,090 Kb |
Paypal checkout svg | 21,662 Kb |
Triceratops | 3,458 Kb |
CSS Accordion | 3,972 Kb |
Turkey Hunting with Horizontal Lines | 7,568 Kb |
SVG Animation | 3,133 Kb |
Titanis walleri | 3,596 Kb |
Pipe Billow SVG Animation | 2,532 Kb |
My Map | 3,867 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
Project Euler Problem 17 | Bfillmer | 2,739 Kb |
Blog | Rottingroom | 1,430 Kb |
Popover Example | Seanboom | 2,429 Kb |
Login with flip 3d animation | Mariusbalaj | 3,014 Kb |
VerbalExpressions Converter | Cmalven | 2,607 Kb |
Image Stack Test SCSS | CalvinMorett | 2,799 Kb |
Flex Chart | James_zedd | 4,111 Kb |
Mario | Takaneichinose | 3,902 Kb |
Amazing CSS Menu with Notification Badges | Faizanasad | 2,549 Kb |
Button shaking | SusanneLundblad | 2,227 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!