A variant of Mike Bostock's small multiples example which, instead of resetting the domain of the y-scale every time it is used, creates a separate y-scale for each multiple.
This a version tailored for a project for UN Global Pulse.
/*CSDL Script | |
Description: Taxonomy for the global study on Post-2015 topics | |
Contact: René Clausen Nielsen (rene@unglobalpulse.org) | |
1. The 16 categories referenced below are used to monitor Twitter for the same topics as is used in the MY World survey (http://www.myworld2015.org/). | |
2. The creation of the 16 topical taxonomies was done purely by hand, having domain experts come up with lists of relevant words, whereafter common misspellings, different tenses, synonyms etc. were introduced to improve recall. Lastly, the resulting keyword sets were tested for signal vs. noise and precision improved by using logical operators. | |
3. Translations were created first as translations by native speakers using different spellings (Portuguese and Brazilian Portuguese etc.), whereafter common misspellings, different tenses, synonyms etc. were introduced to improve recall. Lastly, the resulting keyword sets were tested for signal vs. noise and precision improved by using logical operators. | |
*/ |
### Get, save and load data ### ----- | |
# temp holder file | |
# create download directory and set it | |
.exdir = '~/dir' | |
dir.create(.exdir) | |
.file = file.path(.exdir, 'MYWorld_votes_all.csv.tar.bz2') | |
# Download file | |
url = 'http://ec2-23-22-13-62.compute-1.amazonaws.com/dataset/data/MYWorld_votes_all.csv.tar.bz2' | |
download.file(url, .file) |
<!doctype HTML> | |
<html> | |
<head> | |
<link rel='stylesheet' href='http://nvd3.org/src/nv.d3.css'> | |
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script> | |
<script src='http://d3js.org/d3.v2.min.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/nv.d3.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/lib/fisheye.js' type='text/javascript'></script> | |
<!doctype HTML> | |
<html> | |
<head> | |
<link rel='stylesheet' href='http://nvd3.org/src/nv.d3.css'> | |
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script> | |
<script src='http://d3js.org/d3.v2.min.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/nv.d3.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/lib/fisheye.js' type='text/javascript'></script> | |
<!doctype HTML> | |
<html> | |
<head> | |
<link rel='stylesheet' href='http://nvd3.org/src/nv.d3.css'> | |
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'></script> | |
<script src='http://d3js.org/d3.v2.min.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/nv.d3.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/lib/fisheye.js' type='text/javascript'></script> | |
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Post-2015 Map | UN Global Pulse | CartoDB.js</title> | |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> | |
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> | |
<link rel="shortcut icon" href="http://cartodb.com/assets/favicon.ico" /> | |
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,600' rel='stylesheet' type='text/css'> | |
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" /> | |
<!--[if lte IE 8]> |
A variant of Mike Bostock's small multiples example which, instead of resetting the domain of the y-scale every time it is used, creates a separate y-scale for each multiple.
This a version tailored for a project for UN Global Pulse.
Based on a combination of Mike Bostock's World Tour, his A Bar Chart, and Justin Palmer's D3-Tip.
The visualization was created for UN Global Pulse's micro-site about Post-2015.
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"> | |
<title>Swimlane Chart</title> | |
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> | |
<link rel="stylesheet" href="style.css" type="text/css"> | |
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'> | |
</head> | |
<body> |
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> | |
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&libraries=visualization"></script> | |
<script src="http://d3js.org/d3.v3.min.js"></script> | |
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,700,300" rel='stylesheet' type='text/css'> | |
<style type="text/css"> | |
html, body, #map { |