Skip to content
← Back to Community
Fluid Simulator - Google's Liquidfun
Profile icon
mwilki7

I searched everywhere for sample javascript code for this (based on Box2D which is a C++ library) and finally found something functional.

The only things I added were html controls for the objects.

Most of it is based off of https://github.com/doebi/liquidfun.js-demo/tree/master

If you want faster framerate, shrink your window.

Hotkeys:

• B : Create physics box
• W : Create blob of fluid
• Left mouse: Create Blob of Fluid
• Right mouse: Create frozen box
• Middle mouse: Create physics box
Voters
Profile icon
Leroy01010
Profile icon
Roar123
Profile icon
JacksonStahl
Profile icon
zhidao
Profile icon
AndrewFoster1
Profile icon
rspilleriv
Profile icon
xBlaziken
Profile icon
44zdawg
Profile icon
agiboire
Profile icon
TylerBernardo
Comments
hotnewtop
Profile icon
AdCharity

ngl I'm pretty sure if you tried hard enough you could conceivably make something similar without basing it on something.

Profile icon
mwilki7

@AdCharity
rotational physics 2 scary 4 me

Profile icon
AdCharity

@mwilki7
physics 2 scary 4 me even though I'm taking it next year

Profile icon
mwilki7
Profile icon
SixBeeps

@AdCharity

image

Profile icon
AdCharity

@SixBeeps
leave me alone 😢

Profile icon
mwilki7

@SixBeeps

pls not partial derivatives
ಥ_ಥ

Profile icon
SixBeeps

@mwilki7
oh is that what that is? i thought euler just smashed his keyboard and called it physics lol

Profile icon
MatthewDoan1

@SixBeeps
You mean his typewriter?

Profile icon
AdCharity

@MatthewDoan1
For euler it was probably sticks and rocks

Profile icon
SixBeeps

@AdCharity
euler caveman writing

Profile icon
Leroy01010
Profile icon
awesome1238765

Man this is cool

Profile icon
MatthewDoan1

My friends: So what do you do in your free time?
Me: It's complicated...

Profile icon
xBlaziken

I don't recommend jitter click spawning in the water or else the repl will crash. Also i get 45cps so it might just be me lol

Profile icon
RobertFurr

9.8/10 could use more features

Profile icon
HackermonDev

Whats middle click

Profile icon
mwilki7

@PDanielY
spawns physics box, by physics i mean it moves

Profile icon
kindred

Screenshot 2020-02-15 at 3.34.21 PM

Profile icon
mwilki7

@kindred
ive been seeing that happen to me sometimes if i leave it running for too long

Profile icon
[deleted]

I don't see anything when I run this. In the console, I get errors from PixiJS about not being able to initialize a shader.

Profile icon
mwilki7

@sugarfi

what specs do you have?

Profile icon
[deleted]

@mwilki7
amd a6, ubntu 19.10, firefox

Profile icon
staticvoidliam7

this is so fun

Profile icon
mwilki7

@LiamDonohue

glad you think so
I have only ran this on my machine, how is the framerate on your computer?

Profile icon
staticvoidliam7

runs nicely on a (older)chromebook as long as i dont spawn in to many objects (aka spawn like 100 blobs)

@mwilki7

Profile icon
staticvoidliam7

and 50 fps

@mwilki7

Profile icon
staticvoidliam7

if u want me to i can be ur tester and push it to its limits

@mwilki7

Profile icon
mwilki7

@LiamDonohue

give it your best shot
just don't melt your computer lol

Profile icon
staticvoidliam7
Profile icon
staticvoidliam7

ocd mode activated

@mwilki7

Profile icon
staticvoidliam7

ok so what i found is that you can completely push it with the physics blocks buut the blob slow it down pretty quickly. will that be cash or credit lol

@mwilki7

Profile icon
mwilki7

@LiamDonohue

umm do you accept upvotes (´・ω・`)?

Profile icon
staticvoidliam7
Profile icon
mwilki7

if anyone could tell me how to change the darn fluid color that would be rly nice

Profile icon
[deleted]

@mwilki7
in the let current color variable, change the R G and B values.

Profile icon
mwilki7

@TaylorLiang

sadly ive tried all sorts of combinations of stuff so far
i can change the color of the boxes but not the fluid

even commenting out the line: pgd.set_color(color); doesn't change the color
i think me mind is going ded