GeoJSON with CartoDB layer

Demonstrates loading a local data file (encoded in TopoJSON format) and symbolizes using Leaflet functionality. Also loads a data layer form CartoDB database. JQuery detects zoom level to remove or add the hexbin layer and toggle between the relevant legends/layer switcher.

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Kentucky Oil and Gas Wells Demo</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />

}
</style>
</head>
<body>
<div id='map'></div>
<form id="menu">
	<input type="radio" name="well" id="wells" checked="true" /><label for="all">all</label>
    <input type="radio" name="well" id="gas" /><label for="gas">gas</label>
    <input type="radio" name="well" id="oil" /><label for="oil">oil</label>
	<input type="radio" name="well" id="d&a" /><label for="d&a">d&amp;a</label>
 </form>
    
    <script src='//api.tiles.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.2.0/leaflet-omnivore.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/simple-statistics/1.0.0/simple_statistics.min.js'></script>
<script src="https://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script>
<script>
    var map = L.map('map')
    	.setView([37.85, -84.77], 8);

L.tileLayer('https://tile.stamen.com/toner/{z}/{x}/{y}.png', {
          attribution: 'Stamen'
        }).addTo(map);

cartodb.createLayer(map, 'https://rgdonohue.cartodb.com/api/v2/viz/bcdbfe36-6f4f-11e5-833d-0e674067d321/viz.json', { https: true })
    	.addTo(map)
    	.on('done', function(layer) {

layer.setInteraction(true);

$('.cartodb-legend').hide();
        })
    	.on('error', function(err) {
      		alert("some error occurred: " + err);
    	});

var hexStyle = {
    	color: '#fff',
			fillColor: 'grey',
    	opacity: 1,
    	weight: 1,
    	fillOpacity: 1
    }

var classBreaks;

var colors = ["#feedde","#fdbe85","#fd8d3c","#e6550d","#a63603"];

var currentVar = 'wells';

var hex = omnivore.topojson('ky-wells.json')
    	.on('ready', function() {
    		hex.setStyle(hexStyle);
    		getClassBreaks();
    		symbolize();
            retrieve();
    	})
    	.on('error', function() {
    		alert('hex data failed to load');
    	})
    	.addTo(map);

function getClassBreaks() {
			var range = [];
			hex.eachLayer(function(l) {
	    		range.push(Number(l.feature.properties[currentVar]));
	    	});

classBreaks = ss.quantile(range,[0,.2,.4,.6,.8,1]);
	    }

function getColor(val) {
    	return  val > classBreaks[5] ? "#a63603" :
    			val > classBreaks[4] ? "#e6550d" :
    			val > classBreaks[3] ? "#fd8d3c" :
    			val > classBreaks[2] ? "#fdbe85" :
    								   "#feedde";
    }
    function symbolize() {

hex.eachLayer(function(l) {
    		l.setStyle({
    			fillColor: getColor(Number(l.feature.properties[currentVar]))
    		})
    	});
    }
    function retrieve(){
        hex.eachLayer(function(layer){
            var popup = 'all wells: <b>'+layer.feature.properties.wells+'</b><br>'+
                                    'gas wells: <b>'+layer.feature.properties.gas+'</b><br>'+
                                    'oil wells: <b>'+layer.feature.properties.oil+'</b><br>'+
                                    'd&amp;a wells: <b>'+layer.feature.properties['d&a']+'</b><br>';
            layer.bindPopup(popup);
        });
    }
    $('input').on('change', function() {
    	currentVar = this.id;
    	getClassBreaks();
    	symbolize();
    });

map.on('zoomend', function(e) {
    	if(map.getZoom()>= 9){
    		map.removeLayer(hex);
            $('#menu').hide();
            $('.cartodb-legend').show();
            
    	} else {
    		if(!map.hasLayer(hex)){
    			map.addLayer(hex);
    		}
             $('#menu').show();
             $('.cartodb-legend').hide();
    	}
    });

</script>
</body>
</html>

Modified http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js to a secure url

https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.2.0/leaflet-omnivore.min.js

https://cdnjs.cloudflare.com/ajax/libs/simple-statistics/1.0.0/simple_statistics.min.js

https://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js