makeFluidSystem = () => {
var fluidSystem = new Floom.System();
fluidSystem.gravity = new floom.Vector2(0, 0.2); // 0.004, 0.02
fluidSystem.wall = new floom.AABB(
new floom.Vector2(0, 0),
new floom.Vector2(
floydSteinberg.width * scale,
floydSteinberg.height * scale
)
);
var mat0 = fluidSystem
.createNewMaterial()
.setParticleMass(2)
.setColor("#000");
var mat1 = fluidSystem
.createNewMaterial()
.setParticleMass(2)
.setColor("#eee");
function px(x, y) {
return x * 4 + y * data.width * 4;
}
for (let y = 0; y < data.height; y++) {
for (let x = 0; x < data.width; x++) {
if (!data.data[px(x, y)]) {
var p = new Floom.Particle(x * scale, y * scale, 0, 0, mat0);
fluidSystem.addParticle(p);
} else {
var p = new Floom.Particle(x * scale, y * scale, 0, 0, mat1);
fluidSystem.addParticle(p);
}
}
}
return fluidSystem;
}
data = floydSteinberg
.getContext("2d")
.getImageData(0, 0, floydSteinberg.width, floydSteinberg.height)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
