Interaction between objects and 2D detector?

p5.js Libraries
1

Hi community, I am currently exploring P5js with posenet 2D pose detector. I have currently fiddled around sketched by following objects in the canvas and doing a similar action. I was wondering how can one make some simple interactions. I am , thinking for example to move a rectangular box from one corner of the canvas to another corner using the detected keypoints. I am basically looking for some material to understand how interaction works and if that is even possible.

If any one has explored this and has some theory / example suggestions that would be really helpful.
Regards
T

2

Hi @Timo,

If you want to have 2d physics running in JavaScript with p5js maybe this can help:

You could setup a collider attached on your posenet detection and make it collide with other objects in the canvas.

3

Hi @josephh does the sketch work for you . It actually throws me an error. It seems like there is a video tutorial on top of that . I will go through it thanks .

1 Like
4

Yeah, that sketch was broken do to some old editor.p5js.org funkiness. Here’s a fixed version

5

However, I would definitely recommend using Matter.js over Box2d. It has better documentation, community support, and is a native JavaScript library instead of a C++ library ported to JavaScript.

1 Like
6

Thanks for the matter js example. Could there be examples of moving objects using detectors (posenet ) movenet perhaps