Template for scss files
//////////////////////
/// BLOCK__ELEMENT ///
//////////////////////
.wrapper {}
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title></title> | |
<link rel="stylesheet" type="text/css" href="style.css" > | |
<style type="text/css"> | |
svg { | |
outline: 1px solid #f0f; | |
} |
yield | variety | year | site | |
---|---|---|---|---|
27 | Manchuria | 1931 | University Farm | |
48.86667 | Manchuria | 1931 | Waseca | |
27.43334 | Manchuria | 1931 | Morris | |
39.93333 | Manchuria | 1931 | Crookston | |
32.96667 | Manchuria | 1931 | Grand Rapids | |
28.96667 | Manchuria | 1931 | Duluth | |
43.06666 | Glabron | 1931 | University Farm | |
55.2 | Glabron | 1931 | Waseca | |
28.76667 | Glabron | 1931 | Morris |
function melodyChart() { | |
var settings = { | |
chartContainerClass: ".g-chart-container-melody-chart" | |
}; | |
var chartContainer = d3.select(settings.chartContainerClass).html(''); | |
var margin = { | |
top:40, | |
left:100, |
;(function(){ | |
//////////////////// | |
//// slopegraph //// | |
//////////////////// | |
function slopeGraph(slopeOpts) { | |
var settings = { | |
chartContainerClass: slopeOpts.domLoc, | |
selectedRegion : slopeOpts.region, |
function barChart(dataPath, elem, opts) { | |
var settings = { | |
premise: opts.premise, | |
title: opts.title, | |
axisCategory: opts.axisCategory, | |
axisValue: opts.axisValue, | |
orientationVal: opts.orientationVal, | |
rangeMax: opts.rangeMax, | |
sortDescending: opts.sortDescending, |
Country | JAZZ | ROCKSTEADY | TROPICALIA | |
---|---|---|---|---|
United Arab Emirates | 2 | 20 | 16 | |
Albania | 16 | 24 | 19 | |
Armenia | 29 | 25 | 15 | |
Argentina | 14 | 28 | 20 | |
Austria | 12 | 26 | 14 | |
Australia | 2 | 21 | 12 | |
Azerbaijan | 12 | 15 | 7 | |
Bosnia and Herzegovina | 12 | 19 | 27 | |
Bangladesh | 19 | 24 | 19 |
* { | |
box-sizing: border-box; | |
padding:0; | |
margin:0; | |
/*font-family: 'Raleway', sans-serif; */ | |
font-family: 'Josefin Slab', sans-serif; | |
} | |
body { | |
background-color:#ececec; | |
padding:0 0 2rem 0; |
var d3Config = d3Config || {}; | |
d3Config.init = function(settings) { | |
console.log("Configing!!"); | |
d3Config.linkStyle(settings); | |
if (typeof settings.win.d3 === "undefined") { | |
console.log("lib undefined"); | |
d3Config.loadLib(settings); | |
} | |
if (typeof settings.win.d3 !== "undefined") { | |
console.log("lib defined"); |