Skip to content

Instantly share code, notes, and snippets.

@jpfaraco
Last active April 29, 2017 17:46
Show Gist options
  • Select an option

  • Save jpfaraco/f762b10605e17b82a40e94508a689a38 to your computer and use it in GitHub Desktop.

Select an option

Save jpfaraco/f762b10605e17b82a40e94508a689a38 to your computer and use it in GitHub Desktop.
HCL Gradient
{"description":"HCL Gradient","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"ajax-caching":true,"thumbnail":"http://i.imgur.com/v89bzrU.png"}
var size = 485;
var width = 1;
var svg = d3.select('svg');
var data1 = d3.range(size);
var rects = svg.selectAll('rect')
.data(data1);
var colorScale = d3.scale.linear()
.domain([d3.min(data1), d3.max(data1)])
.interpolate(d3.interpolateHcl)
.range(['#0088ff', '#ff3f00']);
rects.enter()
.append('rect')
.attr({
width: width,
height: size,
y: 20,
x: function(i) {
return i * width + 20;
},
fill: function(i) {
return colorScale(i);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment