Skip to content

Instantly share code, notes, and snippets.

@adamclerk
Created October 4, 2012 18:50
Show Gist options
  • Save adamclerk/3835614 to your computer and use it in GitHub Desktop.
Save adamclerk/3835614 to your computer and use it in GitHub Desktop.
just another inlet to tributary

No parent Inlet

{"editor_editor":{"coffee":false,"vim":false,"emacs":false,"width":599,"height":300,"hide":false},"endpoint":"tributary","public":true}
var svg = d3.select("svg");
var data1 = d3.range(144);
var columns = 12;
var size = 48;
var margin = 2;
var xplace = 130;
var yplace = 100;
var rects = svg.selectAll("rect")
.data(data1);
var colorScale = d3.scale.linear()
.domain([d3.min(data1), d3.max(data1)])
.range(["#2E1010", "#E64646"]);
rects.enter()
.append("rect")
.attr({
width:size,
height:size,
y:function(d,i){
return Math.floor(i/columns) * (size + margin) + yplace
},
x:function(d,i){
return (i % columns) * (size+margin) + xplace
},
fill:function(d,i){
return colorScale(d);
}
});
Display the source blob
Display the rendered blob
Raw
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="tributary_svg" width="837" height="1306"><rect width="48" height="48" y="100" x="130" fill="#2e1010"></rect><rect width="48" height="48" y="100" x="180" fill="#2f1010"></rect><rect width="48" height="48" y="100" x="230" fill="#311111"></rect><rect width="48" height="48" y="100" x="280" fill="#321111"></rect><rect width="48" height="48" y="100" x="330" fill="#331212"></rect><rect width="48" height="48" y="100" x="380" fill="#341212"></rect><rect width="48" height="48" y="100" x="430" fill="#361212"></rect><rect width="48" height="48" y="100" x="480" fill="#371313"></rect><rect width="48" height="48" y="100" x="530" fill="#381313"></rect><rect width="48" height="48" y="100" x="580" fill="#3a1313"></rect><rect width="48" height="48" y="100" x="630" fill="#3b1414"></rect><rect width="48" height="48" y="100" x="680" fill="#3c1414"></rect><rect width="48" height="48" y="150" x="130" fill="#3d1515"></rect><rect width="48" height="48" y="150" x="180" fill="#3f1515"></rect><rect width="48" height="48" y="150" x="230" fill="#401515"></rect><rect width="48" height="48" y="150" x="280" fill="#411616"></rect><rect width="48" height="48" y="150" x="330" fill="#431616"></rect><rect width="48" height="48" y="150" x="380" fill="#441616"></rect><rect width="48" height="48" y="150" x="430" fill="#451717"></rect><rect width="48" height="48" y="150" x="480" fill="#461717"></rect><rect width="48" height="48" y="150" x="530" fill="#481818"></rect><rect width="48" height="48" y="150" x="580" fill="#491818"></rect><rect width="48" height="48" y="150" x="630" fill="#4a1818"></rect><rect width="48" height="48" y="150" x="680" fill="#4c1919"></rect><rect width="48" height="48" y="200" x="130" fill="#4d1919"></rect><rect width="48" height="48" y="200" x="180" fill="#4e1919"></rect><rect width="48" height="48" y="200" x="230" fill="#4f1a1a"></rect><rect width="48" height="48" y="200" x="280" fill="#511a1a"></rect><rect width="48" height="48" y="200" x="330" fill="#521b1b"></rect><rect width="48" height="48" y="200" x="380" fill="#531b1b"></rect><rect width="48" height="48" y="200" x="430" fill="#551b1b"></rect><rect width="48" height="48" y="200" x="480" fill="#561c1c"></rect><rect width="48" height="48" y="200" x="530" fill="#571c1c"></rect><rect width="48" height="48" y="200" x="580" fill="#581c1c"></rect><rect width="48" height="48" y="200" x="630" fill="#5a1d1d"></rect><rect width="48" height="48" y="200" x="680" fill="#5b1d1d"></rect><rect width="48" height="48" y="250" x="130" fill="#5c1e1e"></rect><rect width="48" height="48" y="250" x="180" fill="#5e1e1e"></rect><rect width="48" height="48" y="250" x="230" fill="#5f1e1e"></rect><rect width="48" height="48" y="250" x="280" fill="#601f1f"></rect><rect width="48" height="48" y="250" x="330" fill="#611f1f"></rect><rect width="48" height="48" y="250" x="380" fill="#631f1f"></rect><rect width="48" height="48" y="250" x="430" fill="#642020"></rect><rect width="48" height="48" y="250" x="480" fill="#652020"></rect><rect width="48" height="48" y="250" x="530" fill="#672121"></rect><rect width="48" height="48" y="250" x="580" fill="#682121"></rect><rect width="48" height="48" y="250" x="630" fill="#692121"></rect><rect width="48" height="48" y="250" x="680" fill="#6a2222"></rect><rect width="48" height="48" y="300" x="130" fill="#6c2222"></rect><rect width="48" height="48" y="300" x="180" fill="#6d2323"></rect><rect width="48" height="48" y="300" x="230" fill="#6e2323"></rect><rect width="48" height="48" y="300" x="280" fill="#702323"></rect><rect width="48" height="48" y="300" x="330" fill="#712424"></rect><rect width="48" height="48" y="300" x="380" fill="#722424"></rect><rect width="48" height="48" y="300" x="430" fill="#732424"></rect><rect width="48" height="48" y="300" x="480" fill="#752525"></rect><rect width="48" height="48" y="300" x="530" fill="#762525"></rect><rect width="48" height="48" y="300" x="580" fill="#772626"></rect><rect width="48" height="48" y="300" x="630" fill="#792626"></rect><rect width="48" height="48" y="300" x="680" fill="#7a2626"></rect><rect width="48" height="48" y="350" x="130" fill="#7b2727"></rect><rect width="48" height="48" y="350" x="180" fill="#7c2727"></rect><rect width="48" height="48" y="350" x="230" fill="#7e2727"></rect><rect width="48" height="48" y="350" x="280" fill="#7f2828"></rect><rect width="48" height="48" y="350" x="330" fill="#802828"></rect><rect width="48" height="48" y="350" x="380" fill="#822929"></rect><rect width="48" height="48" y="350" x="430" fill="#832929"></rect><rect width="48" height="48" y="350" x="480" fill="#842929"></rect><rect width="48" height="48" y="350" x="530" fill="#852a2a"></rect><rect width="48" height="48" y="350" x="580" fill="#872a2a"></rect><rect width="48" height="48" y="350" x="630" fill="#882a2a"></rect><rect width="48" height="48" y="350" x="680" fill="#892b2b"></rect><rect width="48" height="48" y="400" x="130" fill="#8b2b2b"></rect><rect width="48" height="48" y="400" x="180" fill="#8c2c2c"></rect><rect width="48" height="48" y="400" x="230" fill="#8d2c2c"></rect><rect width="48" height="48" y="400" x="280" fill="#8f2c2c"></rect><rect width="48" height="48" y="400" x="330" fill="#902d2d"></rect><rect width="48" height="48" y="400" x="380" fill="#912d2d"></rect><rect width="48" height="48" y="400" x="430" fill="#922d2d"></rect><rect width="48" height="48" y="400" x="480" fill="#942e2e"></rect><rect width="48" height="48" y="400" x="530" fill="#952e2e"></rect><rect width="48" height="48" y="400" x="580" fill="#962f2f"></rect><rect width="48" height="48" y="400" x="630" fill="#982f2f"></rect><rect width="48" height="48" y="400" x="680" fill="#992f2f"></rect><rect width="48" height="48" y="450" x="130" fill="#9a3030"></rect><rect width="48" height="48" y="450" x="180" fill="#9b3030"></rect><rect width="48" height="48" y="450" x="230" fill="#9d3030"></rect><rect width="48" height="48" y="450" x="280" fill="#9e3131"></rect><rect width="48" height="48" y="450" x="330" fill="#9f3131"></rect><rect width="48" height="48" y="450" x="380" fill="#a13232"></rect><rect width="48" height="48" y="450" x="430" fill="#a23232"></rect><rect width="48" height="48" y="450" x="480" fill="#a33232"></rect><rect width="48" height="48" y="450" x="530" fill="#a43333"></rect><rect width="48" height="48" y="450" x="580" fill="#a63333"></rect><rect width="48" height="48" y="450" x="630" fill="#a73333"></rect><rect width="48" height="48" y="450" x="680" fill="#a83434"></rect><rect width="48" height="48" y="500" x="130" fill="#aa3434"></rect><rect width="48" height="48" y="500" x="180" fill="#ab3535"></rect><rect width="48" height="48" y="500" x="230" fill="#ac3535"></rect><rect width="48" height="48" y="500" x="280" fill="#ad3535"></rect><rect width="48" height="48" y="500" x="330" fill="#af3636"></rect><rect width="48" height="48" y="500" x="380" fill="#b03636"></rect><rect width="48" height="48" y="500" x="430" fill="#b13737"></rect><rect width="48" height="48" y="500" x="480" fill="#b33737"></rect><rect width="48" height="48" y="500" x="530" fill="#b43737"></rect><rect width="48" height="48" y="500" x="580" fill="#b53838"></rect><rect width="48" height="48" y="500" x="630" fill="#b63838"></rect><rect width="48" height="48" y="500" x="680" fill="#b83838"></rect><rect width="48" height="48" y="550" x="130" fill="#b93939"></rect><rect width="48" height="48" y="550" x="180" fill="#ba3939"></rect><rect width="48" height="48" y="550" x="230" fill="#bc3a3a"></rect><rect width="48" height="48" y="550" x="280" fill="#bd3a3a"></rect><rect width="48" height="48" y="550" x="330" fill="#be3a3a"></rect><rect width="48" height="48" y="550" x="380" fill="#bf3b3b"></rect><rect width="48" height="48" y="550" x="430" fill="#c13b3b"></rect><rect width="48" height="48" y="550" x="480" fill="#c23b3b"></rect><rect width="48" height="48" y="550" x="530" fill="#c33c3c"></rect><rect width="48" height="48" y="550" x="580" fill="#c53c3c"></rect><rect width="48" height="48" y="550" x="630" fill="#c63d3d"></rect><rect width="48" height="48" y="550" x="680" fill="#c73d3d"></rect><rect width="48" height="48" y="600" x="130" fill="#c83d3d"></rect><rect width="48" height="48" y="600" x="180" fill="#ca3e3e"></rect><rect width="48" height="48" y="600" x="230" fill="#cb3e3e"></rect><rect width="48" height="48" y="600" x="280" fill="#cc3e3e"></rect><rect width="48" height="48" y="600" x="330" fill="#ce3f3f"></rect><rect width="48" height="48" y="600" x="380" fill="#cf3f3f"></rect><rect width="48" height="48" y="600" x="430" fill="#d04040"></rect><rect width="48" height="48" y="600" x="480" fill="#d14040"></rect><rect width="48" height="48" y="600" x="530" fill="#d34040"></rect><rect width="48" height="48" y="600" x="580" fill="#d44141"></rect><rect width="48" height="48" y="600" x="630" fill="#d54141"></rect><rect width="48" height="48" y="600" x="680" fill="#d74141"></rect><rect width="48" height="48" y="650" x="130" fill="#d84242"></rect><rect width="48" height="48" y="650" x="180" fill="#d94242"></rect><rect width="48" height="48" y="650" x="230" fill="#da4343"></rect><rect width="48" height="48" y="650" x="280" fill="#dc4343"></rect><rect width="48" height="48" y="650" x="330" fill="#dd4343"></rect><rect width="48" height="48" y="650" x="380" fill="#de4444"></rect><rect width="48" height="48" y="650" x="430" fill="#e04444"></rect><rect width="48" height="48" y="650" x="480" fill="#e14444"></rect><rect width="48" height="48" y="650" x="530" fill="#e24545"></rect><rect width="48" height="48" y="650" x="580" fill="#e34545"></rect><rect width="48" height="48" y="650" x="630" fill="#e54646"></rect><rect width="48" height="48" y="650" x="680" fill="#e64646"></rect></svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment