Fork and edit of John Alexis Guerra Gómez's GeoJson Map of Bogotá .
Simple map of US oil and gas basins made from EIA data and hand-drawn data (via the R package mapedit).
-
-
Save seasmith/5d4eaa8c752dc6223315a5dc7b2798f2 to your computer and use it in GitHub Desktop.
GeoJson Map of US Oil and Gas Basins
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| license: mit |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| h1, h2 { | |
| font-family: "Lato", "Open Sans", "sans-serif"; | |
| margin: 0px; | |
| padding: 3px; | |
| } | |
| .text-things { | |
| margin-bottom: 8px; | |
| } | |
| .tract { stroke: #fff; } | |
| .tract:hover { opacity: 0.5; } | |
| </style> | |
| <div class="text-things"> | |
| <h1>US Weekly Oil and Gas Rig Count</h1> | |
| <h2>Week of: December 8, 2017</h2> | |
| </div> | |
| <svg width="960" height="550"></svg> | |
| <script src="https://d3js.org/d3.v4.min.js"></script> | |
| <script> | |
| var svg = d3.select("svg"), | |
| width = +svg.attr("width"), | |
| height = +svg.attr("height"), | |
| margin = { top: 20, bottom:20, right: 20, left: 20}; | |
| d3.json("us_basins.json", function(error, data) { | |
| if (error) throw error; | |
| var path = d3.geoPath() | |
| .projection(d3.geoAlbers() | |
| //.rotate([0,0,-40]) // Make it horizontal (kind of) | |
| .fitExtent([[margin.left, margin.top], [width-margin.right, height-margin.bottom]], data) | |
| ); | |
| var signs = [1, 0, -1]; | |
| var colScale = d3.scaleOrdinal() | |
| .domain(signs) | |
| .range(["#4fa8ff", "#7f7f7f", "#ce1141"]); | |
| svg.selectAll("path") | |
| .data(data.features) | |
| .enter().append("path") | |
| .attr("class", "tract") | |
| .attr("fill", function(d) { | |
| return colScale(Math.sign(d.properties.change_1wk)); }) | |
| .attr("d", path) | |
| .append("title") | |
| .text(function(d) { return "Basin: " + d.properties.display_name + | |
| "\nCurrent total: " + d.properties.value + | |
| "\nWeekly change: " + d.properties.change_1wk; }); | |
| }); | |
| </script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment