How to detect drawn shape

Archive
1
:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By exciting_desk

What I am trying to do is let the player draw with his mouse for example and if he tries to draw a circle for example I can figure it out and replace the inaccurate shape of the player with the sprite of a perfect circle for example. I thought about using larp() and calculate the distance of each point to a point supposed center of the circle. If the distances are relatively close then it will be a circle. But I’m sure there is a better way to do this ? Thank you for your help :slight_smile:

You can approach things two ways I think. The first thing is just to smooth out the line drawn by the user. I think there are multiple ways to do that, but I found this interesting article on the subject: Drawing smooth lines with cocos2d ios inspired by Paper

The other way, is to provide drawing tools, like circle, rectangle, etc… The user will draw what he thinks is a circle, and you can match it to the closest perfect circle.

I think these needs to be separate functions otherwise you could come into a situation where the user is drawing something, and your software thinks its close to a circle for example, so it matches it to a perfect circle and it’s not what the user wants.

MrEliptik | 2021-07-02 09:52

I’ve experimented with the same idea and managed few working examples

My thinking was…

CPU version:

  1. prepared set of patterns:
  • each pattern has same size (200x200px for ex.)
  • pattern is collection of circles

  1. while player draws you sample his strokes and scaled it to the same size as pattern images

  2. compare given samples with predefined pattern → futher from the center of a point, the less accurate (you can set for example 5px radius)

  3. … do a lot of optimalizations and thinking :slight_smile:

GPU version:

  1. prepared set of patterns are images with thick lines that fades from center to sides
  • stronger color = more acurate to the pattern

  1. player draws to texture as well

  2. render player’s texture with fragment shader and pattern as mask

  • for example if pixel is on the mask, save it’s color to x channel (higher number = closer to perfect shape)
  • if not od the mask, use y channel
  1. check the resulting image → sum up X and Y channels to see how accurate it was

IceExplosive | 2021-07-09 20:44