データのぼかし
1次元、2次元、およびRGBA画像用のボックスぼかしの実装。小数半径をサポートします。
blur(data, radius)
js
const numbers = d3.cumsum({length: 1000}, () => Math.random() - 0.5);
d3.blur(numbers, 5); // a smoothed random walk
例 · ソース · 非負の数値である指定された*radius*のガウスカーネルの高速近似のために、移動平均変換(ボックスフィルタ)の3回の反復を適用することにより、*data*の配列をインプレースでぼかします。指定された*data*を返します。
blur2({data, width, height}, rx, ry)
js
const matrix = {
width: 4,
height: 3,
data: [
1, 0, 0, 0,
0, 0, 0, 0,
0, 0, 0, 1
]
};
d3.blur2(matrix, 1);
例 · ソース · 半径*rx*の水平ぼかしと半径*ry*(デフォルトは*rx*)の垂直ぼかしを適用することにより、指定された*width*と*height*の行列をインプレースでぼかします。行列の値*data*は、フラットな(1次元)配列に格納されます。*height*が指定されていない場合、指定された*width*と*data*.lengthから推測されます。ぼかした行列{data, width, height}を返します。
blurImage(imageData, rx, ry)
js
const imageData = context.getImageData(0, 0, width, height);
d3.blurImage(imageData, 5);
例 · ソース · 指定されたImageDataをインプレースでぼかし、半径*rx*の水平ぼかしと半径*ry*(デフォルトは*rx*)の垂直ぼかしを適用することにより、RGBAレイヤーのそれぞれを個別にぼかします。ぼかしたImageDataを返します。