Skip to content

Instantly share code, notes, and snippets.

@mbostock

mbostock/.block

Last active February 9, 2016 02:00
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save mbostock/6909550 to your computer and use it in GitHub Desktop.
Save mbostock/6909550 to your computer and use it in GitHub Desktop.
Download ZIP
Non-Computed Style Tween
Raw
.block
license: gpl-3.0
Raw
README.md

An example of using transition.styleTween to avoid using the computed style value, and instead use the style value as-set.

Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<body style="background:brown;">
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
d3.select("body").transition()
.duration(750)
.call(styleTween, "background", "steelblue")
.transition()
.call(styleTween, "background", "black");
function styleTween(transition, name, value) {
transition.styleTween(name, function() {
return d3.interpolate(this.style[name], value);
});
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment