index.html
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<style>
@import url(sunburst.css);
@import url(stack.css);
@import url(font-awesome.min.css);
@import url(style.css);
</style>
<script src="highlight.min.js"></script>
<script src="d3.v3.min.js"></script>
<script src="jq.js"></script>
<script src="charts.js"></script>
<script src="blur.js"></script>
</head>
<body>
<div id="slides">
<section style="padding:0px;">
<div style="position:relative;height:100%">
<div id="examples" style="filter: url('#blur');-webkit-filter: blur(20px);">
<div id="examples-deep"></div>
</div>
<div id="clicker" class="blurry" style="position:absolute;top:20px;left:20px;font-weight:500;">
<p class="blah big blue" style="background-color:rgba(255,255,255,.2);border-radius:7px;padding:15px;display:inline-block">Pushing The Community Forward</p>
<p class="blah blue medium" style="background-color:rgba(255,255,255,.2);border-radius:7px;padding:15px;display:inline-block;margin-bottom:0px">Data Visualization Group in the Bay Area</p>
<p class="blah blue medium" style="background-color:rgba(255,255,255,.2);border-radius:7px;padding:15px;display:inline-block">d3.bayarea()</p>
</div>
</div>
</section>
<section>
<p class="big blue">Combining Narrative, Model, and Information Visualization</p>
<p class="grey medium">Elijah Meeks</p>
<p class="mediumish"><i class="icon-twitter twitter"></i> @Elijah_Meeks </p>
</section>
<section>
<p class="big blue">Whatever Happened to “Augmenting Human Intellect”?</p>
<p class="grey medium">Scott Murray</p>
<p class="mediumish"><i class="icon-twitter twitter"></i> @alignedleft </p>
</section>
<section style="background:white">
<img src="stripe.svg">
</section>
<section style="background:hsla(208, 51%, 50%, 1)">
<img src="bluenose.svg" style="margin-top:200px" width="100%">
</section>
<section style="padding:0px;">
<iframe src="//visfest.com/d3unconf/"></iframe>
</section>
</div>
<script src="stack.v0.min.js"></script>
<script src="d3.v3.min.js"></script>
<script src="d3.hexbin.min.js"></script>
<script>
(function(a,b,c,d,e,f){function k(a){var b,c=a.length,e=this,f=0,g=e.i=e.j=0,h=e.S=[];for(c||(a=[c++]);d>f;)h[f]=f++;for(f=0;d>f;f++)h[f]=h[g=j&g+a[f%c]+(b=h[f])],h[g]=b;(e.g=function(a){for(var b,c=0,f=e.i,g=e.j,h=e.S;a--;)b=h[f=j&f+1],c=c*d+h[j&(h[f]=h[g=j&g+b])+(h[g]=b)];return e.i=f,e.j=g,c})(d)}function l(a,b){var e,c=[],d=(typeof a)[0];if(b&&"o"==d)for(e in a)try{c.push(l(a[e],b-1))}catch(f){}return c.length?c:"s"==d?a:a+"\0"}function m(a,b){for(var d,c=a+"",e=0;c.length>e;)b[j&e]=j&(d^=19*b[j&e])+c.charCodeAt(e++);return o(b)}function n(c){try{return a.crypto.getRandomValues(c=new Uint8Array(d)),o(c)}catch(e){return[+new Date,a,a.navigator.plugins,a.screen,o(b)]}}function o(a){return String.fromCharCode.apply(0,a)}var g=c.pow(d,e),h=c.pow(2,f),i=2*h,j=d-1;c.seedrandom=function(a,f){var j=[],p=m(l(f?[a,o(b)]:0 in arguments?a:n(),3),j),q=new k(j);return m(o(q.S),b),c.random=function(){for(var a=q.g(e),b=g,c=0;h>a;)a=(a+c)*d,b*=d,c=q.g(1);for(;a>=i;)a/=2,b/=2,c>>>=1;return(a+c)/b},p},m(c.random(),b)})(this,[],Math,256,6,52);
var data = [
{title: "Reingold–Tilford Tree (Radial)", url: "//bl.ocks.org/mbostock/4063550"},
{title: "Factorisation Diagrams", url: "//www.jasondavies.com/factorisation-diagrams/"},
{title: "Phylogenetic Tree of Life", url: "//www.jasondavies.com/tree-of-life/"},
{title: "Geographic Clipping", url: "//www.jasondavies.com/maps/clip/"},
{title: "Les Misérables Co-occurrence Matrix", url: "//bost.ocks.org/mike/miserables/"},
{title: "L*a*b* and HCL color spaces", url: "//bl.ocks.org/mbostock/3014589"},
{title: "Treemap", url: "//bl.ocks.org/mbostock/4063582"},
{title: "Map Projection Transitions", url: "//www.jasondavies.com/maps/transition/"},
{title: "Across U.S. Companies, Tax Rates Vary Greatly", url: "//www.nytimes.com/interactive/2013/05/25/sunday-review/corporate-taxes.html"},
{title: "Rotating Voronoi", url: "//bl.ocks.org/mbostock/4636377"},
{title: "Zoomable Geography", url: "//bl.ocks.org/mbostock/2374239"},
{title: "Fisheye Distortion", url: "//bost.ocks.org/mike/fisheye/"},
{title: "Geodesic Rainbow", url: "//bl.ocks.org/mbostock/3057239"},
{title: "Hierarchical Bar Chart", url: "//bl.ocks.org/mbostock/1283663"},
{title: "Exoplanets", url: "//bl.ocks.org/mbostock/3007180"},
{title: "Crossfilter", url: "//square.github.io/crossfilter/"},
{title: "Alaska’s villages on the frontline of climate change", url: "//www.guardian.co.uk/environment/interactive/2013/may/14/alaska-villages-frontline-global-warming"},
{title: "The federal health-care exchange’s abysmal success rate", url: "//www.washingtonpost.com/wp-srv/special/politics/state-vs-federal-exchanges/"},
{title: "Counties Blue and Red, Moving Right and Left", url: "//www.nytimes.com/interactive/2012/11/11/sunday-review/counties-moving.html"},
{title: "At the National Conventions, the Words They Used", url: "//www.nytimes.com/interactive/2012/09/06/us/politics/convention-word-counts.html"},
{title: "Reprojected Raster Tiles", url: "//www.jasondavies.com/maps/raster/"},
{title: "Hive Plots", url: "//bost.ocks.org/mike/hive/"},
{title: "Donut Transitions", url: "//bl.ocks.org/mbostock/4341417"},
{title: "Non-Contiguous Cartogram", url: "//bl.ocks.org/mbostock/4055908"},
{title: "Spermatozoa", url: "//bl.ocks.org/mbostock/1136236"},
{title: "Zoomable Circle Packing", url: "//bl.ocks.org/mbostock/7607535"},
{title: "Transform Transitions", url: "//bl.ocks.org/mbostock/1345853"},
{title: "Scatterplot Matrix", url: "//bl.ocks.org/mbostock/3213173"},
{title: "Janet L. Yellen, on the Economy’s Twists and Turns", url: "//www.nytimes.com/interactive/2013/10/09/us/yellen-fed-chart.html"},
{title: "Front Row to Fashion Week", url: "//www.nytimes.com/newsgraphics/2013/09/13/fashion-week-editors-picks/"},
{title: "Interrupted Sinu-Mollweide", url: "//bl.ocks.org/mbostock/4481520"},
{title: "Streamgraph", url: "//bl.ocks.org/mbostock/4060954"},
{title: "Force-Directed Graph", url: "//bl.ocks.org/mbostock/4062045"},
{title: "Zoomable Icicle", url: "//bl.ocks.org/mbostock/1005873"},
{title: "Collision Detection", url: "//bl.ocks.org/mbostock/3231298"},
{title: "Waterman Butterfly", url: "//bl.ocks.org/mbostock/4458497"},
{title: "Airocean World", url: "//www.jasondavies.com/maps/airocean/"},
{title: "Countries by Area", url: "//www.jasondavies.com/maps/countries-by-area/"},
{title: "Bilevel Partition", url: "//bl.ocks.org/mbostock/5944371"},
{title: "Map Zooming", url: "//bl.ocks.org/mbostock/6242308"},
{title: "Fisher–Yates Shuffle", url: "//bost.ocks.org/mike/shuffle/"},
{title: "Sphere Spirals", url: "//www.jasondavies.com/maps/sphere-spirals/"},
{title: "World Tour", url: "//bl.ocks.org/mbostock/4183330"},
{title: "Zoomable Treemaps", url: "//bost.ocks.org/mike/treemap/"},
{title: "Clipped Map Tiles", url: "//bl.ocks.org/mbostock/4150951"},
{title: "Cubism.js", url: "//square.github.io/cubism/"},
{title: "Voronoi Labels", url: "//bl.ocks.org/mbostock/6909318"},
{title: "Bivariate Hexbin Map", url: "//bl.ocks.org/mbostock/4330486"},
{title: "OMG Particles!", url: "//bl.ocks.org/mbostock/1062544"},
{title: "Calendar View", url: "//bl.ocks.org/mbostock/4063318"},
{title: "The Wealth & Health of Nations", url: "//bost.ocks.org/mike/nations/"},
{title: "Collapsible Tree", url: "//bl.ocks.org/mbostock/4339083"},
{title: "Hexagonal Binning", url: "//bl.ocks.org/mbostock/4248145"},
{title: "Over the Decades, How States Have Shifted", url: "//www.nytimes.com/interactive/2012/10/15/us/politics/swing-history.html"},
{title: "China Still Dominates, but Some Manufacturers Look Elsewhere", url: "//www.nytimes.com/interactive/2013/04/08/business/global/asia-map.html"},
{title: "Strikeouts on the Rise", url: "//www.nytimes.com/interactive/2013/03/29/sports/baseball/Strikeouts-Are-Still-Soaring.html?ref=baseball"},
{title: "Epicyclic Gearing", url: "//bl.ocks.org/mbostock/1353700"},
{title: "Voronoi Tessellation", url: "//bl.ocks.org/mbostock/4060366"},
{title: "The state of our union is … dumber", url: "//www.guardian.co.uk/world/interactive/2013/feb/12/state-of-the-union-reading-level"},
{title: "Chord Diagram", url: "//bl.ocks.org/mbostock/1046712"},
{title: "Floating Landmasses", url: "//bl.ocks.org/mbostock/6738360"},
{title: "How the Tax Burden Has Changed", url: "//www.nytimes.com/interactive/2012/11/30/us/tax-burden.html"},
{title: "Prime Number Patterns", url: "//www.jasondavies.com/primos/"},
{title: "Koalas to the Max", url: "//www.koalastothemax.com/"},
{title: "Constellations of Directors and Their Stars", url: "//www.nytimes.com/newsgraphics/2013/09/07/director-star-chart/"},
{title: "Drought and Deluge in the Lower 48", url: "//www.nytimes.com/interactive/2012/08/11/sunday-review/drought-history.html"},
{title: "Animated Bézier Curves", url: "//www.jasondavies.com/animated-bezier/"},
{title: "Histogram", url: "//bl.ocks.org/mbostock/3048450"},
{title: "Stacked-to-Grouped Bars", url: "//bl.ocks.org/mbostock/3943967"},
{title: "Force-Directed States of America", url: "//bl.ocks.org/mbostock/1073373"},
{title: "Faux-3D Arcs", url: "//bl.ocks.org/dwtkns/4973620"},
{title: "512 Paths to the White House", url: "//www.nytimes.com/interactive/2012/11/02/us/politics/paths-to-the-white-house.html"},
{title: "Polar Clock", url: "//bl.ocks.org/mbostock/1096355"},
{title: "Population Pyramid", url: "//bl.ocks.org/mbostock/4062085"},
{title: "The America’s Cup Finale: Oracle’s Path to Victory", url: "//www.nytimes.com/interactive/2013/09/25/sports/americas-cup-course.html"},
{title: "Rainbow Worm", url: "//bl.ocks.org/mbostock/4165404"},
{title: "Four Ways to Slice Obama’s 2013 Budget Proposal", url: "//www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html"},
{title: "Quadtree", url: "//bl.ocks.org/mbostock/4343214"},
{title: "Bubble Chart", url: "//bl.ocks.org/mbostock/4063269"},
{title: "Women as Academic Authors, 1665-2010", url: "//chronicle.com/article/Woman-as-Academic-Authors/135192/"},
{title: "Choropleth", url: "//bl.ocks.org/mbostock/4060606"},
{title: "Gilbert’s Two-World Perspective", url: "//www.jasondavies.com/maps/gilbert/"},
{title: "For Eli Manning, 150 Games and Counting", url: "//www.nytimes.com/newsgraphics/2013/09/28/eli-manning-milestone/"},
{title: "Word Tree", url: "//www.jasondavies.com/wordtree/"},
{title: "Mobile Patent Suits", url: "//bl.ocks.org/mbostock/1153292"},
{title: "Mitchell’s Best-Candidate", url: "//bl.ocks.org/mbostock/1893974"},
{title: "Sankey Diagrams", url: "//bost.ocks.org/mike/sankey/"},
{title: "van Wijk Smooth Zooming", url: "//bl.ocks.org/mbostock/3828981"},
{title: "Bryce Harper: A swing of beauty", url: "//www.washingtonpost.com/wp-srv/special/sports/bryce-harper-swing-of-beauty/"},
{title: "Dissecting a Trailer: The Parts of the Film That Make the Cut", url: "//www.nytimes.com/interactive/2013/02/19/movies/awardsseason/oscar-trailers.html"},
{title: "Violence and guns in best-selling video games", url: "//www.guardian.co.uk/world/interactive/2013/apr/30/violence-guns-best-selling-video-games"},
{title: "Hierarchical Edge Bundling", url: "//bl.ocks.org/mbostock/1044242"},
{title: "Geographic Bounding Boxes", url: "//www.jasondavies.com/maps/bounds/"},
{title: "Live Results: Massachusetts Senate Special Election", url: "//elections.huffingtonpost.com/2013/massachusetts-senate-results"},
{title: "Zoomable Map Tiles", url: "//bl.ocks.org/mbostock/4132797"},
{title: "D3 Show Reel", url: "//bl.ocks.org/mbostock/1256572"},
{title: "Building Hamiltonian Graphs from LCF Notation", url: "//christophermanning.org/projects/building-cubic-hamiltonian-graphs-from-lcf-notation/"},
{title: "Sequences sunburst", url: "//bl.ocks.org/kerryrodden/7090426"},
{title: "Azimuth and Distance from London", url: "//www.jasondavies.com/maps/azimuth-distance/"},
{title: "Parallel Sets", url: "//www.jasondavies.com/parallel-sets/"}
];
data.forEach(function(d, i) {
d.i = i % 10;
d.j = i / 10 | 0;
});
Math.seedrandom(+d3.time.hour(new Date));
d3.shuffle(data);
var height = 2000,
imageWidth = 132,
imageHeight = 152,
radius = 75,
depth = 4;
var currentFocus = [innerWidth / 2, height / 2],
desiredFocus,
idle = true;
var style = document.body.style,
transform = ("webkitTransform" in style ? "-webkit-"
: "MozTransform" in style ? "-moz-"
: "msTransform" in style ? "-ms-"
: "OTransform" in style ? "-o-"
: "") + "transform";
var hexbin = d3.hexbin()
.radius(radius);
if (!("ontouchstart" in document)) d3.select("#examples")
.on("mousemove", mousemoved);
var deep = d3.select("#examples-deep");
var canvas = deep.append("canvas")
.attr("height", height);
var context = canvas.node().getContext("2d");
var svg = deep.append("svg")
.attr("height", height);
var mesh = svg.append("path")
.attr("class", "example-mesh");
var anchor = svg.append("g")
.attr("class", "example-anchor")
.selectAll("a");
var graphic = deep.selectAll("svg,canvas");
var image = new Image;
image.src = "//d3js.org/ex.jpg?3f2d00ffdba6ced9c50f02ed42f12f6156368bd2";
image.onload = resized;
d3.select(window)
.on("resize", resized)
.each(resized);
function drawImage(d) {
context.save();
context.beginPath();
context.moveTo(0, -radius);
for (var i = 1; i < 6; ++i) {
var angle = i * Math.PI / 3,
x = Math.sin(angle) * radius,
y = -Math.cos(angle) * radius;
context.lineTo(x, y);
}
context.clip();
context.drawImage(image,
imageWidth * d.i, imageHeight * d.j,
imageWidth, imageHeight,
-imageWidth / 2, -imageHeight / 2,
imageWidth, imageHeight);
context.restore();
}
function resized() {
var deepWidth = innerWidth * (depth + 1) / depth,
deepHeight = height * (depth + 1) / depth,
centers = hexbin.size([deepWidth, deepHeight]).centers();
desiredFocus = [innerWidth / 2, height / 2];
moved();
graphic
.style("left", Math.round((innerWidth - deepWidth) / 2) + "px")
.style("top", Math.round((height - deepHeight) / 2) + "px")
.attr("width", deepWidth)
.attr("height", deepHeight);
centers.forEach(function(center, i) {
center.j = Math.round(center[1] / (radius * 1.5));
center.i = Math.round((center[0] - (center.j & 1) * radius * Math.sin(Math.PI / 3)) / (radius * 2 * Math.sin(Math.PI / 3)));
context.save();
context.translate(Math.round(center[0]), Math.round(center[1]));
drawImage(center.example = data[(center.i % 10) + ((center.j + (center.i / 10 & 1) * 5) % 10) * 10]);
context.restore();
});
mesh.attr("d", hexbin.mesh);
anchor = anchor.data(centers, function(d) { return d.i + "," + d.j; });
anchor.exit().remove();
anchor.enter().append("a")
.attr("xlink:href", function(d) { return d.example.url; })
.attr("xlink:title", function(d) { return d.example.title; })
.append("path")
.attr("d", hexbin.hexagon());
anchor
.attr("transform", function(d) { return "translate(" + d + ")"; });
}
function mousemoved() {
var m = d3.mouse(this);
desiredFocus = [
Math.round((m[0] - innerWidth / 2) / depth) * depth + innerWidth / 2,
Math.round((m[1] - height / 2) / depth) * depth + height / 2
];
moved();
}
function moved() {
if (idle) d3.timer(function() {
if (idle = Math.abs(desiredFocus[0] - currentFocus[0]) < .5 && Math.abs(desiredFocus[1] - currentFocus[1]) < .5) currentFocus = desiredFocus;
else currentFocus[0] += (desiredFocus[0] - currentFocus[0]) * .14, currentFocus[1] += (desiredFocus[1] - currentFocus[1]) * .14;
deep.style(transform, "translate(" + (innerWidth / 2 - currentFocus[0]) / depth + "px," + (height / 2 - currentFocus[1]) / depth + "px)");
return idle;
});
}
var blah = false;
d3.select("#clicker").on('click', function() {
console.log('clicking');
if (!blah) {
blah = true;
d3.select("#examples").transition().duration(1000).style('-webkit-filter', 'blur(0px)');
d3.selectAll(".blah").transition().duration(1000).style('background', 'rgba(255,255,255,1)');
} else {
blah = false;
d3.select("#examples").transition().duration(1000).style('-webkit-filter', 'blur(20px)');
d3.selectAll(".blah").transition().duration(1000).style('background', 'rgba(255,255,255,.2)');
}
});
function styleTween(transition, name, value) {
transition.styleTween(name, function() {
return d3.interpolate(this.style[name], value);
});
}
</script>
</body>
</html>
bluenose-logo.svg
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="150px" height="30px" viewBox="0 0 150 30" enable-background="new 0 0 150 30" xml:space="preserve">
<g>
<path fill="#FFFFFF" d="M28.888,9.202h5.947c1.458,0,2.485,0.365,3.165,1.044c0.464,0.464,0.746,1.077,0.746,1.872v0.033
c0,1.342-0.762,2.137-1.789,2.584c1.407,0.465,2.302,1.26,2.302,2.833v0.034c0,1.988-1.624,3.196-4.39,3.196h-5.98V9.202z
M34.04,13.824c0.978,0,1.524-0.332,1.524-1.011V12.78c0-0.63-0.497-0.994-1.458-0.994h-2.087v2.038H34.04z M34.504,18.214
c0.978,0,1.541-0.381,1.541-1.06v-0.033c0-0.63-0.497-1.044-1.574-1.044h-2.452v2.137H34.504z"/>
<path fill="#FFFFFF" d="M40.733,9.202h3.214v8.78h5.616v2.816h-8.83V9.202z"/>
<path fill="#FFFFFF" d="M50.458,15.713V9.202h3.264v6.445c0,1.673,0.844,2.469,2.136,2.469s2.138-0.763,2.138-2.387V9.202h3.263
v6.428c0,3.743-2.137,5.384-5.434,5.384C52.528,21.014,50.458,19.34,50.458,15.713z"/>
<path fill="#FFFFFF" d="M63.164,9.202h9.327v2.733h-6.146v1.757h5.565v2.534h-5.565v1.84h6.229v2.732h-9.41V9.202z"/>
<path fill="#FFFFFF" d="M74.215,9.202h2.998l4.771,6.129V9.202h3.18v11.596h-2.816l-4.953-6.362v6.362h-3.18V9.202z"/>
<path fill="#FFFFFF" d="M86.821,15.033V15c0-3.33,2.685-6.03,6.263-6.03s6.229,2.667,6.229,5.997V15c0,3.33-2.684,6.03-6.262,6.03
S86.821,18.363,86.821,15.033z M96.033,15.033V15c0-1.674-1.21-3.131-2.982-3.131c-1.756,0-2.934,1.425-2.934,3.098V15
c0,1.674,1.211,3.131,2.967,3.131C94.855,18.131,96.033,16.706,96.033,15.033z"/>
<path fill="#FFFFFF" d="M100.023,19.076l1.789-2.139c1.143,0.912,2.418,1.393,3.76,1.393c0.861,0,1.325-0.299,1.325-0.795v-0.033
c0-0.48-0.38-0.746-1.954-1.111c-2.469-0.562-4.374-1.258-4.374-3.644v-0.033c0-2.153,1.706-3.71,4.489-3.71
c1.973,0,3.513,0.53,4.771,1.541l-1.606,2.27c-1.061-0.746-2.22-1.144-3.247-1.144c-0.779,0-1.16,0.332-1.16,0.745v0.033
c0,0.53,0.398,0.763,2.004,1.128c2.668,0.579,4.324,1.441,4.324,3.61v0.033c0,2.37-1.871,3.776-4.688,3.776
C103.402,20.996,101.447,20.352,100.023,19.076z"/>
<path fill="#FFFFFF" d="M111.703,9.202h9.326v2.733h-6.146v1.757h5.566v2.534h-5.566v1.84h6.229v2.732h-9.408V9.202z"/>
</g>
<g>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="5.9585" y1="12.5879" x2="18.6074" y2="12.5879">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#94BBDE"/>
</linearGradient>
<path fill="url(#SVGID_1_)" d="M18.607,22.588H5.958c0,0,1.846-7.507,0-20C5.958,2.588,15.443,14.277,18.607,22.588z"/>
</g>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="11.7222" y1="12.3369" x2="20.9868" y2="12.3369">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#94BBDE"/>
</linearGradient>
<path fill="url(#SVGID_2_)" d="M20.987,20.98h-9.265c0,0,1.61-6.251,0-17.287C11.722,3.693,17.837,12.336,20.987,20.98z"/>
</g>
<g>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="16.144" y1="12.9395" x2="23.3979" y2="12.9395">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#94BBDE"/>
</linearGradient>
<path fill="url(#SVGID_3_)" d="M23.398,18.97h-7.254c0,0,1.309-4.441,0-12.06C16.144,6.91,21.348,14.402,23.398,18.97z"/>
</g>
</svg>
bluenose.svg
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 300 53.5" enable-background="new 0 0 300 53.5" xml:space="preserve">
<g>
<path fill="#FFFFFF" d="M59.6,18.8H75c3.8,0,6.5,0.9,8.2,2.7c1.2,1.2,1.9,2.8,1.9,4.9v0.1c0,3.5-2,5.6-4.6,6.7c3.7,1.2,6,3.3,6,7.4
v0.1c0,5.2-4.2,8.3-11.4,8.3H59.6L59.6,18.8L59.6,18.8z M72.9,30.8c2.5,0,4-0.9,4-2.6v-0.1c0-1.6-1.3-2.6-3.8-2.6h-5.4v5.3
C67.7,30.8,72.9,30.8,72.9,30.8z M74.1,42.2c2.5,0,4-1,4-2.8v-0.1c0-1.6-1.3-2.7-4.1-2.7h-6.4v5.6H74.1z"/>
<path fill="#FFFFFF" d="M90.3,18.8h8.3v22.8h14.6v7.3H90.3V18.8z"/>
<path fill="#FFFFFF" d="M115.6,35.7V18.8h8.5v16.7c0,4.3,2.2,6.4,5.5,6.4c3.4,0,5.6-2,5.6-6.2v-17h8.5v16.7c0,9.7-5.6,14-14.1,14
C121,49.5,115.6,45.1,115.6,35.7z"/>
<path fill="#FFFFFF" d="M148.6,18.8h24.2v7.1h-16v4.6h14.5V37h-14.5v4.8H173v7.1h-24.4C148.6,48.9,148.6,18.8,148.6,18.8z"/>
<path fill="#FFFFFF" d="M177.3,18.8h7.8l12.4,15.9V18.8h8.3v30.1h-7.3l-12.9-16.5v16.5h-8.3C177.3,48.9,177.3,18.8,177.3,18.8z"/>
<path fill="#FFFFFF" d="M210,33.9L210,33.9c0-8.7,7-15.7,16.3-15.7s16.2,6.9,16.2,15.6v0.1c0,8.6-7,15.7-16.3,15.7
S210,42.6,210,33.9z M234,33.9L234,33.9c0-4.4-3.1-8.2-7.7-8.2c-4.6,0-7.6,3.7-7.6,8v0.1c0,4.3,3.1,8.1,7.7,8.1
C230.9,42,234,38.3,234,33.9z"/>
<path fill="#FFFFFF" d="M244.3,44.4l4.6-5.6c3,2.4,6.3,3.6,9.8,3.6c2.2,0,3.4-0.8,3.4-2.1v-0.1c0-1.2-1-1.9-5.1-2.9
c-6.4-1.5-11.4-3.3-11.4-9.5v-0.1c0-5.6,4.4-9.6,11.7-9.6c5.1,0,9.1,1.4,12.4,4l-4.2,5.9c-2.8-1.9-5.8-3-8.4-3c-2,0-3,0.9-3,1.9
v0.1c0,1.4,1,2,5.2,2.9c6.9,1.5,11.2,3.7,11.2,9.4v0.1c0,6.2-4.9,9.8-12.2,9.8C253.1,49.4,248,47.7,244.3,44.4z"/>
<path fill="#FFFFFF" d="M274.7,18.8h24.2v7.1h-16v4.6h14.5V37h-14.5v4.8h16.2v7.1h-24.4L274.7,18.8L274.7,18.8z"/>
</g>
<g>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="3.973500e-07" y1="34.0979" x2="32.8534" y2="34.0979" gradientTransform="matrix(1 0 0 -1 0 61.6667)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#95BBDD"/>
</linearGradient>
<path fill="url(#SVGID_1_)" d="M32.9,53.5H0c0,0,4.8-19.5,0-51.9C0,1.6,24.6,32,32.9,53.5z"/>
</g>
<g>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="14.9709" y1="34.7512" x2="39.035" y2="34.7512" gradientTransform="matrix(1 0 0 -1 0 61.6667)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#95BBDD"/>
</linearGradient>
<path fill="url(#SVGID_2_)" d="M39,49.4H15c0,0,4.2-16.2,0-44.9C15,4.5,30.9,26.9,39,49.4z"/>
</g>
<g>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="26.4562" y1="33.1837" x2="45.2971" y2="33.1837" gradientTransform="matrix(1 0 0 -1 0 61.6667)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="1" style="stop-color:#95BBDD"/>
</linearGradient>
<path fill="url(#SVGID_3_)" d="M45.3,44.1H26.5c0,0,3.4-11.5,0-31.3C26.5,12.8,40,32.3,45.3,44.1z"/>
</g>
</svg>
blur.js
(function ($) {
$.fn.blurjs = function (options) {
var canvas = document.createElement('canvas');
var isCached = false;
var selector = ($(this).selector).replace(/[^a-zA-Z0-9]/g, "");
if(!canvas.getContext) {
return;
}
options = $.extend({
source: 'body',
radius: 5,
overlay: '',
offset: {
x: 0,
y: 0
},
optClass: '',
cache: false,
cacheKeyPrefix: 'blurjs-',
draggable: false,
debug: false
}, options);
var mul_table = [512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512, 454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512, 482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456, 437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512, 497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328, 320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456, 446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335, 329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512, 505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405, 399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328, 324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271, 268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456, 451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388, 385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335, 332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292, 289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
var shg_table = [9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17, 17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
function stackBlurCanvasRGB(a, b, c, d, f, g) {
if(isNaN(g) || g < 1) return;
g |= 0;
var h = a.getContext("2d");
var j;
try {
try {
j = h.getImageData(b, c, d, f)
} catch(e) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
j = h.getImageData(b, c, d, f)
} catch(e) {
alert("Cannot access local image");
throw new Error("unable to access local image data: " + e);
}
}
} catch(e) {
alert("Cannot access image");
throw new Error("unable to access image data: " + e);
}
var k = j.data;
var x, y, i, p, yp, yi, yw, r_sum, g_sum, b_sum, r_out_sum, g_out_sum, b_out_sum, r_in_sum, g_in_sum, b_in_sum, pr, pg, pb, rbs;
var l = g + g + 1;
var m = d << 2;
var n = d - 1;
var o = f - 1;
var q = g + 1;
var r = q * (q + 1) / 2;
var s = new BlurStack();
var t = s;
for(i = 1; i < l; i++) {
t = t.next = new BlurStack();
if(i == q) var u = t
}
t.next = s;
var v = null;
var w = null;
yw = yi = 0;
var z = mul_table[g];
var A = shg_table[g];
for(y = 0; y < f; y++) {
r_in_sum = g_in_sum = b_in_sum = r_sum = g_sum = b_sum = 0;
r_out_sum = q * (pr = k[yi]);
g_out_sum = q * (pg = k[yi + 1]);
b_out_sum = q * (pb = k[yi + 2]);
r_sum += r * pr;
g_sum += r * pg;
b_sum += r * pb;
t = s;
for(i = 0; i < q; i++) {
t.r = pr;
t.g = pg;
t.b = pb;
t = t.next
}
for(i = 1; i < q; i++) {
p = yi + ((n < i ? n : i) << 2);
r_sum += (t.r = (pr = k[p])) * (rbs = q - i);
g_sum += (t.g = (pg = k[p + 1])) * rbs;
b_sum += (t.b = (pb = k[p + 2])) * rbs;
r_in_sum += pr;
g_in_sum += pg;
b_in_sum += pb;
t = t.next
}
v = s;
w = u;
for(x = 0; x < d; x++) {
k[yi] = (r_sum * z) >> A;
k[yi + 1] = (g_sum * z) >> A;
k[yi + 2] = (b_sum * z) >> A;
r_sum -= r_out_sum;
g_sum -= g_out_sum;
b_sum -= b_out_sum;
r_out_sum -= v.r;
g_out_sum -= v.g;
b_out_sum -= v.b;
p = (yw + ((p = x + g + 1) < n ? p : n)) << 2;
r_in_sum += (v.r = k[p]);
g_in_sum += (v.g = k[p + 1]);
b_in_sum += (v.b = k[p + 2]);
r_sum += r_in_sum;
g_sum += g_in_sum;
b_sum += b_in_sum;
v = v.next;
r_out_sum += (pr = w.r);
g_out_sum += (pg = w.g);
b_out_sum += (pb = w.b);
r_in_sum -= pr;
g_in_sum -= pg;
b_in_sum -= pb;
w = w.next;
yi += 4
}
yw += d
}
for(x = 0; x < d; x++) {
g_in_sum = b_in_sum = r_in_sum = g_sum = b_sum = r_sum = 0;
yi = x << 2;
r_out_sum = q * (pr = k[yi]);
g_out_sum = q * (pg = k[yi + 1]);
b_out_sum = q * (pb = k[yi + 2]);
r_sum += r * pr;
g_sum += r * pg;
b_sum += r * pb;
t = s;
for(i = 0; i < q; i++) {
t.r = pr;
t.g = pg;
t.b = pb;
t = t.next
}
yp = d;
for(i = 1; i <= g; i++) {
yi = (yp + x) << 2;
r_sum += (t.r = (pr = k[yi])) * (rbs = q - i);
g_sum += (t.g = (pg = k[yi + 1])) * rbs;
b_sum += (t.b = (pb = k[yi + 2])) * rbs;
r_in_sum += pr;
g_in_sum += pg;
b_in_sum += pb;
t = t.next;
if(i < o) {
yp += d
}
}
yi = x;
v = s;
w = u;
for(y = 0; y < f; y++) {
p = yi << 2;
k[p] = (r_sum * z) >> A;
k[p + 1] = (g_sum * z) >> A;
k[p + 2] = (b_sum * z) >> A;
r_sum -= r_out_sum;
g_sum -= g_out_sum;
b_sum -= b_out_sum;
r_out_sum -= v.r;
g_out_sum -= v.g;
b_out_sum -= v.b;
p = (x + (((p = y + q) < o ? p : o) * d)) << 2;
r_sum += (r_in_sum += (v.r = k[p]));
g_sum += (g_in_sum += (v.g = k[p + 1]));
b_sum += (b_in_sum += (v.b = k[p + 2]));
v = v.next;
r_out_sum += (pr = w.r);
g_out_sum += (pg = w.g);
b_out_sum += (pb = w.b);
r_in_sum -= pr;
g_in_sum -= pg;
b_in_sum -= pb;
w = w.next;
yi += d
}
}
h.putImageData(j, b, c)
}
function BlurStack() {
this.r = 0;
this.g = 0;
this.b = 0;
this.a = 0;
this.next = null
}
return this.each(function () {
var $glue = $(this);
var $source = $(options.source);
var formattedSource = ($source.css('backgroundImage')).replace(/"/g, "").replace(/url\(|\)$/ig, "");
ctx = canvas.getContext('2d');
tempImg = new Image();
tempImg.onload = function () {
if(!isCached) {
canvas.style.display = "none";
canvas.width = tempImg.width;
canvas.height = tempImg.height;
ctx.drawImage(tempImg, 0, 0);
stackBlurCanvasRGB(canvas, 0, 0, canvas.width, canvas.height, options.radius);
if(options.overlay != false) {
ctx.beginPath();
ctx.rect(0, 0, tempImg.width, tempImg.width);
ctx.fillStyle = options.overlay;
ctx.fill();
}
var blurredData = canvas.toDataURL();
if(options.cache) {
try {
if(options.debug) {
console.log('Cache Set');
}
localStorage.setItem(options.cacheKeyPrefix + selector + '-' + formattedSource + '-data-image', blurredData);
} catch(e) {
console.log(e);
}
}
} else {
var blurredData = tempImg.src;
}
var attachment = $source.css('backgroundAttachment');
var position = (attachment == 'fixed') ? '' : '-' + (($glue.offset().left) - ($source.offset().left) - (options.offset.x)) + 'px -' + (($glue.offset().top) - ($source.offset().top) - (options.offset.y)) + 'px';
$glue.css({
'background-image': 'url("' + blurredData + '")',
'background-repeat': $source.css('backgroundRepeat'),
'background-position': position,
'background-attachment': attachment
});
if(options.optClass != false) {
$glue.addClass(options.optClass);
}
if(options.draggable) {
$glue.css({
'background-attachment': 'fixed',
'background-position': '0 0'
});
$glue.draggable();
}
};
Storage.prototype.cacheChecksum = function (opts) {
var newData = '';
for(var key in opts) {
var obj = opts[key];
if(obj.toString() == '[object Object]') {
newData += ((obj.x).toString() + (obj.y).toString() + ",").replace(/[^a-zA-Z0-9]/g, "");
} else {
newData += (obj + ",").replace(/[^a-zA-Z0-9]/g, "");
}
}
var originalData = this.getItem(options.cacheKeyPrefix + selector + '-' + formattedSource + '-options-cache');
if(originalData != newData) {
this.removeItem(options.cacheKeyPrefix + selector + '-' + formattedSource + '-options-cache');
this.setItem(options.cacheKeyPrefix + selector + '-' + formattedSource + '-options-cache', newData);
if(options.debug) {
console.log('Settings Changed, Cache Emptied');
}
}
};
var cachedData = null;
if(options.cache) {
localStorage.cacheChecksum(options);
cachedData = localStorage.getItem(options.cacheKeyPrefix + selector + '-' + formattedSource + '-data-image');
}
if(cachedData != null) {
if(options.debug) {
console.log('Cache Used');
}
isCached = true;
tempImg.src = (cachedData);
} else {
if(options.debug) {
console.log('Source Used');
}
tempImg.src = formattedSource;
}
});
};
})(jQuery);
bootstrap.css
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
audio,
canvas,
video {
display: inline-block;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden] {
display: none;
}
html {
font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
body {
margin: 0;
}
a:focus {
outline: thin dotted;
}
a:active,
a:hover {
outline: 0;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
mark {
background: #ff0;
color: #000;
}
code,
kbd,
pre,
samp {
font-family: monospace, serif;
font-size: 1em;
}
pre {
white-space: pre-wrap;
}
q {
quotes: "\201C" "\201D" "\2018" "\2019";
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
figure {
margin: 0;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0;
padding: 0;
}
button,
input,
select,
textarea {
font-family: inherit;
font-size: 100%;
margin: 0;
}
button,
input {
line-height: normal;
}
button,
select {
text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled],
html input[disabled] {
cursor: default;
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="search"] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
vertical-align: top;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html {
font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.428571429;
color: #333333;
background-color: #ffffff;
}
input,
button,
select,
textarea {
font-family: inherit;
font-size: inherit;
line-height: inherit;
}
button,
input,
select[multiple],
textarea {
background-image: none;
}
a {
color: #428bca;
text-decoration: none;
}
a:hover,
a:focus {
color: #2a6496;
text-decoration: underline;
}
a:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
img {
vertical-align: middle;
}
.img-responsive {
display: block;
max-width: 100%;
height: auto;
}
.img-rounded {
border-radius: 6px;
}
.img-thumbnail {
padding: 4px;
line-height: 1.428571429;
background-color: #ffffff;
border: 1px solid #dddddd;
border-radius: 4px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
display: inline-block;
max-width: 100%;
height: auto;
}
.img-circle {
border-radius: 50%;
}
hr {
margin-top: 20px;
margin-bottom: 20px;
border: 0;
border-top: 1px solid #eeeeee;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0 0 0 0);
border: 0;
}
.nav {
margin-bottom: 0;
padding-left: 0;
list-style: none;
}
.nav:before,
.nav:after {
content: " ";
display: table;
}
.nav:after {
clear: both;
}
.nav > li {
position: relative;
display: block;
}
.nav > li > a {
position: relative;
display: block;
padding: 10px 15px;
}
.nav > li > a:hover,
.nav > li > a:focus {
text-decoration: none;
background-color: #eeeeee;
}
.nav > li.disabled > a {
color: #999999;
}
.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
color: #999999;
text-decoration: none;
background-color: transparent;
cursor: not-allowed;
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
background-color: #eeeeee;
border-color: #428bca;
}
.nav .nav-divider {
height: 1px;
margin: 9px 0;
overflow: hidden;
background-color: #e5e5e5;
}
.nav > li > a > img {
max-width: none;
}
.nav-tabs {
border-bottom: 1px solid #dddddd;
}
.nav-tabs > li {
float: left;
margin-bottom: -1px;
}
.nav-tabs > li > a {
margin-right: 2px;
line-height: 1.428571429;
border: 1px solid transparent;
border-radius: 4px 4px 0 0;
}
.nav-tabs > li > a:hover {
border-color: #eeeeee #eeeeee #dddddd;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
color: #555555;
background-color: #ffffff;
border: 1px solid #dddddd;
border-bottom-color: transparent;
cursor: default;
}
.nav-tabs.nav-justified {
width: 100%;
border-bottom: 0;
}
.nav-tabs.nav-justified > li {
float: none;
}
.nav-tabs.nav-justified > li > a {
text-align: center;
}
@media (min-width: 768px) {
.nav-tabs.nav-justified > li {
display: table-cell;
width: 1%;
}
}
.nav-tabs.nav-justified > li > a {
border-bottom: 1px solid #dddddd;
margin-right: 0;
}
.nav-tabs.nav-justified > .active > a {
border-bottom-color: #ffffff;
}
.nav-pills > li {
float: left;
}
.nav-pills > li > a {
border-radius: 5px;
}
.nav-pills > li + li {
margin-left: 2px;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
color: #ffffff;
background-color: #428bca;
}
.nav-stacked > li {
float: none;
}
.nav-stacked > li + li {
margin-top: 2px;
margin-left: 0;
}
.nav-justified {
width: 100%;
}
.nav-justified > li {
float: none;
}
.nav-justified > li > a {
text-align: center;
}
@media (min-width: 768px) {
.nav-justified > li {
display: table-cell;
width: 1%;
}
}
.nav-tabs-justified {
border-bottom: 0;
}
.nav-tabs-justified > li > a {
border-bottom: 1px solid #dddddd;
margin-right: 0;
}
.nav-tabs-justified > .active > a {
border-bottom-color: #ffffff;
}
.tabbable:before,
.tabbable:after {
content: " ";
display: table;
}
.tabbable:after {
clear: both;
}
.tab-content > .tab-pane,
.pill-content > .pill-pane {
display: none;
}
.tab-content > .active,
.pill-content > .active {
display: block;
}
.nav .caret {
border-top-color: #428bca;
border-bottom-color: #428bca;
}
.nav a:hover .caret {
border-top-color: #2a6496;
border-bottom-color: #2a6496;
}
.nav-tabs .dropdown-menu {
margin-top: -1px;
border-top-right-radius: 0;
border-top-left-radius: 0;
}
charts.js
var charts = {};
charts.bar = function() {
var margin = {top: 20, bottom: 20, left: 0, right: 0},
width = 400,
height = 400,
xValue = function(d) { return d.x; },
yValue = function(d) { return d.y; },
brush = d3.svg.brush(),
xAxis = d3.svg.axis().orient('bottom'),
yAxis = d3.svg.axis().orient('left'),
x = d3.scale.ordinal(),
y = d3.scale.linear(),
elastic = {
margin: true,
x: true,
y: true
},
convertData = true,
duration = 500,
formatNumber = d3.format(',d');
function render(selection) {
selection.each(function(data) {
if (elastic.margin) margin.left = formatNumber(d3.max(data, function(d) { return d.y; })).length * 15;
var w = width - margin.left - margin.right,
h = height - margin.top - margin.bottom;
if (convertData) {
data = data.map(function(d, i) {
return {
x: xValue.call(data, d, i),
y: yValue.call(data, d, i)
};
});
}
if (elastic.x) x.domain(data.map(function(d) { return d.x; }));
if (elastic.y) y.domain([0, d3.max(data, function(d) { return d.y; })]);
x.rangeRoundBands([0, w], .1);
y.range([h, 0]);
xAxis.scale(x);
yAxis.scale(y);
brush.x(x)
.on('brushstart.chart', brushstart)
.on('brush.chart', brushmove)
.on('brushend.chart', brushend);
brush.clear();
var svg = selection.selectAll('svg').data([data]),
chartEnter = svg.enter().append('svg')
.append('g')
.attr('width', w)
.attr('height', h)
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
.classed('chart', true),
chart = svg.select('.chart');
chartEnter.append('g')
.classed('x axis', true)
.attr('transform', 'translate(' + 0 + ',' + h + ')');
chartEnter.append('g')
.classed('y axis', true)
chartEnter.append('g').classed('barGroup', true);
chart.selectAll('.brush').remove();
chart.selectAll('.selected').classed('selected', false);
chart.append('g')
.classed('brush', true)
.call(brush)
.selectAll('rect')
.attr('height', h);
bars = chart.select('.barGroup').selectAll('.bar').data(data);
bars.enter()
.append('rect')
.classed('bar', true)
.attr('x', w)
.attr('width', x.rangeBand())
.attr('y', function(d, i) { return y(d.y); })
.attr('height', function(d, i) { return h - y(d.y); });
bars.transition()
.duration(duration)
.style('opacity', 1)
.attr('width', x.rangeBand())
.attr('x', function(d, i) { return x(d.x); })
.attr('y', function(d, i) { return y(d.y); })
.attr('height', function(d, i) { return h - y(d.y); });
bars.exit()
.transition()
.duration(duration)
.style('opacity', 0)
.remove();
chart.select('.x.axis')
.transition()
.duration(duration)
.call(xAxis);
chart.select('.y.axis')
.transition()
.duration(duration)
.call(yAxis);
function brushstart() {
chart.classed("selecting", true);
}
function brushmove() {
var extent = d3.event.target.extent();
selection.selectAll('.bar').classed("selected", function(d) { return extent[0] <= x(d.x) && x(d.x) + x.rangeBand() <= extent[1]; });
}
function brushend() {
chart.classed("selecting", !d3.event.target.empty());
}
});
}
render.margin = function(_) {
if (!arguments.length) return margin;
margin = _;
return render;
};
render.width = function(_) {
if (!arguments.length) return width;
width = _;
return render;
};
render.height = function(_) {
if (!arguments.length) return height;
height = _;
return render;
};
render.xValue = function(_) {
if (!arguments.length) return xValue;
xValue = _;
return render;
};
render.yValue = function(_) {
if (!arguments.length) return yValue;
yValue = _;
return render;
};
render.brush = function(_) {
if (!arguments.length) return brush;
brush = _;
return render;
};
render.xAxis = function(_) {
if (!arguments.length) return xAxis;
xAxis = _;
return render;
};
render.yAxis = function(_) {
if (!arguments.length) return yAxis;
yAxis = _;
return render;
};
render.x = function(_) {
if (!arguments.length) return x;
x = _;
return render;
};
render.y = function(_) {
if (!arguments.length) return y;
y = _;
return render;
};
render.elastic = function(_) {
if (!arguments.length) return elastic;
elastic = _;
return render;
};
render.convertData = function(_) {
if (!arguments.length) return convertData;
convertData = _;
return render;
};
render.duration = function(_) {
if (!arguments.length) return duration;
duration = _;
return render;
};
render.formatNumber = function(_) {
if (!arguments.length) return formatNumber;
formatNumber = _;
return render;
};
return d3.rebind(render, brush, 'on');
};
charts.graph = function() {
var width = 800,
height = 600,
margin = {top: 0, bottom: 0, left: 0, right: 0},
colors = d3.scale.category20c(),
r = d3.scale.sqrt(),
x = d3.scale.ordinal(),
y = d3.scale.ordinal(),
nodesValue = function(d) { return d.nodes; },
linksValue = function(d) { return d.links; },
rValue = function(d) { return d.radius; },
xConstraintValue = function(d) { return d.xConstraint; },
yConstraintValue = function(d) { return d.yConstraint; },
colorValue = function(d) { return d.color; },
nameValue = function(d) { return d.name; },
typeValue = function(d) { return d.type; },
sourceValue = function(d) { return d.source; },
targetValue = function(d) { return d.target; },
distanceValue = function(d) { return d.value; },
linkTypeValue = function(d) { return d.type; }
force = d3.layout.force(),
outline = 0,
padding = {
collision: 5,
y: .5,
x: .5,
},
constraints = {
x: false,
y: false,
collisions: false,
bounding: false,
},
elastic = {
x: false,
y: false
},
duration = 500;
function render(selection) {
selection.each(function(data) {
var w = width - margin.left - margin.right,
h = height - margin.top - margin.bottom;
var domain;
if (elastic.x) {
domain = d3.set(force.nodes().map(function(d, i) { return d.xConst; })).values();
x.domain(domain);
}
x.rangeRoundBands([0, w], padding.x);
if (elastic.y) {
domain = d3.set(force.nodes().map(function(d, i) { return d.yConst; })).values();
y.domain(domain);
}
y.rangeRoundBands([0, h], padding.y);
force
.size([w, h]);
force.start();
var svg = d3.select(this).selectAll('svg').data([data]),
svgEnter = svg.enter().append('svg');
svgEnter.append('g')
.classed('nodes', true);
svgEnter.append('g')
.classed('links', true);
svgEnter.append('defs');
svg.attr('width', w)
.attr('height', h);
svg.select('defs').selectAll("marker")
.data(d3.set(force.links().map(function(d, i) { return d.type; })).values())
.enter()
.append("svg:marker")
.attr("id", function(d) { return d; })
.attr("viewBox", "0 -5 10 10")
.attr("refX", 5)
.attr("refY", 0)
.attr("markerWidth", 4)
.attr("markerHeight", 4)
.attr("orient", "auto")
.append("svg:path")
.attr("d", "M0,-5L10,0L0,5");
var link = d3.select('.links').selectAll('.link'),
links = link.data(force.links());
links.enter()
.append("path")
.attr('class', function(d) { return 'link ' + d.type; })
.attr("marker-end", function(d) { return "url(#" + d.type + ")"; });
var node = d3.select('.nodes').selectAll('.node'),
nodes = node.data(force.nodes()),
nodesEnter = nodes.enter()
.append('g')
.attr('class', function(d) { return 'node ' + d.type; })
nodesEnter.append('circle')
.attr('r', function(d) { return r(d.r); })
.style('fill', function(d) { return colors(d.color) || 'steelblue'; })
.style('stroke', function(d) { return d3.rgb(colors(d.color)).darker(outline) || 'orange'; });
nodesEnter.append("text")
.attr("dx", function(d) { return r(d.r); })
.attr("dy", ".35em")
.text(function(d) { return d.name });
nodes.call(force.drag);
nodes.exit()
.transition()
.duration(duration)
.attr('r', 0)
.style('opacity', 0)
.remove();
force.on("tick", function(e) {
links.attr("d", function(d) {
var currLink = linkPosition(d),
dx = currLink.target.x - currLink.source.x,
dy = currLink.target.y - currLink.source.y,
dr = Math.sqrt(dx * dx + dy * dy);
return "M" + currLink.source.x + "," + currLink.source.y +
"A" + dr + "," + dr +
" 0 0,1 " + currLink.target.x + "," + currLink.target.y;
});
var q,
k = e.alpha * .1,
i = -1,
currentNode = force.nodes()[i],
n = force.nodes().length;
if (constraints.collisions) q = d3.geom.quadtree(force.nodes());
while (++i < n) {
currentNode = force.nodes()[i];
if (constraints.y) {
if (currentNode.yConst === 'Frontend') console.log(y(currentNode.yConst))
currentNode.y += (y(currentNode.yConst) - currentNode.y)*k;
}
if (constraints.x) currentNode.x += (x(currentNode.xConst) - currentNode.x) * k;
if (constraints.collisions) q.visit(collide(currentNode));
}
if (constraints.bounding) {
nodes.attr("transform", function(d) {
d.x = Math.max(d.r, Math.min(w - d.r, d.x));
d.y = Math.max(d.r, Math.min(h - d.r, d.y));
return "translate(" + d.x + "," + d.y + ")";
});
} else {
nodes.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
}
});
function linkPosition(d) {
var tRadius = r(d.target.r),
sRadius = r(d.source.r),
a = Math.abs(d.target.x - d.source.x),
b = Math.abs(d.target.y - d.source.y),
c = Math.sqrt(a * a + b * b),
tθ = Math.acos((a * a - (b * b + c * c))/(2*b*c)),
sθ = Math.asin(Math.sin(tθ)*(b/a)),
sdx = sRadius*Math.sin(tθ)/Math.sin(90),
sdy = sRadius*Math.sin(sθ)/Math.sin(90),
tdx = tRadius*Math.sin(sθ)/Math.sin(90),
tdy = tRadius*Math.sin(tθ)/Math.sin(90);
if (isNaN(sθ)) console.log('t:', tθ, 's:', Math.sin(tθ)*(b/a).toFixed(2));
return {
source: {
x: (d.target.x > d.source.x)?(d.source.x + sdx):(d.source.x - sdx),
y: (d.target.y > d.source.y)?(d.source.y + sdy):(d.source.y - sdy)
},
target: {
x: (d.source.x > d.target.x)?(d.target.x + sdx):(d.target.x - sdx),
y: (d.source.y > d.target.y)?(d.target.y + sdy):(d.target.y - sdy)
}
};
}
function collide(node) {
var radius = r(node.r) + padding.collision,
nx1 = node.x - radius,
nx2 = node.x + radius,
ny1 = node.y - radius,
ny2 = node.y + radius;
return function(quad, x1, y1, x2, y2) {
if (quad.point && (quad.point !== node)) {
var x = node.x - quad.point.x,
y = node.y - quad.point.y,
l = Math.sqrt(x * x + y * y),
radius = r(node.r) + r(quad.point.r) + padding.collision;
if (l < radius) {
l = (l - radius) / l * .5;
node.x -= x *= l;
node.y -= y *= l;
quad.point.x += x;
quad.point.y += y;
}
}
return x1 > nx2
|| x2 < nx1
|| y1 > ny2
|| y2 < ny1;
}
}
});
}
render.width = function(_) {
if (!arguments.length) return width;
width = _;
return render;
};
render.height = function(_) {
if (!arguments.length) return height;
height = _;
return render;
};
render.margin = function(_) {
if (!arguments.length) return margin;
margin = _;
return render;
}
render.colors = function(_) {
if (!arguments.length) return colors;
colors = _;
return render;
};
render.r = function(_) {
if (!arguments.length) return r;
r = _;
return render;
};
render.x = function(_) {
if (!arguments.length) return x;
x = _;
return render;
};
render.y = function(_) {
if (!arguments.length) return y;
y = _;
return render;
};
render.colorValue = function(_) {
if (!arguments.length) return colorValue;
colorValue = d3.functor(_);
return render;
};
render.rValue = function(_) {
if (!arguments.length) return rValue;
rValue = d3.functor(_);
return render;
};
render.xConstraintValue = function(_) {
if (!arguments.length) return xConstraintValue;
xConstraintValue = d3.functor(_);
return render;
};
render.yConstraintValue = function(_) {
if (!arguments.length) return yConstraintValue;
yConstraintValue = d3.functor(_);
return render;
};
render.nameValue = function(_) {
if (!arguments.length) return nameValue;
nameValue = d3.functor(_);
return render;
};
render.typeValue = function(_) {
if (!arguments.length) return typeValue;
typeValue = d3.functor(_);
return render;
};
render.nodesValue = function(_) {
if (!arguments.length) return nodesValue;
nodesValue = d3.functor(_);
return render;
};
render.linksValue = function(_) {
if (!arguments.length) return linksValue;
linksValue = d3.functor(_);
return render;
};
render.sourceValue = function(_) {
if (!arguments.length) return sourceValue;
sourceValue = d3.functor(_);
return render;
};
render.targetValue = function(_) {
if (!arguments.length) return targetValue;
targetValue = d3.functor(_);
return render;
};
render.distanceValue = function(_) {
if (!arguments.length) return distanceValue;
distanceValue = d3.functor(_);
return render;
};
render.force = function(_) {
if (!arguments.length) return force;
force = _;
return render;
};
render.data = function(data) {
var tData = {},
nData = nodesValue(data),
lData = linksValue(data);
tData.nodes = nData.map(function(d, i) {
return {
r: r(rValue.call(nData, d, i)),
xConst: xConstraintValue.call(nData, d, i),
yConst: yConstraintValue.call(nData, d, i),
color: colorValue.call(nData, d, i),
name: nameValue.call(nData, d, i),
type: typeValue.call(nData, d, i),
};
});
tData.links = lData.map(function(d, i) {
return {
source: sourceValue.call(lData, d, i),
target: targetValue.call(lData, d, i),
value: distanceValue.call(lData, d, i),
type: linkTypeValue.call(lData, d, i),
};
});
data = tData;
force
.nodes(data.nodes)
.links(data.links)
};
render.push = function(type, d) {
if (type === 'node') {
force.nodes().push({
r: r(rValue(d)),
xConst: xConstraintValue(d),
yConst: yConstraintValue(d),
color: colorValue(d),
name: nameValue(d),
type: typeValue(d),
});
} else if (type === 'link') {
force.links().push({
source: sourceValue(d),
target: targetValue(d),
value: distanceValue(d),
type: linkTypeValue(d),
});
}
}
render.outline = function(_) {
if (!arguments.length) return outline;
outline = _;
return render;
};
render.duration = function(_) {
if (!arguments.length) return duration;
duration = _;
return render;
};
render.constraints = function(_) {
if (!arguments.length) return constraints;
constraints = _;
return render;
};
render.padding = function(_) {
if (!arguments.length) return padding;
padding = _;
return render;
};
return render;
};
crossfilter.min.js
!function(r){function n(r){return r}function t(r,n){for(var t=0,e=n.length,u=Array(e);e>t;++t)u[t]=r[n[t]];return u}function e(r){function n(n,t,e,u){for(;u>e;){var f=e+u>>>1;r(n[f])<t?e=f+1:u=f}return e}function t(n,t,e,u){for(;u>e;){var f=e+u>>>1;t<r(n[f])?u=f:e=f+1}return e}return t.right=t,t.left=n,t}function u(r){function n(r,n,t){for(var u=t-n,f=(u>>>1)+1;--f>0;)e(r,f,u,n);return r}function t(r,n,t){for(var u,f=t-n;--f>0;)u=r[n],r[n]=r[n+f],r[n+f]=u,e(r,1,f,n);return r}function e(n,t,e,u){for(var f,o=n[--u+t],i=r(o);(f=t<<1)<=e&&(e>f&&r(n[u+f])>r(n[u+f+1])&&f++,!(i<=r(n[u+f])));)n[u+t]=n[u+f],t=f;n[u+t]=o}return n.sort=t,n}function f(r){function n(n,e,u,f){var o,i,a,c,l=Array(f=Math.min(u-e,f));for(i=0;f>i;++i)l[i]=n[e++];if(t(l,0,f),u>e){o=r(l[0]);do(a=r(c=n[e])>o)&&(l[0]=c,o=r(t(l,0,f)[0]));while(++e<u)}return l}var t=u(r);return n}function o(r){function n(n,t,e){for(var u=t+1;e>u;++u){for(var f=u,o=n[u],i=r(o);f>t&&r(n[f-1])>i;--f)n[f]=n[f-1];n[f]=o}return n}return n}function i(r){function n(r,n,u){return(U>u-n?e:t)(r,n,u)}function t(t,e,u){var f,o=0|(u-e)/6,i=e+o,a=u-1-o,c=e+u-1>>1,l=c-o,v=c+o,s=t[i],h=r(s),p=t[l],d=r(p),g=t[c],y=r(g),m=t[v],b=r(m),x=t[a],A=r(x);h>d&&(f=s,s=p,p=f,f=h,h=d,d=f),b>A&&(f=m,m=x,x=f,f=b,b=A,A=f),h>y&&(f=s,s=g,g=f,f=h,h=y,y=f),d>y&&(f=p,p=g,g=f,f=d,d=y,y=f),h>b&&(f=s,s=m,m=f,f=h,h=b,b=f),y>b&&(f=g,g=m,m=f,f=y,y=b,b=f),d>A&&(f=p,p=x,x=f,f=d,d=A,A=f),d>y&&(f=p,p=g,g=f,f=d,d=y,y=f),b>A&&(f=m,m=x,x=f,f=b,b=A,A=f);var k=p,O=d,E=m,w=b;t[i]=s,t[l]=t[e],t[c]=g,t[v]=t[u-1],t[a]=x;var M=e+1,U=u-2,z=w>=O&&O>=w;if(z)for(var N=M;U>=N;++N){var C=t[N],S=r(C);if(O>S)N!==M&&(t[N]=t[M],t[M]=C),++M;else if(S>O)for(;;){var q=r(t[U]);{if(!(q>O)){if(O>q){t[N]=t[M],t[M++]=t[U],t[U--]=C;break}t[N]=t[U],t[U--]=C;break}U--}}}else for(var N=M;U>=N;N++){var C=t[N],S=r(C);if(O>S)N!==M&&(t[N]=t[M],t[M]=C),++M;else if(S>w)for(;;){var q=r(t[U]);{if(!(q>w)){O>q?(t[N]=t[M],t[M++]=t[U],t[U--]=C):(t[N]=t[U],t[U--]=C);break}if(U--,N>U)break}}}if(t[e]=t[M-1],t[M-1]=k,t[u-1]=t[U+1],t[U+1]=E,n(t,e,M-1),n(t,U+2,u),z)return t;if(i>M&&U>a){for(var F,q;(F=r(t[M]))<=O&&F>=O;)++M;for(;(q=r(t[U]))<=w&&q>=w;)--U;for(var N=M;U>=N;N++){var C=t[N],S=r(C);if(O>=S&&S>=O)N!==M&&(t[N]=t[M],t[M]=C),M++;else if(w>=S&&S>=w)for(;;){var q=r(t[U]);{if(!(w>=q&&q>=w)){O>q?(t[N]=t[M],t[M++]=t[U],t[U--]=C):(t[N]=t[U],t[U--]=C);break}if(U--,N>U)break}}}}return n(t,M,U+1)}var e=o(r);return n}function a(r){return Array(r)}function c(r,n){return function(t){var e=t.length;return[r.left(t,n,0,e),r.right(t,n,0,e)]}}function l(r,n){var t=n[0],e=n[1];return function(n){var u=n.length;return[r.left(n,t,0,u),r.left(n,e,0,u)]}}function v(r){return[0,r.length]}function s(){return null}function h(){return 0}function p(r){return r+1}function d(r){return r-1}function g(r){return function(n,t){return n+ +r(t)}}function y(r){return function(n,t){return n-r(t)}}function m(){function r(r){var n=w,t=r.length;return t&&(E=E.concat(r),N=S(N,w+=t),F.forEach(function(e){e(r,n,t)})),O}function e(){for(var r=b(w,w),n=[],t=0,e=0;w>t;++t)N[t]?r[t]=e++:n.push(t);C.forEach(function(r){r(0,[],n)}),R.forEach(function(n){n(r)});for(var u,t=0,e=0;w>t;++t)(u=N[t])&&(t!==e&&(N[e]=u,E[e]=E[t]),++e);for(E.length=e;w>e;)N[--w]=0}function o(r){function e(n,e,u){T=n.map(r),V=$(x(u),0,u),T=t(T,V);var f,o=_(T),i=o[0],a=o[1];if(W)for(f=0;u>f;++f)W(T[f],f)||(N[V[f]+e]|=Y);else{for(f=0;i>f;++f)N[V[f]+e]|=Y;for(f=a;u>f;++f)N[V[f]+e]|=Y}if(!e)return P=T,Q=V,tn=i,en=a,void 0;var c=P,l=Q,v=0,s=0;for(P=Array(w),Q=b(w,w),f=0;e>v&&u>s;++f)c[v]<T[s]?(P[f]=c[v],Q[f]=l[v++]):(P[f]=T[s],Q[f]=V[s++]+e);for(;e>v;++v,++f)P[f]=c[v],Q[f]=l[v];for(;u>s;++s,++f)P[f]=T[s],Q[f]=V[s]+e;o=_(P),tn=o[0],en=o[1]}function o(r,n,t){rn.forEach(function(r){r(T,V,n,t)}),T=V=null}function a(r){for(var n,t=0,e=0;w>t;++t)N[n=Q[t]]&&(t!==e&&(P[e]=P[t]),Q[e]=r[n],++e);for(P.length=e;w>e;)Q[e++]=0;var u=_(P);tn=u[0],en=u[1]}function m(r){var n=r[0],t=r[1];if(W)return W=null,G(function(r,e){return e>=n&&t>e}),tn=n,en=t,X;var e,u,f,o=[],i=[];if(tn>n)for(e=n,u=Math.min(tn,t);u>e;++e)N[f=Q[e]]^=Y,o.push(f);else if(n>tn)for(e=tn,u=Math.min(n,en);u>e;++e)N[f=Q[e]]^=Y,i.push(f);if(t>en)for(e=Math.max(n,en),u=t;u>e;++e)N[f=Q[e]]^=Y,o.push(f);else if(en>t)for(e=Math.max(tn,t),u=en;u>e;++e)N[f=Q[e]]^=Y,i.push(f);return tn=n,en=t,C.forEach(function(r){r(Y,o,i)}),X}function O(r){return null==r?B():Array.isArray(r)?j(r):"function"==typeof r?D(r):z(r)}function z(r){return m((_=c(k,r))(P))}function j(r){return m((_=l(k,r))(P))}function B(){return m((_=v)(P))}function D(r){return _=v,G(W=r),tn=0,en=w,X}function G(r){var n,t,e,u=[],f=[];for(n=0;w>n;++n)!(N[t=Q[n]]&Y)^(e=r(P[n],n))&&(e?(N[t]&=Z,u.push(t)):(N[t]|=Y,f.push(t)));C.forEach(function(r){r(Y,u,f)})}function H(r){for(var n,t=[],e=en;--e>=tn&&r>0;)N[n=Q[e]]||(t.push(E[n]),--r);return t}function I(r){for(var n,t=[],e=tn;en>e&&r>0;)N[n=Q[e]]||(t.push(E[n]),--r),e++;return t}function J(r){function t(n,t,e,u){function f(){++T===L&&(m=q(m,K<<=1),B=q(B,K),L=A(K))}var l,v,h,p,d,g,y=j,m=b(T,L),x=H,k=J,O=T,M=0,U=0;for(X&&(x=k=s),j=Array(T),T=0,B=O>1?S(B,w):b(w,L),O&&(h=(v=y[0]).key);u>U&&!((p=r(n[U]))>=p);)++U;for(;u>U;){for(v&&p>=h?(d=v,g=h,m[M]=T,(v=y[++M])&&(h=v.key)):(d={key:p,value:k()},g=p),j[T]=d;!(p>g||(B[l=t[U]+e]=T,N[l]&Z||(d.value=x(d.value,E[l])),++U>=u));)p=r(n[U]);f()}for(;O>M;)j[m[M]=T]=y[M++],f();if(T>M)for(M=0;e>M;++M)B[M]=m[B[M]];l=C.indexOf(V),T>1?(V=o,W=a):(1===T?(V=i,W=c):(V=s,W=s),B=null),C[l]=V}function e(){if(T>1){for(var r=T,n=j,t=b(r,r),e=0,u=0;w>e;++e)N[e]&&(t[B[u]=B[e]]=1,++u);for(j=[],T=0,e=0;r>e;++e)t[e]&&(t[e]=T++,j.push(n[e]));if(T>1)for(var e=0;u>e;++e)B[e]=t[B[e]];else B=null;C[C.indexOf(V)]=T>1?(W=a,V=o):1===T?(W=c,V=i):W=V=s}else if(1===T){for(var e=0;w>e;++e)if(N[e])return;j=[],T=0,C[C.indexOf(V)]=V=W=s}}function o(r,n,t){if(r!==Y&&!X){var e,u,f,o;for(e=0,f=n.length;f>e;++e)N[u=n[e]]&Z||(o=j[B[u]],o.value=H(o.value,E[u]));for(e=0,f=t.length;f>e;++e)(N[u=t[e]]&Z)===r&&(o=j[B[u]],o.value=I(o.value,E[u]))}}function i(r,n,t){if(r!==Y&&!X){var e,u,f,o=j[0];for(e=0,f=n.length;f>e;++e)N[u=n[e]]&Z||(o.value=H(o.value,E[u]));for(e=0,f=t.length;f>e;++e)(N[u=t[e]]&Z)===r&&(o.value=I(o.value,E[u]))}}function a(){var r,n;for(r=0;T>r;++r)j[r].value=J();for(r=0;w>r;++r)N[r]&Z||(n=j[B[r]],n.value=H(n.value,E[r]))}function c(){var r,n=j[0];for(n.value=J(),r=0;w>r;++r)N[r]&Z||(n.value=H(n.value,E[r]))}function l(){return X&&(W(),X=!1),j}function v(r){var n=D(l(),0,j.length,r);return G.sort(n,0,n.length)}function m(r,n,t){return H=r,I=n,J=t,X=!0,F}function x(){return m(p,d,h)}function k(r){return m(g(r),y(r),h)}function O(r){function n(n){return r(n.value)}return D=f(n),G=u(n),F}function M(){return O(n)}function U(){return T}function z(){var r=C.indexOf(V);return r>=0&&C.splice(r,1),r=rn.indexOf(t),r>=0&&rn.splice(r,1),r=R.indexOf(e),r>=0&&R.splice(r,1),F}var F={top:v,all:l,reduce:m,reduceCount:x,reduceSum:k,order:O,orderNatural:M,size:U,dispose:z,remove:z};nn.push(F);var j,B,D,G,H,I,J,K=8,L=A(K),T=0,V=s,W=s,X=!0;return arguments.length<1&&(r=n),C.push(V),rn.push(t),R.push(e),t(P,Q,0,w),x().orderNatural()}function K(){var r=J(s),n=r.all;return delete r.all,delete r.top,delete r.order,delete r.orderNatural,delete r.size,r.value=function(){return n()[0].value},r}function L(){nn.forEach(function(r){r.dispose()});var r=F.indexOf(e);for(r>=0&&F.splice(r,1),r=F.indexOf(o),r>=0&&F.splice(r,1),r=R.indexOf(a),r>=0&&R.splice(r,1),r=0;w>r;++r)N[r]&=Z;return M&=Z,X}var P,Q,T,V,W,X={filter:O,filterExact:z,filterRange:j,filterFunction:D,filterAll:B,top:H,bottom:I,group:J,groupAll:K,dispose:L,remove:L},Y=~M&-~M,Z=~Y,$=i(function(r){return T[r]}),_=v,rn=[],nn=[],tn=0,en=0;return F.unshift(e),F.push(o),R.push(a),M|=Y,(U>=32?!Y:M&(1<<U)-1)&&(N=q(N,U<<=1)),e(E,0,w),o(E,0,w),X}function a(){function r(r,n){var t;if(!m)for(t=n;w>t;++t)N[t]||(a=c(a,E[t]))}function n(r,n,t){var e,u,f;if(!m){for(e=0,f=n.length;f>e;++e)N[u=n[e]]||(a=c(a,E[u]));for(e=0,f=t.length;f>e;++e)N[u=t[e]]===r&&(a=l(a,E[u]))}}function t(){var r;for(a=v(),r=0;w>r;++r)N[r]||(a=c(a,E[r]))}function e(r,n,t){return c=r,l=n,v=t,m=!0,s}function u(){return e(p,d,h)}function f(r){return e(g(r),y(r),h)}function o(){return m&&(t(),m=!1),a}function i(){var t=C.indexOf(n);return t>=0&&C.splice(t),t=F.indexOf(r),t>=0&&F.splice(t),s}var a,c,l,v,s={reduce:e,reduceCount:u,reduceSum:f,value:o,dispose:i,remove:i},m=!0;return C.push(n),F.push(r),r(E,0,w),u()}function m(){return w}var O={add:r,remove:e,dimension:o,groupAll:a,size:m},E=[],w=0,M=0,U=8,N=z(0),C=[],F=[],R=[];return arguments.length?r(arguments[0]):O}function b(r,n){return(257>n?z:65537>n?N:C)(r)}function x(r){for(var n=b(r,r),t=-1;++t<r;)n[t]=t;return n}function A(r){return 8===r?256:16===r?65536:4294967296}m.version="1.3.5",m.permute=t;var k=m.bisect=e(n);k.by=e;var O=m.heap=u(n);O.by=u;var E=m.heapselect=f(n);E.by=f;var w=m.insertionsort=o(n);w.by=o;var M=m.quicksort=i(n);M.by=i;var U=32,z=a,N=a,C=a,S=n,q=n;"undefined"!=typeof Uint8Array&&(z=function(r){return new Uint8Array(r)},N=function(r){return new Uint16Array(r)},C=function(r){return new Uint32Array(r)},S=function(r,n){if(r.length>=n)return r;var t=new r.constructor(n);return t.set(r),t},q=function(r,n){var t;switch(n){case 16:t=N(r.length);break;case 32:t=C(r.length);break;default:throw Error("invalid array width!")}return t.set(r),t}),r.crossfilter=m}(this);
d3.hexbin.min.js
!function(){d3.hexbin=function(){function u(n){var r={};return n.forEach(function(n,t){var a=s.call(u,n,t)/o,e=Math.round(a),c=h.call(u,n,t)/i-(1&e?.5:0),f=Math.round(c),l=a-e;if(3*Math.abs(l)>1){var v=c-f,g=f+(f>c?-1:1)/2,m=e+(e>a?-1:1),M=c-g,d=a-m;v*v+l*l>M*M+d*d&&(f=g+(1&e?1:-1)/2,e=m)}var j=f+"-"+e,p=r[j];p?p.push(n):(p=r[j]=[n],p.i=f,p.j=e,p.x=(f+(1&e?.5:0))*i,p.y=e*o)}),d3.values(r)}function a(r){var t=0,u=0;return n.map(function(n){var a=Math.sin(n)*r,e=-Math.cos(n)*r,i=a-t,o=e-u;return t=a,u=e,[i,o]})}var e,i,o,c=1,f=1,h=r,s=t;return u.x=function(n){return arguments.length?(h=n,u):h},u.y=function(n){return arguments.length?(s=n,u):s},u.hexagon=function(n){return arguments.length<1&&(n=e),"m"+a(n).join("l")+"z"},u.centers=function(){for(var n=[],r=0,t=!1,u=0;f+e>r;r+=o,t=!t,++u)for(var a=t?i/2:0,h=0;c+i/2>a;a+=i,++h){var s=[a,r];s.i=h,s.j=u,n.push(s)}return n},u.mesh=function(){var n=a(e).slice(0,4).join("l");return u.centers().map(function(r){return"M"+r+"m"+n}).join("")},u.size=function(n){return arguments.length?(c=+n[0],f=+n[1],u):[c,f]},u.radius=function(n){return arguments.length?(e=+n,i=2*e*Math.sin(Math.PI/3),o=1.5*e,u):e},u.radius(1)};var n=d3.range(0,2*Math.PI,Math.PI/3),r=function(n){return n[0]},t=function(n){return n[1]}}();
d3js.html
<html><head><meta charset="utf-8">
<meta name="viewport" content="width=1040">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="keywords" content="d3,d3.js,visualization,dom,javascript">
<meta itemprop="description" name="description" content="D3 is a JavaScript library for visualizing data with HTML, SVG and CSS.">
<link rel="image_src" href="//d3js.org/preview.png">
<meta property="og:type" content="article">
<meta property="og:title" content="D3.js - Data-Driven Documents">
<meta property="og:description" content="D3 is a JavaScript library for visualizing data with HTML, SVG and CSS.">
<meta property="og:url" content="//d3js.org/">
<meta property="og:image" content="//d3js.org/preview.png">
<meta name="twitter:card" value="summary_large_image">
<meta name="twitter:site" value="@mbostock">
<meta name="twitter:creator" content="@mbostock">
<meta name="twitter:title" content="D3.js - Data-Driven Documents">
<meta name="twitter:description" content="D3 is a JavaScript library for visualizing data with HTML, SVG and CSS.">
<meta name="twitter:url" content="//d3js.org/">
<meta name="twitter:image" content="//d3js.org/preview.png">
<meta name="twitter:image:width" content="560">
<meta name="twitter:image:height" content="295">
<meta name="author" content="Mike Bostock">
<link rel="canonical" href="//d3js.org/">
<title>D3.js - Data-Driven Documents</title>
<style>
#examples {
background: #ddd;
height: 2000px;
margin-bottom: 2em;
overflow: hidden;
padding: 0;
position: relative;
border-top: solid 1px #fff;
border-bottom: solid 1px #fff;
}
#examples:after,
#examples:before {
content: "";
display: block;
width: 100%;
position: absolute;
background: red;
height: 16px;
z-index: 2;
}
#examples:before {
bottom: -16px;
box-shadow: 0px -8px 16px rgba(0,0,0,.3);
}
#examples:after {
top: -16px;
box-shadow: 0px 8px 16px rgba(0,0,0,.3);
}
#examples-deep {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
}
#examples svg,
#examples canvas {
position: absolute;
}
.example-mesh {
fill: none;
stroke: #fff;
stroke-width: 2px;
}
.example-anchor path {
fill: none;
pointer-events: all;
}
.example-anchor path:hover {
stroke: #000;
stroke-width: 2px;
}
</style>
<div id="examples">
<div id="examples-deep" ></div>
</div>
<script src="d3.v3.min.js"></script>
<script src="d3.hexbin.min.js"></script>
<script>
(function(a,b,c,d,e,f){function k(a){var b,c=a.length,e=this,f=0,g=e.i=e.j=0,h=e.S=[];for(c||(a=[c++]);d>f;)h[f]=f++;for(f=0;d>f;f++)h[f]=h[g=j&g+a[f%c]+(b=h[f])],h[g]=b;(e.g=function(a){for(var b,c=0,f=e.i,g=e.j,h=e.S;a--;)b=h[f=j&f+1],c=c*d+h[j&(h[f]=h[g=j&g+b])+(h[g]=b)];return e.i=f,e.j=g,c})(d)}function l(a,b){var e,c=[],d=(typeof a)[0];if(b&&"o"==d)for(e in a)try{c.push(l(a[e],b-1))}catch(f){}return c.length?c:"s"==d?a:a+"\0"}function m(a,b){for(var d,c=a+"",e=0;c.length>e;)b[j&e]=j&(d^=19*b[j&e])+c.charCodeAt(e++);return o(b)}function n(c){try{return a.crypto.getRandomValues(c=new Uint8Array(d)),o(c)}catch(e){return[+new Date,a,a.navigator.plugins,a.screen,o(b)]}}function o(a){return String.fromCharCode.apply(0,a)}var g=c.pow(d,e),h=c.pow(2,f),i=2*h,j=d-1;c.seedrandom=function(a,f){var j=[],p=m(l(f?[a,o(b)]:0 in arguments?a:n(),3),j),q=new k(j);return m(o(q.S),b),c.random=function(){for(var a=q.g(e),b=g,c=0;h>a;)a=(a+c)*d,b*=d,c=q.g(1);for(;a>=i;)a/=2,b/=2,c>>>=1;return(a+c)/b},p},m(c.random(),b)})(this,[],Math,256,6,52);
var data = [
{title: "Reingold–Tilford Tree (Radial)", url: "//bl.ocks.org/mbostock/4063550"},
{title: "Factorisation Diagrams", url: "//www.jasondavies.com/factorisation-diagrams/"},
{title: "Phylogenetic Tree of Life", url: "//www.jasondavies.com/tree-of-life/"},
{title: "Geographic Clipping", url: "//www.jasondavies.com/maps/clip/"},
{title: "Les Misérables Co-occurrence Matrix", url: "//bost.ocks.org/mike/miserables/"},
{title: "L*a*b* and HCL color spaces", url: "//bl.ocks.org/mbostock/3014589"},
{title: "Treemap", url: "//bl.ocks.org/mbostock/4063582"},
{title: "Map Projection Transitions", url: "//www.jasondavies.com/maps/transition/"},
{title: "Across U.S. Companies, Tax Rates Vary Greatly", url: "//www.nytimes.com/interactive/2013/05/25/sunday-review/corporate-taxes.html"},
{title: "Rotating Voronoi", url: "//bl.ocks.org/mbostock/4636377"},
{title: "Zoomable Geography", url: "//bl.ocks.org/mbostock/2374239"},
{title: "Fisheye Distortion", url: "//bost.ocks.org/mike/fisheye/"},
{title: "Geodesic Rainbow", url: "//bl.ocks.org/mbostock/3057239"},
{title: "Hierarchical Bar Chart", url: "//bl.ocks.org/mbostock/1283663"},
{title: "Exoplanets", url: "//bl.ocks.org/mbostock/3007180"},
{title: "Crossfilter", url: "//square.github.io/crossfilter/"},
{title: "Alaska’s villages on the frontline of climate change", url: "//www.guardian.co.uk/environment/interactive/2013/may/14/alaska-villages-frontline-global-warming"},
{title: "The federal health-care exchange’s abysmal success rate", url: "//www.washingtonpost.com/wp-srv/special/politics/state-vs-federal-exchanges/"},
{title: "Counties Blue and Red, Moving Right and Left", url: "//www.nytimes.com/interactive/2012/11/11/sunday-review/counties-moving.html"},
{title: "At the National Conventions, the Words They Used", url: "//www.nytimes.com/interactive/2012/09/06/us/politics/convention-word-counts.html"},
{title: "Reprojected Raster Tiles", url: "//www.jasondavies.com/maps/raster/"},
{title: "Hive Plots", url: "//bost.ocks.org/mike/hive/"},
{title: "Donut Transitions", url: "//bl.ocks.org/mbostock/4341417"},
{title: "Non-Contiguous Cartogram", url: "//bl.ocks.org/mbostock/4055908"},
{title: "Spermatozoa", url: "//bl.ocks.org/mbostock/1136236"},
{title: "Zoomable Circle Packing", url: "//bl.ocks.org/mbostock/7607535"},
{title: "Transform Transitions", url: "//bl.ocks.org/mbostock/1345853"},
{title: "Scatterplot Matrix", url: "//bl.ocks.org/mbostock/3213173"},
{title: "Janet L. Yellen, on the Economy’s Twists and Turns", url: "//www.nytimes.com/interactive/2013/10/09/us/yellen-fed-chart.html"},
{title: "Front Row to Fashion Week", url: "//www.nytimes.com/newsgraphics/2013/09/13/fashion-week-editors-picks/"},
{title: "Interrupted Sinu-Mollweide", url: "//bl.ocks.org/mbostock/4481520"},
{title: "Streamgraph", url: "//bl.ocks.org/mbostock/4060954"},
{title: "Force-Directed Graph", url: "//bl.ocks.org/mbostock/4062045"},
{title: "Zoomable Icicle", url: "//bl.ocks.org/mbostock/1005873"},
{title: "Collision Detection", url: "//bl.ocks.org/mbostock/3231298"},
{title: "Waterman Butterfly", url: "//bl.ocks.org/mbostock/4458497"},
{title: "Airocean World", url: "//www.jasondavies.com/maps/airocean/"},
{title: "Countries by Area", url: "//www.jasondavies.com/maps/countries-by-area/"},
{title: "Bilevel Partition", url: "//bl.ocks.org/mbostock/5944371"},
{title: "Map Zooming", url: "//bl.ocks.org/mbostock/6242308"},
{title: "Fisher–Yates Shuffle", url: "//bost.ocks.org/mike/shuffle/"},
{title: "Sphere Spirals", url: "//www.jasondavies.com/maps/sphere-spirals/"},
{title: "World Tour", url: "//bl.ocks.org/mbostock/4183330"},
{title: "Zoomable Treemaps", url: "//bost.ocks.org/mike/treemap/"},
{title: "Clipped Map Tiles", url: "//bl.ocks.org/mbostock/4150951"},
{title: "Cubism.js", url: "//square.github.io/cubism/"},
{title: "Voronoi Labels", url: "//bl.ocks.org/mbostock/6909318"},
{title: "Bivariate Hexbin Map", url: "//bl.ocks.org/mbostock/4330486"},
{title: "OMG Particles!", url: "//bl.ocks.org/mbostock/1062544"},
{title: "Calendar View", url: "//bl.ocks.org/mbostock/4063318"},
{title: "The Wealth & Health of Nations", url: "//bost.ocks.org/mike/nations/"},
{title: "Collapsible Tree", url: "//bl.ocks.org/mbostock/4339083"},
{title: "Hexagonal Binning", url: "//bl.ocks.org/mbostock/4248145"},
{title: "Over the Decades, How States Have Shifted", url: "//www.nytimes.com/interactive/2012/10/15/us/politics/swing-history.html"},
{title: "China Still Dominates, but Some Manufacturers Look Elsewhere", url: "//www.nytimes.com/interactive/2013/04/08/business/global/asia-map.html"},
{title: "Strikeouts on the Rise", url: "//www.nytimes.com/interactive/2013/03/29/sports/baseball/Strikeouts-Are-Still-Soaring.html?ref=baseball"},
{title: "Epicyclic Gearing", url: "//bl.ocks.org/mbostock/1353700"},
{title: "Voronoi Tessellation", url: "//bl.ocks.org/mbostock/4060366"},
{title: "The state of our union is … dumber", url: "//www.guardian.co.uk/world/interactive/2013/feb/12/state-of-the-union-reading-level"},
{title: "Chord Diagram", url: "//bl.ocks.org/mbostock/1046712"},
{title: "Floating Landmasses", url: "//bl.ocks.org/mbostock/6738360"},
{title: "How the Tax Burden Has Changed", url: "//www.nytimes.com/interactive/2012/11/30/us/tax-burden.html"},
{title: "Prime Number Patterns", url: "//www.jasondavies.com/primos/"},
{title: "Koalas to the Max", url: "//www.koalastothemax.com/"},
{title: "Constellations of Directors and Their Stars", url: "//www.nytimes.com/newsgraphics/2013/09/07/director-star-chart/"},
{title: "Drought and Deluge in the Lower 48", url: "//www.nytimes.com/interactive/2012/08/11/sunday-review/drought-history.html"},
{title: "Animated Bézier Curves", url: "//www.jasondavies.com/animated-bezier/"},
{title: "Histogram", url: "//bl.ocks.org/mbostock/3048450"},
{title: "Stacked-to-Grouped Bars", url: "//bl.ocks.org/mbostock/3943967"},
{title: "Force-Directed States of America", url: "//bl.ocks.org/mbostock/1073373"},
{title: "Faux-3D Arcs", url: "//bl.ocks.org/dwtkns/4973620"},
{title: "512 Paths to the White House", url: "//www.nytimes.com/interactive/2012/11/02/us/politics/paths-to-the-white-house.html"},
{title: "Polar Clock", url: "//bl.ocks.org/mbostock/1096355"},
{title: "Population Pyramid", url: "//bl.ocks.org/mbostock/4062085"},
{title: "The America’s Cup Finale: Oracle’s Path to Victory", url: "//www.nytimes.com/interactive/2013/09/25/sports/americas-cup-course.html"},
{title: "Rainbow Worm", url: "//bl.ocks.org/mbostock/4165404"},
{title: "Four Ways to Slice Obama’s 2013 Budget Proposal", url: "//www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html"},
{title: "Quadtree", url: "//bl.ocks.org/mbostock/4343214"},
{title: "Bubble Chart", url: "//bl.ocks.org/mbostock/4063269"},
{title: "Women as Academic Authors, 1665-2010", url: "//chronicle.com/article/Woman-as-Academic-Authors/135192/"},
{title: "Choropleth", url: "//bl.ocks.org/mbostock/4060606"},
{title: "Gilbert’s Two-World Perspective", url: "//www.jasondavies.com/maps/gilbert/"},
{title: "For Eli Manning, 150 Games and Counting", url: "//www.nytimes.com/newsgraphics/2013/09/28/eli-manning-milestone/"},
{title: "Word Tree", url: "//www.jasondavies.com/wordtree/"},
{title: "Mobile Patent Suits", url: "//bl.ocks.org/mbostock/1153292"},
{title: "Mitchell’s Best-Candidate", url: "//bl.ocks.org/mbostock/1893974"},
{title: "Sankey Diagrams", url: "//bost.ocks.org/mike/sankey/"},
{title: "van Wijk Smooth Zooming", url: "//bl.ocks.org/mbostock/3828981"},
{title: "Bryce Harper: A swing of beauty", url: "//www.washingtonpost.com/wp-srv/special/sports/bryce-harper-swing-of-beauty/"},
{title: "Dissecting a Trailer: The Parts of the Film That Make the Cut", url: "//www.nytimes.com/interactive/2013/02/19/movies/awardsseason/oscar-trailers.html"},
{title: "Violence and guns in best-selling video games", url: "//www.guardian.co.uk/world/interactive/2013/apr/30/violence-guns-best-selling-video-games"},
{title: "Hierarchical Edge Bundling", url: "//bl.ocks.org/mbostock/1044242"},
{title: "Geographic Bounding Boxes", url: "//www.jasondavies.com/maps/bounds/"},
{title: "Live Results: Massachusetts Senate Special Election", url: "//elections.huffingtonpost.com/2013/massachusetts-senate-results"},
{title: "Zoomable Map Tiles", url: "//bl.ocks.org/mbostock/4132797"},
{title: "D3 Show Reel", url: "//bl.ocks.org/mbostock/1256572"},
{title: "Building Hamiltonian Graphs from LCF Notation", url: "//christophermanning.org/projects/building-cubic-hamiltonian-graphs-from-lcf-notation/"},
{title: "Sequences sunburst", url: "//bl.ocks.org/kerryrodden/7090426"},
{title: "Azimuth and Distance from London", url: "//www.jasondavies.com/maps/azimuth-distance/"},
{title: "Parallel Sets", url: "//www.jasondavies.com/parallel-sets/"}
];
data.forEach(function(d, i) {
d.i = i % 10;
d.j = i / 10 | 0;
});
Math.seedrandom(+d3.time.hour(new Date));
d3.shuffle(data);
var height = 2000,
imageWidth = 132,
imageHeight = 152,
radius = 75,
depth = 4;
var currentFocus = [innerWidth / 2, height / 2],
desiredFocus,
idle = true;
var style = document.body.style,
transform = ("webkitTransform" in style ? "-webkit-"
: "MozTransform" in style ? "-moz-"
: "msTransform" in style ? "-ms-"
: "OTransform" in style ? "-o-"
: "") + "transform";
var hexbin = d3.hexbin()
.radius(radius);
if (!("ontouchstart" in document)) d3.select("#examples")
.on("mousemove", mousemoved);
var deep = d3.select("#examples-deep");
var canvas = deep.append("canvas")
.attr("height", height);
var context = canvas.node().getContext("2d");
var svg = deep.append("svg")
.attr("height", height);
var mesh = svg.append("path")
.attr("class", "example-mesh");
var anchor = svg.append("g")
.attr("class", "example-anchor")
.selectAll("a");
var graphic = deep.selectAll("svg,canvas");
var image = new Image;
image.src = "//d3js.org/ex.jpg?3f2d00ffdba6ced9c50f02ed42f12f6156368bd2";
image.onload = resized;
d3.select(window)
.on("resize", resized)
.each(resized);
function drawImage(d) {
context.save();
context.beginPath();
context.moveTo(0, -radius);
for (var i = 1; i < 6; ++i) {
var angle = i * Math.PI / 3,
x = Math.sin(angle) * radius,
y = -Math.cos(angle) * radius;
context.lineTo(x, y);
}
context.clip();
context.drawImage(image,
imageWidth * d.i, imageHeight * d.j,
imageWidth, imageHeight,
-imageWidth / 2, -imageHeight / 2,
imageWidth, imageHeight);
context.restore();
}
function resized() {
var deepWidth = innerWidth * (depth + 1) / depth,
deepHeight = height * (depth + 1) / depth,
centers = hexbin.size([deepWidth, deepHeight]).centers();
desiredFocus = [innerWidth / 2, height / 2];
moved();
graphic
.style("left", Math.round((innerWidth - deepWidth) / 2) + "px")
.style("top", Math.round((height - deepHeight) / 2) + "px")
.attr("width", deepWidth)
.attr("height", deepHeight);
centers.forEach(function(center, i) {
center.j = Math.round(center[1] / (radius * 1.5));
center.i = Math.round((center[0] - (center.j & 1) * radius * Math.sin(Math.PI / 3)) / (radius * 2 * Math.sin(Math.PI / 3)));
context.save();
context.translate(Math.round(center[0]), Math.round(center[1]));
drawImage(center.example = data[(center.i % 10) + ((center.j + (center.i / 10 & 1) * 5) % 10) * 10]);
context.restore();
});
mesh.attr("d", hexbin.mesh);
anchor = anchor.data(centers, function(d) { return d.i + "," + d.j; });
anchor.exit().remove();
anchor.enter().append("a")
.attr("xlink:href", function(d) { return d.example.url; })
.attr("xlink:title", function(d) { return d.example.title; })
.append("path")
.attr("d", hexbin.hexagon());
anchor
.attr("transform", function(d) { return "translate(" + d + ")"; });
}
function mousemoved() {
var m = d3.mouse(this);
desiredFocus = [
Math.round((m[0] - innerWidth / 2) / depth) * depth + innerWidth / 2,
Math.round((m[1] - height / 2) / depth) * depth + height / 2
];
moved();
}
function moved() {
if (idle) d3.timer(function() {
if (idle = Math.abs(desiredFocus[0] - currentFocus[0]) < .5 && Math.abs(desiredFocus[1] - currentFocus[1]) < .5) currentFocus = desiredFocus;
else currentFocus[0] += (desiredFocus[0] - currentFocus[0]) * .14, currentFocus[1] += (desiredFocus[1] - currentFocus[1]) * .14;
deep.style(transform, "translate(" + (innerWidth / 2 - currentFocus[0]) / depth + "px," + (height / 2 - currentFocus[1]) / depth + "px)");
return idle;
});
}
</script>
<script>
d3.select("#download").attr("href", "https://github.com/mbostock/d3/releases/download/v" + d3.version + "/d3.v3.zip");
d3.select("#version").text(" (" + d3.version + ")");
</script>
</body></html>
dc.css
div.dc-chart {
float: left;
}
.dc-chart rect.bar {
stroke: none;
cursor: pointer;
}
.dc-chart rect.bar:hover {
fill-opacity: .5;
}
.dc-chart rect.stack1 {
stroke: none;
fill: red;
}
.dc-chart rect.stack2 {
stroke: none;
fill: green;
}
.dc-chart rect.deselected {
stroke: none;
fill: #ccc;
}
.dc-chart .pie-slice {
fill: white;
font-size: 12px;
cursor: pointer;
}
.dc-chart .pie-slice :hover {
fill-opacity: .8;
}
.dc-chart .selected path {
stroke-width: 3;
stroke: #ccc;
fill-opacity: 1;
}
.dc-chart .deselected path {
stroke: none;
fill-opacity: .5;
fill: #ccc;
}
.dc-chart .axis path, .axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
.dc-chart .axis text {
font: 10px sans-serif;
}
.dc-chart .grid-line {
fill: none;
stroke: #ccc;
opacity: .5;
shape-rendering: crispEdges;
}
.dc-chart .grid-line line {
fill: none;
stroke: #ccc;
opacity: .5;
shape-rendering: crispEdges;
}
.dc-chart .brush rect.background {
z-index: -999;
}
.dc-chart .brush rect.extent {
fill: steelblue;
fill-opacity: .125;
}
.dc-chart .brush .resize path {
fill: #eee;
stroke: #666;
}
.dc-chart path.line {
fill: none;
stroke-width: 1.5px;
}
.dc-chart circle.dot {
stroke: none;
}
.dc-chart g.dc-tooltip path {
fill: none;
stroke: grey;
stroke-opacity: .8;
}
.dc-chart path.area {
fill-opacity: .3;
stroke: none;
}
.dc-chart .node {
font-size: 0.7em;
cursor: pointer;
}
.dc-chart .node :hover {
fill-opacity: .8;
}
.dc-chart .selected circle {
stroke-width: 3;
stroke: #ccc;
fill-opacity: 1;
}
.dc-chart .deselected circle {
stroke: none;
fill-opacity: .5;
fill: #ccc;
}
.dc-chart .bubble {
stroke: none;
fill-opacity: 0.6;
}
.dc-data-count {
float: right;
margin-top: 15px;
margin-right: 15px;
}
.dc-data-count .filter-count {
color: #3182bd;
font-weight: bold;
}
.dc-data-count .total-count {
color: #3182bd;
font-weight: bold;
}
.dc-data-table {
}
.dc-chart g.state {
cursor: pointer;
}
.dc-chart g.state :hover {
fill-opacity: .8;
}
.dc-chart g.state path {
stroke: white;
}
.dc-chart g.selected path {
}
.dc-chart g.deselected path {
fill: grey;
}
.dc-chart g.selected text {
}
.dc-chart g.deselected text {
display: none;
}
.dc-chart g.county path {
stroke: white;
fill: none;
}
.dc-chart g.debug rect {
fill: blue;
fill-opacity: .2;
}
.dc-chart g.row rect {
fill-opacity: 0.8;
cursor: pointer;
}
.dc-chart g.row rect:hover {
fill-opacity: 0.6;
}
.dc-chart g.row text {
fill: white;
font-size: 12px;
cursor: pointer;
}
.dc-legend {
font-size: 11px;
}
.dc-legend-item {
cursor: pointer;
}
.dc-chart g.axis text {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
pointer-events: none;
}
.dc-chart path.highlight {
stroke-width: 3;
fill-opacity: 1;
stroke-opacity: 1;
}
.dc-chart .highlight {
fill-opacity: 1;
stroke-opacity: 1;
}
.dc-chart .fadeout {
fill-opacity: 0.2;
stroke-opacity: 0.2;
}
.dc-chart path.dc-mbolmbol {
fill-opacity: 0.5;
stroke-opacity: 0.5;
}
.dc-hard .number-display {
float: none;
}
.dc-chart .box {
font: 10px sans-serif;
}
.dc-chart .box line,
.dc-chart .box rect,
.dc-chart .box circle {
fill: #fff;
stroke: #000;
stroke-width: 1.5px;
}
.dc-chart .box .center {
stroke-dasharray: 3,3;
}
.dc-chart .box .outlier {
fill: none;
stroke: #ccc;
}
.dc-chart .symbol{
stroke: none;
}
font-awesome.min.css
[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0 0;background-repeat:repeat;margin-top:0}.icon-white,.nav-pills>.active>a>[class^="icon-"],.nav-pills>.active>a>[class*=" icon-"],.nav-list>.active>a>[class^="icon-"],.nav-list>.active>a>[class*=" icon-"],.navbar-inverse .nav>.active>a>[class^="icon-"],.navbar-inverse .nav>.active>a>[class*=" icon-"],.dropdown-menu>li>a:hover>[class^="icon-"],.dropdown-menu>li>a:hover>[class*=" icon-"],.dropdown-menu>.active>a>[class^="icon-"],.dropdown-menu>.active>a>[class*=" icon-"],.dropdown-submenu:hover>a>[class^="icon-"],.dropdown-submenu:hover>a>[class*=" icon-"]{background-image:none}[class^="icon-"]:before,[class*=" icon-"]:before{text-decoration:inherit;display:inline-block;speak:none}a [class^="icon-"],a [class*=" icon-"]{display:inline-block}.icon-large:before{vertical-align:-10%;font-size:1.3333333333333333em}.btn [class^="icon-"],.nav [class^="icon-"],.btn [class*=" icon-"],.nav [class*=" icon-"]{display:inline}.btn [class^="icon-"].icon-large,.nav [class^="icon-"].icon-large,.btn [class*=" icon-"].icon-large,.nav [class*=" icon-"].icon-large{line-height:.9em}.btn [class^="icon-"].icon-spin,.nav [class^="icon-"].icon-spin,.btn [class*=" icon-"].icon-spin,.nav [class*=" icon-"].icon-spin{display:inline-block}.nav-tabs [class^="icon-"],.nav-pills [class^="icon-"],.nav-tabs [class*=" icon-"],.nav-pills [class*=" icon-"],.nav-tabs [class^="icon-"].icon-large,.nav-pills [class^="icon-"].icon-large,.nav-tabs [class*=" icon-"].icon-large,.nav-pills [class*=" icon-"].icon-large{line-height:.9em}li [class^="icon-"],.nav li [class^="icon-"],li [class*=" icon-"],.nav li [class*=" icon-"]{display:inline-block;width:1.25em;text-align:center}li [class^="icon-"].icon-large,.nav li [class^="icon-"].icon-large,li [class*=" icon-"].icon-large,.nav li [class*=" icon-"].icon-large{width:1.5625em}ul.icons{list-style-type:none;text-indent:-0.75em}ul.icons li [class^="icon-"],ul.icons li [class*=" icon-"]{width:.75em}.icon-muted{color:#eee}.icon-border{border:solid 1px #eee;padding:.2em .25em .15em;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.icon-2x{font-size:2em}.icon-2x.icon-border{border-width:2px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.icon-3x{font-size:3em}.icon-3x.icon-border{border-width:3px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.icon-4x{font-size:4em}.icon-4x.icon-border{border-width:4px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px}.pull-right{float:right}.pull-left{float:left}[class^="icon-"].pull-left,[class*=" icon-"].pull-left{margin-right:.3em}[class^="icon-"].pull-right,[class*=" icon-"].pull-right{margin-left:.3em}.btn [class^="icon-"].pull-left.icon-2x,.btn [class*=" icon-"].pull-left.icon-2x,.btn [class^="icon-"].pull-right.icon-2x,.btn [class*=" icon-"].pull-right.icon-2x{margin-top:.18em}.btn [class^="icon-"].icon-spin.icon-large,.btn [class*=" icon-"].icon-spin.icon-large{line-height:.8em}.btn.btn-small [class^="icon-"].pull-left.icon-2x,.btn.btn-small [class*=" icon-"].pull-left.icon-2x,.btn.btn-small [class^="icon-"].pull-right.icon-2x,.btn.btn-small [class*=" icon-"].pull-right.icon-2x{margin-top:.25em}.btn.btn-large [class^="icon-"],.btn.btn-large [class*=" icon-"]{margin-top:0}.btn.btn-large [class^="icon-"].pull-left.icon-2x,.btn.btn-large [class*=" icon-"].pull-left.icon-2x,.btn.btn-large [class^="icon-"].pull-right.icon-2x,.btn.btn-large [class*=" icon-"].pull-right.icon-2x{margin-top:.05em}.btn.btn-large [class^="icon-"].pull-left.icon-2x,.btn.btn-large [class*=" icon-"].pull-left.icon-2x{margin-right:.2em}.btn.btn-large [class^="icon-"].pull-right.icon-2x,.btn.btn-large [class*=" icon-"].pull-right.icon-2x{margin-left:.2em}.icon-spin{display:inline-block;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;-webkit-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)}100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}@-moz-document url-prefix(){.icon-spin{height:.9em}.btn .icon-spin{height:auto}.icon-spin.icon-large{height:1.25em}.btn .icon-spin.icon-large{height:.75em}}.icon-glass:before{content:"\f000"}.icon-music:before{content:"\f001"}.icon-search:before{content:"\f002"}.icon-envelope:before{content:"\f003"}.icon-heart:before{content:"\f004"}.icon-star:before{content:"\f005"}.icon-star-empty:before{content:"\f006"}.icon-user:before{content:"\f007"}.icon-film:before{content:"\f008"}.icon-th-large:before{content:"\f009"}.icon-th:before{content:"\f00a"}.icon-th-list:before{content:"\f00b"}.icon-ok:before{content:"\f00c"}.icon-remove:before{content:"\f00d"}.icon-zoom-in:before{content:"\f00e"}.icon-zoom-out:before{content:"\f010"}.icon-off:before{content:"\f011"}.icon-signal:before{content:"\f012"}.icon-cog:before{content:"\f013"}.icon-trash:before{content:"\f014"}.icon-home:before{content:"\f015"}.icon-file:before{content:"\f016"}.icon-time:before{content:"\f017"}.icon-road:before{content:"\f018"}.icon-download-alt:before{content:"\f019"}.icon-download:before{content:"\f01a"}.icon-upload:before{content:"\f01b"}.icon-inbox:before{content:"\f01c"}.icon-play-circle:before{content:"\f01d"}.icon-repeat:before{content:"\f01e"}.icon-refresh:before{content:"\f021"}.icon-list-alt:before{content:"\f022"}.icon-lock:before{content:"\f023"}.icon-flag:before{content:"\f024"}.icon-headphones:before{content:"\f025"}.icon-volume-off:before{content:"\f026"}.icon-volume-down:before{content:"\f027"}.icon-volume-up:before{content:"\f028"}.icon-qrcode:before{content:"\f029"}.icon-barcode:before{content:"\f02a"}.icon-tag:before{content:"\f02b"}.icon-tags:before{content:"\f02c"}.icon-book:before{content:"\f02d"}.icon-bookmark:before{content:"\f02e"}.icon-print:before{content:"\f02f"}.icon-camera:before{content:"\f030"}.icon-font:before{content:"\f031"}.icon-bold:before{content:"\f032"}.icon-italic:before{content:"\f033"}.icon-text-height:before{content:"\f034"}.icon-text-width:before{content:"\f035"}.icon-align-left:before{content:"\f036"}.icon-align-center:before{content:"\f037"}.icon-align-right:before{content:"\f038"}.icon-align-justify:before{content:"\f039"}.icon-list:before{content:"\f03a"}.icon-indent-left:before{content:"\f03b"}.icon-indent-right:before{content:"\f03c"}.icon-facetime-video:before{content:"\f03d"}.icon-picture:before{content:"\f03e"}.icon-pencil:before{content:"\f040"}.icon-map-marker:before{content:"\f041"}.icon-adjust:before{content:"\f042"}.icon-tint:before{content:"\f043"}.icon-edit:before{content:"\f044"}.icon-share:before{content:"\f045"}.icon-check:before{content:"\f046"}.icon-move:before{content:"\f047"}.icon-step-backward:before{content:"\f048"}.icon-fast-backward:before{content:"\f049"}.icon-backward:before{content:"\f04a"}.icon-play:before{content:"\f04b"}.icon-pause:before{content:"\f04c"}.icon-stop:before{content:"\f04d"}.icon-forward:before{content:"\f04e"}.icon-fast-forward:before{content:"\f050"}.icon-step-forward:before{content:"\f051"}.icon-eject:before{content:"\f052"}.icon-chevron-left:before{content:"\f053"}.icon-chevron-right:before{content:"\f054"}.icon-plus-sign:before{content:"\f055"}.icon-minus-sign:before{content:"\f056"}.icon-remove-sign:before{content:"\f057"}.icon-ok-sign:before{content:"\f058"}.icon-question-sign:before{content:"\f059"}.icon-info-sign:before{content:"\f05a"}.icon-screenshot:before{content:"\f05b"}.icon-remove-circle:before{content:"\f05c"}.icon-ok-circle:before{content:"\f05d"}.icon-ban-circle:before{content:"\f05e"}.icon-arrow-left:before{content:"\f060"}.icon-arrow-right:before{content:"\f061"}.icon-arrow-up:before{content:"\f062"}.icon-arrow-down:before{content:"\f063"}.icon-share-alt:before{content:"\f064"}.icon-resize-full:before{content:"\f065"}.icon-resize-small:before{content:"\f066"}.icon-plus:before{content:"\f067"}.icon-minus:before{content:"\f068"}.icon-asterisk:before{content:"\f069"}.icon-exclamation-sign:before{content:"\f06a"}.icon-gift:before{content:"\f06b"}.icon-leaf:before{content:"\f06c"}.icon-fire:before{content:"\f06d"}.icon-eye-open:before{content:"\f06e"}.icon-eye-close:before{content:"\f070"}.icon-warning-sign:before{content:"\f071"}.icon-plane:before{content:"\f072"}.icon-calendar:before{content:"\f073"}.icon-random:before{content:"\f074"}.icon-comment:before{content:"\f075"}.icon-magnet:before{content:"\f076"}.icon-chevron-up:before{content:"\f077"}.icon-chevron-down:before{content:"\f078"}.icon-retweet:before{content:"\f079"}.icon-shopping-cart:before{content:"\f07a"}.icon-folder-close:before{content:"\f07b"}.icon-folder-open:before{content:"\f07c"}.icon-resize-vertical:before{content:"\f07d"}.icon-resize-horizontal:before{content:"\f07e"}.icon-bar-chart:before{content:"\f080"}.icon-twitter-sign:before{content:"\f081"}.icon-facebook-sign:before{content:"\f082"}.icon-camera-retro:before{content:"\f083"}.icon-key:before{content:"\f084"}.icon-cogs:before{content:"\f085"}.icon-comments:before{content:"\f086"}.icon-thumbs-up:before{content:"\f087"}.icon-thumbs-down:before{content:"\f088"}.icon-star-half:before{content:"\f089"}.icon-heart-empty:before{content:"\f08a"}.icon-signout:before{content:"\f08b"}.icon-linkedin-sign:before{content:"\f08c"}.icon-pushpin:before{content:"\f08d"}.icon-external-link:before{content:"\f08e"}.icon-signin:before{content:"\f090"}.icon-trophy:before{content:"\f091"}.icon-github-sign:before{content:"\f092"}.icon-upload-alt:before{content:"\f093"}.icon-lemon:before{content:"\f094"}.icon-phone:before{content:"\f095"}.icon-check-empty:before{content:"\f096"}.icon-bookmark-empty:before{content:"\f097"}.icon-phone-sign:before{content:"\f098"}.icon-twitter:before{content:"\f099"}.icon-facebook:before{content:"\f09a"}.icon-github:before{content:"\f09b"}.icon-unlock:before{content:"\f09c"}.icon-credit-card:before{content:"\f09d"}.icon-rss:before{content:"\f09e"}.icon-hdd:before{content:"\f0a0"}.icon-bullhorn:before{content:"\f0a1"}.icon-bell:before{content:"\f0a2"}.icon-certificate:before{content:"\f0a3"}.icon-hand-right:before{content:"\f0a4"}.icon-hand-left:before{content:"\f0a5"}.icon-hand-up:before{content:"\f0a6"}.icon-hand-down:before{content:"\f0a7"}.icon-circle-arrow-left:before{content:"\f0a8"}.icon-circle-arrow-right:before{content:"\f0a9"}.icon-circle-arrow-up:before{content:"\f0aa"}.icon-circle-arrow-down:before{content:"\f0ab"}.icon-globe:before{content:"\f0ac"}.icon-wrench:before{content:"\f0ad"}.icon-tasks:before{content:"\f0ae"}.icon-filter:before{content:"\f0b0"}.icon-briefcase:before{content:"\f0b1"}.icon-fullscreen:before{content:"\f0b2"}.icon-group:before{content:"\f0c0"}.icon-link:before{content:"\f0c1"}.icon-cloud:before{content:"\f0c2"}.icon-beaker:before{content:"\f0c3"}.icon-cut:before{content:"\f0c4"}.icon-copy:before{content:"\f0c5"}.icon-paper-clip:before{content:"\f0c6"}.icon-save:before{content:"\f0c7"}.icon-sign-blank:before{content:"\f0c8"}.icon-reorder:before{content:"\f0c9"}.icon-list-ul:before{content:"\f0ca"}.icon-list-ol:before{content:"\f0cb"}.icon-strikethrough:before{content:"\f0cc"}.icon-underline:before{content:"\f0cd"}.icon-table:before{content:"\f0ce"}.icon-magic:before{content:"\f0d0"}.icon-truck:before{content:"\f0d1"}.icon-pinterest:before{content:"\f0d2"}.icon-pinterest-sign:before{content:"\f0d3"}.icon-google-plus-sign:before{content:"\f0d4"}.icon-google-plus:before{content:"\f0d5"}.icon-money:before{content:"\f0d6"}.icon-caret-down:before{content:"\f0d7"}.icon-caret-up:before{content:"\f0d8"}.icon-caret-left:before{content:"\f0d9"}.icon-caret-right:before{content:"\f0da"}.icon-columns:before{content:"\f0db"}.icon-sort:before{content:"\f0dc"}.icon-sort-down:before{content:"\f0dd"}.icon-sort-up:before{content:"\f0de"}.icon-envelope-alt:before{content:"\f0e0"}.icon-linkedin:before{content:"\f0e1"}.icon-undo:before{content:"\f0e2"}.icon-legal:before{content:"\f0e3"}.icon-dashboard:before{content:"\f0e4"}.icon-comment-alt:before{content:"\f0e5"}.icon-comments-alt:before{content:"\f0e6"}.icon-bolt:before{content:"\f0e7"}.icon-sitemap:before{content:"\f0e8"}.icon-umbrella:before{content:"\f0e9"}.icon-paste:before{content:"\f0ea"}.icon-lightbulb:before{content:"\f0eb"}.icon-exchange:before{content:"\f0ec"}.icon-cloud-download:before{content:"\f0ed"}.icon-cloud-upload:before{content:"\f0ee"}.icon-user-md:before{content:"\f0f0"}.icon-stethoscope:before{content:"\f0f1"}.icon-suitcase:before{content:"\f0f2"}.icon-bell-alt:before{content:"\f0f3"}.icon-coffee:before{content:"\f0f4"}.icon-food:before{content:"\f0f5"}.icon-file-alt:before{content:"\f0f6"}.icon-building:before{content:"\f0f7"}.icon-hospital:before{content:"\f0f8"}.icon-ambulance:before{content:"\f0f9"}.icon-medkit:before{content:"\f0fa"}.icon-fighter-jet:before{content:"\f0fb"}.icon-beer:before{content:"\f0fc"}.icon-h-sign:before{content:"\f0fd"}.icon-plus-sign-alt:before{content:"\f0fe"}.icon-double-angle-left:before{content:"\f100"}.icon-double-angle-right:before{content:"\f101"}.icon-double-angle-up:before{content:"\f102"}.icon-double-angle-down:before{content:"\f103"}.icon-angle-left:before{content:"\f104"}.icon-angle-right:before{content:"\f105"}.icon-angle-up:before{content:"\f106"}.icon-angle-down:before{content:"\f107"}.icon-desktop:before{content:"\f108"}.icon-laptop:before{content:"\f109"}.icon-tablet:before{content:"\f10a"}.icon-mobile-phone:before{content:"\f10b"}.icon-circle-blank:before{content:"\f10c"}.icon-quote-left:before{content:"\f10d"}.icon-quote-right:before{content:"\f10e"}.icon-spinner:before{content:"\f110"}.icon-circle:before{content:"\f111"}.icon-reply:before{content:"\f112"}.icon-github-alt:before{content:"\f113"}.icon-folder-close-alt:before{content:"\f114"}.icon-folder-open-alt:before{content:"\f115"}
monokai.css
pre code {
display: block; padding: 0.5em;
background: #272822;
}
pre .tag,
pre .tag .title,
pre .keyword,
pre .literal,
pre .change,
pre .winutils,
pre .flow,
pre .lisp .title,
pre .clojure .built_in,
pre .nginx .title,
pre .tex .special {
color: #F92672;
}
pre code {
color: #DDD;
}
pre code .constant {
color: #66D9EF;
}
pre .class .title {
color: white;
}
pre .attribute,
pre .symbol,
pre .symbol .string,
pre .value,
pre .regexp {
color: #BF79DB;
}
pre .tag .value,
pre .string,
pre .subst,
pre .title,
pre .haskell .type,
pre .preprocessor,
pre .ruby .class .parent,
pre .built_in,
pre .sql .aggregate,
pre .django .template_tag,
pre .django .variable,
pre .smalltalk .class,
pre .javadoc,
pre .django .filter .argument,
pre .smalltalk .localvars,
pre .smalltalk .array,
pre .attr_selector,
pre .pseudo,
pre .addition,
pre .stream,
pre .envvar,
pre .apache .tag,
pre .apache .cbracket,
pre .tex .command,
pre .prompt {
color: #A6E22E;
}
pre .comment,
pre .java .annotation,
pre .python .decorator,
pre .template_comment,
pre .pi,
pre .doctype,
pre .deletion,
pre .shebang,
pre .apache .sqbracket,
pre .tex .formula {
color: #75715E;
}
pre .keyword,
pre .literal,
pre .css .id,
pre .phpdoc,
pre .title,
pre .haskell .type,
pre .vbscript .built_in,
pre .sql .aggregate,
pre .rsl .built_in,
pre .smalltalk .class,
pre .diff .header,
pre .chunk,
pre .winutils,
pre .bash .variable,
pre .apache .tag,
pre .tex .special,
pre .request,
pre .status {
font-weight: bold;
}
pre .coffeescript .javascript,
pre .javascript .xml,
pre .tex .formula,
pre .xml .javascript,
pre .xml .vbscript,
pre .xml .css,
pre .xml .cdata {
opacity: 0.5;
}
raleway_thin-webfont.woff
wOFF >L `� FFTM l Zp�6GDEF � / 8� OS/2 � M `�dAcmap ҜE�_cvt ( �_fpgm @ � e�/�gasp � glyf 3� S,2qp�head 8� 2 6��VRhhea 9 $ hmtx 94 � $��,8loca :� /Fmaxp ;� ��name < � d9 post <� : �oE�4prep > @ @^˻yx�c```d ���6��'-ٴ�� Of� x���
Ü
����@,?,�vނ�H;��e�6�1��w� x�c`b^�������u�1�<�f�Ȑ�Ā��`��ʢb �����xR��A$Ǣκ$�� ^3 x�c```f�`F8�1��,������Pǰ�a1�R��k�(p)�(H*�*()�)�+�+�QTz�������Ep�
2h*���������������[d>Hy�� �A��_������uQ������ H0�+ z������������_@PHXDTL\BRJZFVN^AQIYEUM]CSK[GWO��������������������������������? 0(8$4,<"2*:&6.>!�W&�0�����H*6euI`������
�ld`hi%d: /�M� �L '�� ) ) % + . ' 7x�]Q�N[A�
��� 9�����6H �.��vc9Bڍ\�b\�P Q��kh(S�M��$>�O���5��4;;�sΙ3Kʑ�wi��sH�n�f�~'��E����FF��#-63z�}���f4�N@y�[�CF�N���2?��>��<��f��Zg!=��|3ni�5�Yw�A_�:\
��T���T����\m�63�wp!"?�hj��@ӟ:�z>�b r�l�
&��?�Dpa2]�T-3�vp��,:ؤJs��U���� ��-�2KC���*1B�$�BN9w�?)P>��1o��θa��q�50�����fS�[�0~G��/ƒ>��6F�؎X
`��QU���s/����3%`y��_'�;6/em�c����6��e�ݪ\�E��wU5T��C/g��O��ᠱ���}�@�
�
���ލ���Zu�U��o5�� �� x��|{|�u����هV�o=�c�H˰^-��J,O� �ՇJ(!�l� %Tя%*�S�ɃG!DU�C��J&Dql0��`B>X��!���8�C(��;��]I���������ٙs�=�<���!�L1�g�H���% j�)��lJiKT��J�r(W,'M�qMF��>÷Y�����n������%4.`��DrT$ S6��Lʤ܊�)��.j�D#��'�Sv�uY����
B��p�JRC �
�3
���S��9���}�B�Z���FU��U)_�#e�t�OY�V]�
48]%�@�ڔ� ���Jꭟ�P�eV4�j�Y�Y��MS�,�|s�1�hzͰf��ѣYn���z�
G �+���[�\�u����z]a7섴ޒ�.���ǶA��5v
����
�YY�Ϩ�}�����5x^��L��t�=%�/
G��+*GUU�4��?��
��@4
"~�PL���b,���h j��ξB��+��J<����ш}���ڡ��U}c���t��N��m���nO����A�
i�� dk,ɐn���șՆ%�W�D:]��{���D΅2SbXqh�s�8����D_�T�.I��j�� ZK�t�l�@�b�UK9�� �i�(Wrv���U��
�1��oҬ5��K�ĒD��<��Z��/uh�?�i*
G|
�3ͣ[A�����W-��^���F��4��
t��in≚���Gk��4�1���ռ�O,��t��P�������������윿�O.�<�����gr�S�þO��R�xh�e���M� �|����-i�Wn/�|l��-ӫ�0}��\��a8��DH��C��\-�Ԫ�v��� �W��V֊% k,�:�n�|��U��ɔI_6մ�&���G2�ʚU�u�[�Yc`�
v]i��M���Zn���Tw� j9]��r6��V��dQ����{A$�ё�5�*kj+��Xc�}~��x*��T� ���onI��J�H#4PM�tK��!V�P<���Vv��l���se�����c��u����ۄ�z~���8�yb���j������[����l�8��``mO��u��ֺe��/<A@N�_��#D)��@In4�i��ő�I��S�G�B�Lw����PgY-�ۢY��n)�jV
���n�f�����B�I ��e�ƞ�*/�>s�a��qӌ����~r������\������0g�pm�$N��/��l-���r��`�Q���"�9T��X ���������
{�pk��z�Ǎ��n�q�U��8����Yv��$L��[�d�� �j��(���P[�X�c1���gM9kN̚��9��˳fY6qMU֬��&<�ϒ{�ryŨ���Ը� E)R6>;i�{�3��_������x�~-�(H��I�G�,�a�h�"�6
����_)�?/�/m���ŅX�h&�����j!ҊJ%t���E3��N;�m��@L�5����B/wS��C���|�l�}[�����h�?Z�h븵J۬�z`��Ծust��
�NK.Z�a���{;���M�r�4����vř�c?�y�~���s������O
����mʸ����K�۴ ��.9A�0��"C6�VJ�ܧ�T���#�]����$p�蝓�M>M�Av} \��6�Щb�|$��)D����V����n�m}t��W���?P��V�=b�����lo�!�%����_����S�����G��#-�L��o����������~��h��U�ޘ���ƪ��o��=냕�ju���v�Ϻ��g4I+�&�������I �'�t/uIj�Tj����U"�s|�a%H *>B��뿪���K4�{X2�f
�م�����/4���ox�E��Y��zA��n~���k
�6p�h���f�p�C3U~�[�t/^���*c���UӅ7�T�j:�r�'Ȫ���I���$�Qk���FG�om�<�o�l�kk���������xrm�Z�c�S�va�T�g.1 X`â��4�Q���V�ܥ��ʓ2]/�B�r�t����@c�d֝8�j&nQ�+���|*��i�}Q��O�����0��y�|�t/i&�7eT�l��\
���������>�ϑ�
Rz*mA�t(���*�e��UJ����uG�*e��%D���T�;u�_�,~p���'�D����%�%�/Dƌa��;:ټC����y7b���w~q��}0N��� ��)9=%j~�t�C'���@�����T�h�l���P4D�}>~����N�������`�$C:N<��L#9Z<
6�B/������j
�z|J����,hϰ���S@#�3a�Gi
��4L^Е�rZ~j�k��o�9g�^W�>z����ǯs�@�=g_�ڠ�%Itٍ���#ߤK�/!"@䗥��S��i�䷥!��Q괔�yi�9<x��y�8p�j��ࡀQb㖞B[��zidڷ�J:��&�����մx���.]��3@�:�]RO^!��HKh ����f6e�_�������ycZ�y�HT|��~�!T�,9l�����p��RK�l��փ[���q��a#ۦp���FXKw��dsЎ�����R]�q��{������=O3`e�H��zimt3}-
S��mm��̬��QJ��S(��^l]�ա�>�����4�lKL� 誙lz}UY��D�=�����l�� �K�M)n^T�x[r���(�J5Q�1fƗw�|���rMQ��/=�n̟a4U&T}���������$�f��ِ�$�+ń ��*��c��@oU̡����j)t]sZ���#�� f�$������n�Y�5�\8R�|�H�� r!pc���8�i((���
���6u���Km7�zuW������O]���o��m�;Vm�{W����}'t������D���u[/w��<���O�7��=�O�l�H �ȴ�b����$n�UQ|�L��ʷ7e��l:yt�H��l���ES%�UM��J�य़~�
ؤF�F�H�`�KpY��5|�����FU_����wgL<?���Oѯ��clLNK*�]C�z)��r��Fq)�80��ѩ �Q����}33l��^����Woz��aby@R���RA�R���8 T��=�H�$�����֟o�o\���M{�\��M�^�00e:�/�u]Y���3}o~j����Ov�Y�j�K��n�ՠ�ʇHI�
$W�3�����"�ȸj"���`�H4�WP�����,�4tN�J�.v���@=J�˗�T�C��<M��渱(�� ��_�)��
�2�B�t�:�o-��4�(��#��F1$F�4C�����S[Kw�2ѐ8��tž���T����<��#��싚 HB
�u�W=k�Nز�*T�ƾ�ލ;�9���;,���S��=��/D�M�m}���J��g�7�e�d�Oz
��� �WK@^()t�pP���/�A�aP%TA�AaPE U%�q�����آ�HJ8+m�o͕7�Ŗ�=�WFF�����h�B�F��Xߘ��FcR0��'���r�R����[�Yca��b@��d|c��S��+��ԏ� �nW�c|V)�43�_��him��f��Ɂ�P2҈��$�Ykb����oPmO7��[��ǾnF��_�i�g?�ۿ�y��M���qk��kt��3���Vw=���O���[��y��='O��9uFHn�~j��}�QW,��IsaΡ�����3G�PP��X3ٴ��o�0�7�&�(�%Lb-�+��N��� ~��cQ>�5�d1�dZ∢�}���h!�(��j1tQ��j
яڑ��t��t*d��:G��j����ԋ�{w�*Q�����SCY����}���=KK�+��ׄ��h�c���0�ɾi�%�4~�Y�T��3ԥڃ���@rڥ���<.p��䂿�N`S��C������_ ��9wt/��Ǚ#*�����F��%)S`��Ow:'�x��>���L��z*1����z��R��"��5��k<Β`,��)d5a*Ւap��ds�,�O���(a�M��Fa��Λ8��/DN���T��@��iI�
�� ]����lTF�8#i�IC�8o�u�R ��Nڣ��$����7Q����.�9��X�E�s�s�-�g����>a>=���u������Nj}�c�� ���Wx��~y�~�q@_��8��-*��Q�F�*���O_���BwW����yI�:}-i�l�k����R�3$׀���0���hx��Җc�M�:W.
R�S[u��
��53�V�i:��nD��l��-4���p�`;���]:g�T��E�.wї{�1C3jt��bNܺ�b���81
~��+U�X3�t�<�F��� �d�x���w��6;}��_71Q����E�R鹝%�t��'s'Wj��iKg<��e��갳&\�Wff'����#���g:j�}Vѥ3d2�C���SV��;��=���kv�
�Weʪ劋��_2�e [
eL��)�5�&rįWȿ�pեQ�'�����S|��JZ��v\�D�Y��g�G�X�`��f�W:I��>ixQ�W�������l8�EA�)�O0�'�j�o1jA%�j$ZK|�M�F�X-���S�N4d�:Cێ\��wV�=07+m����۾{s���_)߷�f��:kE&b��/ۿ��'it��P����Aj}iѺE' _��� ={�.9b\Z�a���ܺq��T�ɇ�k�G�''/���/�|��i/�O�g�ys���#�W��R����++_Zȡȳv�"}�M��C)D�}�J�Pj,E�=š�p�����gӐ�4ti�IXfn*��?6��߱f���)i0an���Y ��|S�]��C�U.�*n�N</����0[1���11*��:���ky�kׄ��.�f5Ch���ԍXD���o
��Q|����E��/ʄ�۲4"����E7�Y|�*k ��*����Q$��^��r"J���:w������K_��������6�ۅ��x�[�=�O�:��q���鍛N�?ܰ騀:rɝk�� �@�)��A�*^�7I&�
��D��@)
8�NB(��[#^�-�%��Vҭ{�Oڻ������C�x��K�����z��}�C���}�}�^xp�k�9�i7�
����0簳�aR�g����Sd(�|N�3��yT���t7=Cg���6��=�>E�����/��������>{�N�i+L�5�T�Cj:�d�;� ��'�l�����p��n'nEg�*�Q�������6���C>�����yz���N��lz�g����Os��iC��'�����K�\�gB|RM\%Z��q�(�C��� �#k�R��oL_��\Y�^����h�y��S�JԔ�dbQ�˳�B4\V<�'G>�Kb!
´� Ӷ����$�]o?E7���1y���/0y:�I'���7l� S�< <���rj�rC�d�Ÿ*�$LLSH�n��
OU�
�l������`�| ?Gȁ�8�O=����ƈ���A��nO���[m�����
�6@��^�^B0e:��a����D�5���ɴ�3pˠW�5D��۲/�%K�h�®Շ��Ν�����.�kv�8�v&��uon1�|��T�sʛ!٠�{Eθ0��F���s0Pt�%�}�B�KL�Q�'�����I�p
t��:�ꧯL����{V[��Qc+.�ܒ^QZ�sؿ��Q�IcN����������>��m����f~�ૢb?gO�ľ͇����sC��X�D6{D����� ��01ou�C�R*�^�� CJ��IF��*��).;L3y9CNT\�`���(���^Kt�Dि�2o�LL��M�MK ���^Qu2����+X�an8)�"i_W��%tE�|G4�!��WZ�o��R��~��թL�,"9�O�ؚBq�]�|�W��P7'���W|��F3�ԋ���q�S�Aq�Pߞj�#cR��\�&���&/�������w����Nr�6��Nd��@�n�8:�d�p�a��s�/7�Z��Y�ZXI��
P��:�����o�*]N=T�w��e��Z$N��I�%��=KR�����<}̄�������6��Vࡋ����~P�N7�#N$?04[�l��d!�V���RiL:Ţ�l��}�����\؟?)d�^8���90No?e���^�߾��#I��Y'�a���L�A*b�
P��0��W�1�2+�9����G���+c�D�0���O���Y7��W-s���z�t�¸���x>�����A;G��ӪI
��/��#��!kZP|��:"1p�q���7"-�;��FG�[l�駩�����S�=��[ww����.њ��&�-d���vC�>w�܍���+�o%����ۃн����S_��� ̦y�4���
�d)J�#k�}wɈ&9�29y���&{{����e�m���LD�y{O��@JWݹ~�!�$�I��݉\;R�+�'�Î4�dC�� UX�"��~�阪�i�$RQw��(�w���:د�W�]$�E�Ybu��" ��h��I-����%V��z -��>�gў=���ζ��Z���
��sG��=��>�/��c��VNݻn���
m�^�������7��O�ڵbٓ�t�S,���L�x4�@@�6��869YA�/��S�� �22���ԙ?�˛t�V�)�v碌Xb���4�,K�_=����b8_
��,c�!4���H[]�(n�k�xa��c�s������g?�9/&�ȇV=�9gn���Y�G�/=�塶ǟ?�mS+�vpc�B:x��at�(A$6���0�x�E]71�R\7�'(4�����*� �B�A�I {?����&�OK���I������d>!*�b]@r>��fE:Y�����ߗN����p�u��5k��(�а�p��_�Gp�4�@є�M6ݍfI#itNva�/�`^ng:N�zE�H�]S���%o qW�2�,Á��fN��� ��Th�T��|Ws�P3ܼoN�u
Ũ�#m����S�-�|�]�@0*)n�I��OBL������7�� ]����{���U���!�?0x J���c��4���y��r�Éc��w0`\�X"�ȧ1^����r��ɼ�>I!�A�[fk��a��
���O]+�\}���j�U�7TaN���u#��f'8%l�q����Dž�J�^�]��f��oNz���ۣ��H�f�f�vd�&��9�'L4��?o&���p8_�7���6��s��7Y����Ϻ�iN�\F ��!/gW�g�>�
c�O��
1AS��������)V���R�S�˖9� v�����X"���9]>0�'�ܔ?%�r����o�?�Q�R <�,��MG��[
��t������d(t!
�y���6�~J���A�vc��s� ��WAOg�+s��r�!F0J`��x$q�K+���˖�U�跂\�#��W�o)�q���
Y�����B}Éuw�7`6I��`�
� ��S�V2aV1- $��#�
�-_
6G+v ~�;?9�e˶o������Ya������p]ư��ӥ�C�59lɎ��\���_�r���#���S�>2���OS�4����tg��bw�
>'*������O�lZňx��w#jϣ'0�=b��y>.�$9#��|� �0�RA����Ί�D���!��8���#
��xA�D�qZ�86"��MQy�se�w�sU� ��j���ɍBJ��Ʌp}d� ;.p}����% >rIf�k`�jx��O��z��e���hD�����<�Q��<է�_)��J^ �����E�<.[-B��p�6B�t2��X]C+»-�-�)b�;��؞��c�/;�/�'��XÜ�;w��:6\�T�}���ѦOۻ_�n}�/ߧ�B*�d��g����������=w�J��RJF��*�)X�k0���HF�c��� �%hiSb~�@��å���n������Y ��4 )���|���c�ѣ��x���ܙ����?N5�>������T��}��ޖ��'��NR����k!��-��l���E\���X���r\��/TW��9��Zdl�L��T�L����[4���ߔ����A{���M��������-*Y�y�������B|����HIY��&� ]�ÁV$'�a�oɣ@r��9Ջ��b�W�7�Y?��օY�4T5D|����S�Sh���!FG�t�{�4*�0��u@�N�G۞}\Hط;����i����`b�u�f��g�_��\�a�A�$��ci.�8�1��7w�� }jȏ��:,���9��$*�Ռ�n��,O�b�#
��{k��K*�7p�F�A�K�϶��)�~]��o�禗>�i��/����t��a����y.�I�.зX�Uΰ��慂�4V�9
�A9�,S��?WVɰCR�-G�A�^
��=������4r4��B垿�;�q��i�h����~:�>���}�|>Z�)�����'��7���Ye�J���ɣ$W���F�!��L�R~��J �RCX��c\d0�gUb�$k}}��[V�M��V�WTc��y�R�! k�b��BɑoX�@��}��VѲ�7�u��c��l���-��M�3�Z��I1j\�r�&���k���g�5����U��
�&�M�}ǧL«�y�#�1�����.F�}Z�
�0p�=3'��bA���ԖӘO��V�u��������ݷ���|vS�]�7��賯��/�z�݅uG�J��D�%�z�XL��ҥ��W�lg'����V�/��8�l��7�WZ��#J� ��y6�+"�M*��"b�-,�Sb
�"���r�}�ҭ�Ӻ}�<�e�����5��'x��z �����Hl9�nDV��}��4��}*�#RSC�l㏏rwr(�c����_|����$l�it�����g�u�l�mЁ&{�}A��/<a/�w
��[v�ׇ�\�W��gŘ�����a�X
n)>>#��� 7[��,g:���S�!}z���TՀ��5�K��:���$)�Tu &�Ty��X�B��"O����n� �<M��Ъ�ٱ��E�(�1I���e-c���Q&�<;܀�e�3;,��p�MW�!P-qx�Rt�y�J�+��������߯��Pkǂ�#��E_߽맺��ew��f&/|�3�Q�m{��5�`~����K_as|5��ʋ>�Y2��XIG͊�"'�_97]X�x���w��g��;��3NJ�cu��ףO���y��T]�e?�@�}���q��_�ۇ��9����9��0WYmЇ+��piQE������D
7�l%P��>E��)k���j���<�w��s]��'� y�� �&7;�ϼj�@����3t�apH죌�n{��h�H��y��#4&F�b��Џ��1ĕi8�~8V
��tr~V �)r� �Gѝ*�����H��x}�9��8��Ҭ�on9~S��x�Ӿdϖ�_\����#;����&�6�'t��v���������#�)}�P�c�؇�#�����4�i9gi1�i�#�5��D��)ZvhL�����a��k���!M��4M�6~pp���S�ȶ��c�_Zu�~[����[�_���y1�<���S�K�&�!�]�Mϓ
��8qk�O���0(jG�<L���`}�K���6�u��$���������2��$9�����>w��/���&�C�kGC��c�
�q���q7_"8!S�$r!o���*TT
�%A�tC(�Q@L���=���t�ڵ��;۾w�Ư��O�x����1sv��o�ܽ~����Ж]K6�������k�UWϙ��i���\&˻a�}���?�^���,�u��ߵ�"<��"�[�ѥb�8���������
𧀏w�47;cYXJ,6f?"�:]co���N3�Ry��R>��T�*2��I�Gʍ�V$�c�nG�t�-/H�7��y5 '`� �Zg�;T�x�`�``��.ǻQܭWܻ~a��RU,>���yg%��Ж߿䋝3~�S�L0}f�7�6o �'"��nVxo��.�~|SA$��
�6;9I��}I��^�ū��1��J��{t$��Pݞё��؏^^�ǰ���r��ֈ�`�@��h�?6��?p`B*T�H�%�X��A�o�����w.?��p����r���������K�L8���NJN���|��\��]���Lکz{�dc$̦O�_������p�P�ؘ-[������x��N<�$�"$Kӈ�b5G�>���a��+�{�}1���������gc��Z�v��ŞG{Z������C���ߢoٚ�1~�@�~����o&�ڝ�b��J�c�{=0$�%�e�l������b!��tcb�ɪ@�h��/n ���]耻�u�\@�ѻ��C�eҭ-��$=K�I�7{kV�
{���ڭ���s�P�+n�~����m��9��.&/�m�bT��:�4|Ν#T�x�
�V'_ϭ�7��]���o%��V S��\��n ℸ#���Q%�:LD���9�Z�t�-���E:�kn�HC1��a�DB�P�.�kNL��xD aՊN���*]�<�������E�LV�G�NN+Ā�>kPA����u��G9�=w��K��j�7�Ĭ_Y
+����$V��f>]�X���J������;Z�ο\�+�Y��j�/�@��
ְ9Ec��:k��� �Y��V>��C�'����5a�������$��Q�����:?�}2��S�ra� ���h(q��\�D(_%�pS=%����`YڈW�hM��f�ĦcY}F�.8����~�&q� �m�3MNA ������1[�ij�Nʀ{+���V��t.<�9 !'w3qR����E��J�p��,"��X�$"~�s�,������Y������e�_�G|J+-��N+��W�(�}:�������v��t����z� נ�@�_����cv�}V�������E�M>D&�F��`��V�Ai!�o��p�l4Xr2�'LȔ�$�Zg�Y
��D\5*���d<�3���x�|�&�$>���V/eNh��lU��<,ci��� *�G_�[v/�a�̶
n���UY
�U����]K��\L(,����$W)��Q�K�8S=aĹbI�x��
c�����p)��c E
- �|f,k�\��d�_C�6R������� �ƊZ[��a�s/�nm�/8諾�cxʽ%gw��1��-����Dv�����U�gf'v��]�Y�8՝��<�z�\��jh�N��������<��Ѵb�}���O�9�«G�1}Tݫ'��qM���[�[�+}G~���/%0�.�:�P;.1�=SӅ��#2x�s�r����N��+��G��(�����Z�w����S�� Q4�ܲ�A
� ��V$9��c�*�ff�P�!�o�
��A%15�=Ϟ�J��_���t�O�=��&ݎ�szf�β?kdan8H��'�<��Q�B�n_Kҁ(r.r���Ha-�p��W^xRy��L*��D��+�ē��RoT�K����༖��������PG�K�P!�R@���᳴�^����I��$M�����}�^MU���d���
5!�$�a���){ǂ�DD�_��m_������B��|�u��j����]��]��5�ȨX�&�:�� ��ot}�֪�k�N*�����t�\c���Z>��Q��Ok>~��if�$.Z<�Ɨ��D�}ҥ���k��?��G���o#����z�,��^��?_/_)\�){�q� �4��^:������EY�ī:�7���l1Bu�T�����T�"��Ox]��K����C�D�����9���V�S��Q���+ غ0|%�UuH:<$$Kxg�ҥ^7<����^:���
� ��0�!"��W�����X.��b0QU����CGh���H��%|H.�ѻYp7;��-�Dg2~T���ńP)Oi��w��/�ep6��A!m�w1̸�p
�����ɻ���#zEx���|�>����F�@|���U|uE�%1`Wh����϶����^_��ic��77}�#H*2�Lђ����o���[�X�^X�R2�r���ѿ���;�?�k� 3��O��(��E�O���Y�a��t��`'
bL�\� tO�9�V�:���*
����l���xR�� �k5��%�uD������|
J-�gC�+��УQ��
��(��\�8=4xJP����1 ��_�K�C�ǓB��H��u��v����� �M��|�
]v�ˊ��r8$����ry�P]X|k���z��^�B�4<��k��� ��b���Ɠfp|�{
�q��x��ՏJV +�����M��r�U����\�>��^���״�}��J��ԇ��1ѷ�x^��30��O�N�[t=����O+��-�^�Wҝvk`���%d����������A.oA<5
�H�������J0W2|���l++�#�����\>���~jtDc��R���YE�k����fn^0�#
���� z]�
����yÜhT*��|Ǿ�y�F������uiЭ��q�ь����n����KC��a�)s��Fץs�1H�w{���J��X����x1�Y;��E���Aajc�P�x��ݙ�O��m���gK���XM����oذy3b���_���O�L�͐\���]߹�X���W�8�-/%�r𭀖E���s]��i"ɁBMM"e0G�����'
�!+����xd�RX2A�I)scU
XZi\
�3���.7������t.q�%thK�`s���}O
)�U��-(�Q�e��孁���ǜZR���HK���M��FA�0�=�{���|��[���E�Ѐ��!���t�nIdWn��ް��M�r?���:����J�x�c`d```dp<aq�6���+�<��dӁ����3�`kr9�@� 4d
� x�c`d``c�����������9"�"(� ��+x�5��KTQ�?��s��HyPa����1D��D��P1��H�Fk(�p3��.DG��-B"$�1�j-����J$��4u����9���=�^��bL?˦E]N��2�����S29�f��f�1�k�< N�eh\s�-^�)��-��r�@��mʶ��-�7����%�����~��[$����m�U7dR1Jõ�q����G�
4%O��t_y�/1+O���γ'gܗu�=5��P�5y�w�H M�X=�I�z�9b~�+�Td�X��].�s��!)�����7�T��߯�w��8�a_�u�1eYU�"�а'���ZWS����9����ԹS���䉕�l�j�����"7@��s���Q�K���A�ﴫ����rQ�h�H��'�������{U��h|���O2�B�$���HJ���7�C������q� x�c`��F�L-�XDX\X�X�X#X�Xװ^`cbb���~�C���S�Ӌ�W
���"�v�]<<�xsx/���%��������?�����@��)A��
BIB'���w�p�<��!&"� V �@�8���� ��s��5�?�l�2��H�H�I��I�9"k$�${INI�F��
�%
�#�)~S������Ae��:�ء*�����j�j��2�kjzjMj[�>��z��'
��[�4�iN �ERR � O >