Appling County, Georgia Bridge Inspections (2024)

'; popupContent += '

'; popupContent += '

'; return popupContent; }//{"type": "Feature","properties":{"gid":"01001", "name":"Autauga County, AL", "slug":"autauga", "stslug":"alabama", "year":"2018", "total":"117", "nf":"14", "nfc":"14", "cl":"0", "pctnfc":"11.97","poor":"4","pctpoor":"3.42","sd":"4","pctsd":"3.42","fo":"16","pctfo":"13.68","fc":"#e6b414","pc":"#00f014"},"geometry": {"type": "MultiPolygon","coordinates":US01001}} function onBridgeFeature(feature) { if(feature.properties.ost == 'good'){var ost = 'Good/Fair';} else if(feature.properties.ost == 'poor'){var ost = 'Meets minimum tolerable limits';} else if(feature.properties.ost == 'repair'){var ost = 'Needs repair or corrective action';} else if(feature.properties.ost == 'closed'){var ost = 'Closed';} else if(feature.properties.ost == 'N/A'){var ost = 'Report Not Available';}; if(feature.properties.bc == 'F'){var bc = 'Fair';} else if(feature.properties.bc == 'G'){var bc = 'Good';} else if(feature.properties.bc == 'P'){var bc = 'Poor';}; if(feature.properties.sd == 'y'){var sd = '
Structurally Deficient';} else { var sd = '';} if(feature.properties.fo == 'y'){var fo = '
Functionally Obsolete';} else { var fo = '';} var popupContent = "";// var popupContent = "

I started out as a GeoJSON " + feature.geometry.type + ", but now I'm a Leaflet vector!

"; popupContent += '

'+feature.properties.name+'

'; popupContent += '

'; popupContent += '

'; return popupContent; } var CntyBridgesJSON = { "type": "FeatureCollection", "features":BridgeJSONData };mapboxgl.accessToken = 'pk.eyJ1IjoieXB5dW4iLCJhIjoiY2oxcW4ybWhxMDBkMjJxcGVhbDV5cnpzYyJ9.oFQSnOc57xCR7A51OR6-3w'; //ck0flqufl2k1x1cpmupm5sl2yvar map = new mapboxgl.Map({container: 'bridgeMap', style: 'mapbox://styles/ypyun/cj83a8ga5abkq2sqpivw3nrzg',center: [-84.515754,27.664827], zoom: 5, attributionControl: false, });map.addControl(new mapboxgl.AttributionControl({ compact: false, customAttribution:['Map Icons Collection'] })); var STLINE = {"type":"FeatureCollection", "features":[ {"type":"Feature","properties":{"GEO_ID":"13001","NAME":"State","VAL":0,"VALstr":"","VALper":"","FC":"#FFF",},"geometry":{"type":"MultiPolygon","coordinates":US13001 }}, ]}; // ptype listmap.on('style.load', function() { var layers = map.getStyle().layers; var firstSymbolId; for (var i = 0; i < layers.length; i++) { if (layers[i].type === 'symbol') { firstSymbolId = layers[i].id; break; } } map.addSource('bridges', {type: 'geojson', data: CntyBridgesJSON }); map.loadImage('/static/markers/bridges/bridge_green.png', function(error, image) {if (error) throw error; map.addImage('green', image); }); map.loadImage('/static/markers/bridges/bridge_yellow.png', function(error, image) {if (error) throw error; map.addImage('yellow', image); }); map.loadImage('/static/markers/bridges/bridge_red.png', function(error, image) {if (error) throw error; map.addImage('red', image); }); map.loadImage('/static/markers/bridges/bridge_black.png', function(error, image) {if (error) throw error; map.addImage('black', image); }); map.loadImage('/static/markers/bridges/bridge_white.png', function(error, image) {if (error) throw error; map.addImage('white', image); }); map.addLayer({"id": "green", "type": "symbol", "source": "bridges", "filter":["all", ["==","grade","green"], ["==","m","y"]], "layout": {"visibility":"none", "icon-image": 'green', 'icon-allow-overlap':true},}); map.addLayer({"id": "yellow", "type": "symbol", "source": "bridges", "filter":["all", ["==","grade","yellow"], ["==","m","y"]], "layout": {"visibility":"visible", "icon-image": 'yellow', 'icon-allow-overlap':true},}); map.addLayer({"id": "red", "type": "symbol", "source": "bridges", "filter":["all", ["==","grade","red"], ["==","m","y"]], "layout": {"visibility":"visible", "icon-image": 'red', 'icon-allow-overlap':true},}); map.addLayer({"id": "black", "type": "symbol", "source": "bridges", "filter":["all", ["==","grade","black"], ["==","m","y"]], "layout": {"visibility":"visible", "icon-image": 'black', 'icon-allow-overlap':true},}); map.addLayer({"id": "white", "type": "symbol", "source": "bridges", "filter":["all", ["==","grade","white"], ["==","m","y"]], "layout": {"visibility":"none", "icon-image": 'white', 'icon-allow-overlap':true },}); for (blayer of ['green','yellow','red','black','white']) { map.on('click', blayer, function (e) {new mapboxgl.Popup({ offset: 14 }).setLngLat(e.lngLat).setHTML(onBridgeFeature(e.features[0])).addTo(map);}); map.on('mouseenter', blayer, function () {map.getCanvas().style.cursor = 'pointer'; }); map.on('mouseleave', blayer, function () {map.getCanvas().style.cursor = '';}); } map.addLayer({ "id": "stline", "type": "line", "source": { "type": "geojson", "data":STLINE }, "paint": {'line-color':"#333", 'line-opacity':0.9, 'line-width': 2.0 }},firstSymbolId);}); var toggleableLayerIds = [['green','Good'],['yellow','Meet Min.'],['red','Need Repair'],['black','Closed'],['white','N/A']];for (var i = 0; i < toggleableLayerIds.length; i++) { var id = toggleableLayerIds[i][0]; var idstr = toggleableLayerIds[i][1]; var link = document.createElement('a'); link.href = '#'; if (toggleableLayerIds[i][0] == 'green' || toggleableLayerIds[i][0] == 'white'){link.className = 'inactive';} else {link.className = 'active';} link.tgid = id; link.textContent = idstr; link.setAttribute("id",id+'_id') link.onclick = function (e) { var clickedLayer = this.tgid; e.preventDefault(); e.stopPropagation(); var visibility = map.getLayoutProperty(clickedLayer, 'visibility'); console.log(clickedLayer); if (visibility === 'visible') { map.setLayoutProperty(clickedLayer, 'visibility', 'none'); this.className = ''; } else { this.className = 'active'; map.setLayoutProperty(clickedLayer, 'visibility', 'visible'); } }; var layers = document.getElementById('mapmenu'); layers.appendChild(link);} var bounds = new mapboxgl.LngLatBounds(); var BounceLine = STLINE['features'][0]['geometry']['coordinates']; BounceLine.forEach(function(Tpolygon) { Tpolygon.forEach(function(Tline){ Tline.forEach(function(Tpoint){bounds.extend(Tpoint); }) }) });map.fitBounds(bounds, { padding: 120 });map.addControl(new mapboxgl.NavigationControl(), 'top-left');