A recreation of a lovely GIF by Dave Whyte. As the Exploratorium explains, “Wave motion at the surface of water is made up of small circular motions of parcels of water.”
license: gpl-3.0 | |
height: 760 | |
border: no |
/* bling.js */ | |
window.$ = document.querySelectorAll.bind(document); | |
Node.prototype.on = window.on = function (name, fn) { | |
this.addEventListener(name, fn); | |
} | |
NodeList.prototype.__proto__ = Array.prototype; |
By customizing the display of D3’s brush component, you can make a single-handle slider. Or, by using custom resize handles, you can make a two-handled slider.
This brush snaps to day boundaries. As the user brushes, the brush fires brush events, allowing a listener to adjust the brush extent. Compare this approach to using brush transitions on brushend.
This brush snaps to day boundaries. When the user releases the brush, the brush fires a brushend event, allowing a listener to adjust the brush extent. Using the new brush transitions released in D3 3.3, the brush smoothly interpolates from the original extent to the rounded extent. Compare this approach to using immediate snapping while brushing.
This example shows how to use the d3.hexbin plugin for hexagonal binning on GoogleMaps. It is an update of Mike Bostock's Google Maps + D3 block.
Simple time series data modeling composed of a trend, seasonality and random component with dataseries.js.
Each curve follows 2d perlin space at a different, but nearby, z axis. The result is the appearance of topology as curves expose gradients in noise function.
// XL for Bootstrap 3 | |
// Huge screen / massive desktop | |
// Inspired from: https://github.com/christhomas/bootstrap/commit/09c94ab34a497785f3112a5951f225c21aec6aaa | |
// Note: whoever didn't think of this in bootstrap needs slapping | |
@screen-xl: 1600px; | |
@screen-xl-min: @screen-xl; | |
@screen-xl-desktop: @screen-xl-min; | |
@screen-lg-max: (@screen-xl-min - 1); |