Skip to content

Instantly share code, notes, and snippets.

View Ewiseman's full-sized avatar

Eric Wiseman Ewiseman

2 followers · 2 following
  • Denver, CO
View GitHub Profile
@Ewiseman
Ewiseman / radial_bar.js
Last active May 8, 2017 16:15
Radial Bar Chart
$(document).ready(function() {
var radialElement = $("#radial");
var outerWidth = radialElement.width();
var outerHeight = radialElement.width()+200;
var margin = { left: 0, top: 88, right: 0, bottom: 88 };
var radiusMax = radialElement.width()/3 ;
var sliceSizeColumn = "acres";
var resortNameColumn = "resort_name"
@Ewiseman
Ewiseman / radial_column.js
Last active January 3, 2019 13:43
Radial Column Chart
$(document).ready(function() {
var centerRadial = $("#radial-column");
var outerWidth = centerRadial.width();
var outerHeight = centerRadial.width()+500;
var margin = { left: 0, top: 88, right: 0, bottom: 88 };
var stateColor = "state";
@Ewiseman
Ewiseman / sortable_bar.js
Last active May 8, 2017 16:15
Sortable Bar Chart
$(document).ready(function() {
var acreageThreshold = 0 ; //not greater than 4000
var margin = {top: 20, right: 50, bottom: 50, left: 200},
width = $("#horizontal-tool").width() - margin.left - margin.right,
height = ((4000 - acreageThreshold)- 250),
stateHeight = 2000,
barPadding = 8;
@Ewiseman
Ewiseman / horizontal_bar.js
Last active May 8, 2017 16:15
Horizontal Bar Chart
$(document).ready(function() {
var margin = {top: 20, right: 50, bottom: 50, left: 200},
width = $("#horizontal").width() - margin.left - margin.right,
height = 5000 - margin.top - margin.bottom;
var yAxisMargin = height - margin.bottom
var svg = d3.select("#horizontal").append("svg")
.attr("width", width + margin.left + margin.right)
@Ewiseman
Ewiseman / ski_resort_stats.csv
Created March 17, 2017 23:36
Ski Resort Data
resort_name state summit base vertical lifts runs acres green_percent green_acres blue_percent blue_acres black_percent black_acres lat lon
49(degrees) North, WA Washington 5774 3923 1851 6 68 2325 0.3 697.5 0.4 930 0.3 697.5 49 -115.84
Afton Alps, MN Minnesota 700 350 350 21 48 300 0.2 60 0.6 180 0.2 60 44.85 -92.79
Alpine Meadows, CA California 8673 6385 2288 13 100 2400 0.25 600 0.4 960 0.35 840 39.17 -120.22
Alpine Mountain, PA Pennsylvania 1150 600 500 3 21 120 0.17 20.4 0.55 66 0.28 33.6 40.08 -76.9
Alpine Valley, MI Michigan 1210 910 300 14 25 118 0.39 46.02 0.26 30.68 0.35 41.3 44.96 -84.87
Alpine Valley, OH Ohio 1500 1260 230 6 11 72 0.33 23.76 0.34 24.48 0.33 23.76 40.31 -83.68
Alpine Valley, WI Wisconsin 388 16 20 90 0.4 36 0.4 36 0.2 18 42.45 -88.25
Alta, UT Utah 10550 8530 2020 11 116 2200 0.25 550 0.4 880 0.35 770 40.6 -111.64
Alyeska, AK Alaska 3939 250 2500 9 73 1500 0.11 165 0.52 780 0.37 555 60.97 -149.11
@Ewiseman
Ewiseman / radial_lollipop.js
Last active May 8, 2017 16:14
Radial Lollipop Chart
$(document).ready(function() {
var centerRadial = $("#radial-bubble");
var outerWidth = centerRadial.width();
var outerHeight = centerRadial.width()+200;
var margin = { left: 0, top: 0, right: 0, bottom: 0 };
var innerWidth = outerWidth + margin.left + margin.right;
var innerHeight = outerHeight - margin.top - margin.bottom;
@Ewiseman
Ewiseman / scatter_plot.js
Last active January 31, 2019 21:19
Scatter Plot
$(document).ready(function() {
var margin = {top: 20, right: 20, bottom: 160, left: 40},
width = $("#scatter-plot").width() - margin.left - margin.right,
height = 600 - margin.top - margin.bottom;
// setup x
var xValue = function(d) { return d.acres;}, // data -> value
xScale = d3.scale.linear().range([0, width]), // value -> display
xMap = function(d) { return xScale(xValue(d));}, // data -> display
@Ewiseman
Ewiseman / resort_map.js
Last active May 8, 2017 17:27
Ski Resort Map
$(document).ready(function() {
// Defines the width and height of visualization
var margin = {top: 20, right: 0, bottom: 160, left: 0},
width = $("#us-map").width() + 50,
height = 1000 - margin.top - margin.bottom,
centered;
// Maps the latitude on longitude on the SVG and adjust scaling and rotation
var projection = d3.geo.conicConformal()
@Ewiseman
Ewiseman / thee_d_triangles.js
Created May 8, 2017 17:31
3D Triangles
$(document).ready(function() {
////Width and height
var margin = {top: 20, right: 20, bottom: 160, left: 40},
width = $("#three-d-triangles").width() - margin.left - margin.right,
height = 1000 - margin.top - margin.bottom;
//Create SVG element
var svg = d3.select("#three-d-triangles")
.append("svg")
@Ewiseman
Ewiseman / triangles.js
Created May 8, 2017 17:36
Triangles
$(document).ready(function() {
////Width and height
var margin = {top: 20, right: 20, bottom: 160, left: 40},
width = $("#flat-triangles").width() - margin.left - margin.right,
height = 1000 - margin.top - margin.bottom;
//Create SVG element
var svg = d3.select("#flat-triangles")
.append("svg")