Skip to content

Instantly share code, notes, and snippets.

View phoebebright's full-sized avatar

Phoebe Bright phoebebright

19 followers · 3 following
View GitHub Profile
@phoebebright
phoebebright / index.html
Created October 10, 2012 18:43
Scatter to Heatmap
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Scatter to Heatmap</title>
<script src="http://d3js.org/d3.v2.js"></script>
<script src=" https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Numans' rel='stylesheet' type='text/css'>
<style>
body {
@phoebebright
phoebebright / 3822981.iml
Created October 2, 2012 20:08
Crossfilter examples (d3)
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$" />
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
@phoebebright
phoebebright / README.mkd
Created August 30, 2012 16:25
Grouped bar

This is a reimplementation of the Grouped Bar Chart by Mike Bostock. Although useful, I found the original's minimal comments and inverted axes hard to follow, so I created the version you see here.

@phoebebright
phoebebright / index.html
Created August 30, 2012 15:46
SVG appears before transform
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<style>
body { text-align: center; margin: auto; }
p.source { font-style: italic; }
a { color: blue; }
@phoebebright
phoebebright / index.html
Created August 30, 2012 15:42
Disappearing svg in Firefox
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<style>
body { text-align: center; margin: auto; }
p.source { font-style: italic; }
a { color: blue; }
@phoebebright
phoebebright / data_project.csv
Created August 30, 2012 14:44
Treemap works in safari not firefox
id name priority who complexity planned time status outstanding variance
01/02/2012 T-024 Organisation list in directory MUST Joe Y 5 Complete 1.5
01/02/2012 T-015 Make term Commissions customisable MUST Natasha Y 6 Complete
01/02/2012 T-016 Comments popup on select rates MUST Mike Y 3 In Progress 1 0
01/02/2012 T-0169 Upgrade Centos Box MUST Joe Y 2 In Progress 2 -1 1
01/02/2012 T-013 Search in Documents on selected folder MUST Natasha Y 6 In Progress 1 0
01/02/2012 T-014 Separate Document system for LA and Legals MUST Joe Y 9 In Progress 7 3 -3
01/02/2012 T-017 Demo of Look and Feel of Documents front end MUST Natasha Y 5 In Progress 2.5 1 1
01/02/2012 T-021 Fix error where forum filename is greater than 100chars MUST Mike Y 4 Not Started 0
01/02/2012 T-025 Fix admin so structure of categories displayed MUST Mike Y 2.5 Complete 0.5
@phoebebright
phoebebright / data.csv
Last active September 26, 2023 17:59
D3 using nest on csv data
id name priority who time status
T-024 Organisation list in directory MUST Joe 5 Complete
T-015 Make term Commissions customisable MUST Natasha 6 Complete
T-016 Comments popup on select rates MUST Mike 3 In Progress
T-0169 Upgrade Centos Box MUST Joe 2 In Progress
T-013 Search in Documents on selected folder MUST Natasha 6 In Progress
T-014 Separate Document system for LA and Legals MUST Joe 9 In Progress
T-017 Demo of Look and Feel of Documents front end MUST Natasha 5 In Progress
T-021 Fix error where forum filename is greater than 100chars MUST Mike 4 Not Started
T-025 Fix admin so structure of categories displayed MUST Mike 2.5 Complete
@phoebebright
phoebebright / colorbrewer.js
Created July 17, 2012 19:15
d3 rescale axis - values to percentages and visa versa
/*
* This product includes color specifications and designs developed by Cynthia
* Brewer (http://colorbrewer.org/).
*/
var colorbrewer = {
YlGn:{3:["rgb(247,252,185)","rgb(173,221,142)","rgb(49,163,84)"],4:["rgb(255,255,204)","rgb(194,230,153)","rgb(120,198,121)","rgb(35,132,67)"],5:["rgb(255,255,204)","rgb(194,230,153)","rgb(120,198,121)","rgb(49,163,84)","rgb(0,104,55)"],6:["rgb(255,255,204)","rgb(217,240,163)","rgb(173,221,142)","rgb(120,198,121)","rgb(49,163,84)","rgb(0,104,55)"],7:["rgb(255,255,204)","rgb(217,240,163)","rgb(173,221,142)","rgb(120,198,121)","rgb(65,171,93)","rgb(35,132,67)","rgb(0,90,50)"],8:["rgb(255,255,229)","rgb(247,252,185)","rgb(217,240,163)","rgb(173,221,142)","rgb(120,198,121)","rgb(65,171,93)","rgb(35,132,67)","rgb(0,90,50)"],9:["rgb(255,255,229)","rgb(247,252,185)","rgb(217,240,163)","rgb(173,221,142)","rgb(120,198,121)","rgb(65,171,93)","rgb(35,132,67)","rgb(0,104,55)","rgb(0,69,41)"]},
YlGnBu:{3:["rgb(237,248,177)","rgb(127,205,187)","rgb(44,127,184)"],4:["rgb(255,255,204)
@phoebebright
phoebebright / index.html
Created July 12, 2012 16:57
Change data in place?
<html>
<head>
<title>D3 Rescale Example</title>
<script src="http://d3js.org/d3.v2.js"></script>
<style type="text/css">
.axis path,
.axis line {
fill: none;
@phoebebright
phoebebright / index.html
Created July 12, 2012 14:33
d3 rescale axis example
<html>
<head>
<title>D3 Axis Example</title>
<script src="http://d3js.org/d3.v2.js"></script>
</head>
<body>
<button id="rescale" onclick="rescale();">Rescale</button>
<script>
var width = 700,