Matching dynamically drawn triangles and differentiating angles - actionscript

I am making a game wherein the user draws triangles on a grid and be congruent with other triangles. However, the user gets additional points for having their new triangle in a different rotation from the original. I would use the rotation property of the movieclip, but since the triangles are drawn into a dynamically created MC, they all have a rotation of 0 degrees.
Is there some way to do this? I am absolutely stumped.

I think this is just a maths problem.
Firstly, if you have an equilateral triangle, you wouldn't reliably be able to work out the rotational difference since the sides are the same size.
Otherwise, you will always have 'the important side'
Assuming your triangle is isosceles, your important side is the one that is of a different length to the other two matching sides.
Assuming you have a scalene triangle, your most important side is the longest side.
Once you know your most important side...
You should be able to work out the important side of the users triangle using trig.
You should also know the important side of the base triangle the user is trying to draw against, since you are 'making' it.
Then you basically have two lines (the two important sides), use trig again to work out the difference in rotation between the two lines, then you are good to go.

I solved this. What I did was have the program dig through the triangle to find the left-most and uppermost point. Then I draw all the triangles using this point as the origin. This ensures that regardless of the order in which the dots are clicked, all triangles will have the same point of origin.
To detect whether they are matches, I wrote up a function that copies the triangles and moves them to the same point. Because they now have the same origin point, they will occupy the same space if they are of the same angle. Using this, I then wrote a function that checks to see if the triangles overlap completely.

Related

FEM Integrating Close to Integration Points

I am working on a program that can essentially determine the electrostatic field of some arbitrarily shaped mesh with some surface charge. To test my program I make use of a cube whose left and right faces are oppositely charged.
I use a finite element method (FEM) that discretizes the object's surface into triangles and gives to each triangle 3 integration points (see below figure, bottom-left and -right). To obtain the field I then simply sum over all these points, whilst taking into account some weight factor (because not all triangles have the same size).
In principle this works all fine, until I get too close to a triangle. Since three individual points are not the same as a triangular surface, the program breaks and gives these weird dots. (block spots precisely between two integration points).
Below you see a figure showing the simulation of the field (top left), the discretized surface mesh (bottom left). The picture in the middle depicts what you see when you zoom in on the surface of the cube. The right-most picture shows qualitatively how the integration points are distributed on a triangle.
Because the electric field of one integration point always points away from that point, two neighbouring points will cancel each other out since their vectors aim in the exact opposite direction. Of course what I need instead is that both vectors point away from the surface instead.
I have tried many solutions, mostly around the following points:
Patching the regions near an integration point with a theoretically correct uniform field pointing away from the surface.
Reorienting the vectors only nearby the integration point to manually put them in the right direction.
Apply a sigmoid or other decay function to make the above look more smooth.
Though, none of the methods above allow me to properly connect the nearby and faraway regions.
I guess what might work is some method to extrapolate the correct value from the surroundings. Though, because of the large number of computations, I moved the simulation the my GPU, which means that I have to be careful allowing two pixels to write to each other.
Either way, my question here is as follows:
What would be a good way to smooth out my results? That is, I need a more accurate description of my model when I get closer to a triangle.
As a final note I want to add that it is not my goal to simply obtain a smooth image. Later in the program I need this data to determine the response of a conducting material, which is where these black dots internally become a real pain...
Thank you for your help !!!

Finding the normal to the edges in an image

I need to the normal (to the edge) at each point of the edges detected. I can't think of a good method to do this and my main concern isn't this. I need the normals to be consistent. What I mean is that they should all be outwards facing (or inwards). Consider the image (after edge detection)
Since it doesn't form a closed curve, I can't define inwards or outwards but what I want is that adjacent normals should not be opposite to each other. I am not sure whether saying that adjacent normals should form an acute angle is the right way to express this condition. Is there any known algorithm/library which addresses this problem?

How to create sprite surface like in "cham cham"

My question maybe a bit too broad but i am going for the concept. How can i create surface as they did in "Cham Cham" app
https://itunes.apple.com/il/app/cham-cham/id760567889?mt=8.
I got most of the stuff done in the app but the surface change with user touch is quite different. You can change its altitude and it grows and shrinks. How this can be done using sprite kit what is the concept behind that can anyone there explain it a bit.
Thanks
Here comes the answer from Cham Cham developers :)
Let me split the explanation into different parts:
Note: As the project started quite a while ago, it is implemented using pure OpenGL. The SpiteKit implementation might differ, but you just need to map the idea over to it.
Defining the ground
The ground is represented by a set of points, which are interpolated over using Hermite Spline. Basically, the game uses a bunch of points defining the surface, and a set of points between each control one, like the below:
The red dots are control points, and eveyrthing in between is computed used the metioned Hermite interpolation. The green points in the middle have nothing to do with it, but make the whole thing look like boobs :)
You can choose an arbitrary amount of steps to make your boobs look as smooth as possible, but this is more to do with performance.
Controlling the shape
All you need to do is to allow the user to move the control points (or some of them, like in Cham Cham; you can define which range every point could move in etc). Recomputing the interpolated values will yield you an changed shape, which remains smooth at all times (given you have picked enough intermediate points).
Texturing the thing
Again, it is up to you how would you apply the texture. In Cham Cham, we use one big texture to hold the background image and recompute the texture coordinates at every shape change. You could try a more sophisticated algorithm, like squeezing the texture or whatever you found appropriate.
As for the surface texture (the one that covers the ground – grass, ice, sand etc) – you can just use the thing called Triangle Strips, with "bottom" vertices sitting at every interpolated point of the surface and "top" vertices raised over (by offsetting them against "bottom" ones in the direction of the normal to that point).
Rendering it
The easiest way is to utilize some tesselation library, like libtess. What it will do it covert you boundary line (composed of interpolated points) into a set of triangles. It will preserve texture coordinates, so that you can just feed these triangles to the renderer.
SpriteKit note
Unfortunately, I am not really familiar with SpriteKit engine, so cannot guarantee you will be able to copy the idea over one-to-one, but please feel free to comment on the challenging aspects of the implementation and I will try to help.

Collision detection for rotating images

I want to be able to tell when 2 images collide (not just their frames). But here is the catch: the images are rotating.
So I know how to find whether a pixel in an image is transparent or not but that wont help in this scenario because it will only find the location in the frame relative to a non-rotated image.
Also I have gone as far as trying hit boxes but even those wont work because I can't find a way to detect the collision of UIViews that are contained in different subviews.
Is what I am trying to do even possible?
Thanks in advance
I don't know how you would go about checking for pixel collision on a rotated image. That would be hard. I think you would have to render the rotated image into a context, then fetch pixels from the context to check for transparency. That would be dreadfully slow.
I would suggest a different approach. Come up with a path that maps the bounds of your irregular image. You could then use CGPathContainsPoint to check to see if a set of points is contained in the path (That method takes a transform, which you would use to describe the rotation of your image's path.)
Even then though you're going to have performance problems, since you would have to call that method for a large number of points from the other image to determine if they intersect.
I propose you a simple strategy to solve that, based on looking for rectangles intersections.
The key for that is to create a simplified representation of your images with a set of rectangles laid out properly as bounding boxes of the different part of you image (like you would build your image with legos). For better performance use a small set of rectangles (a few big legos), for better precision use a biggest number of rectangles to precisely follow the image outline.
Your problem becomes equivalent to finding an intersection between rectangles. Or to be more precise to find wether at least one vertex of the rectangles of object A is inside at least one rectangle of object B (CGRectContainsPoint) or if rect intersects (CGRectIntersectsRect).
If you prefer the points lookup, you should define your rectangles by their 4 vertices then it is easy when you rotate your image to apply the same affine transform (use CGPointApplyAffineTransform) to your rectangle vertices to have the coordinates of your points after rotation. But of course you can lookup for frame intersections and represent you rectangle using the standard CGRect structure.
You could also use a CGPath (as explained in another answer below) instead of a set of rectangles and look for any vertex inside other path using CGPathContainsPoint. That would give the same result actually but probably the rectangles approach is faster in many cases.
The only trick is to take one of the objects as a reference axis. Imagine you are on object A and you only see B moving around you. Then if you have to rotate A you need to make an axis transform to always have B transform relatively to A and not to the screen or any other reference. If your transforms are only rotation around the object centre then rotating A by n radians is equivalent to rotating B by -n radians.
Then just loop through your vertices defining object A and find if one is inside a rectangle of object A.
You will probably need to investigate a bit to achieve that but at least you have some clues on how to solve that.

Rendering a point light using 6 spot lights?

I'm trying to render 6 spot lights to create a point light for a shadow mapping algorithm.
I'm not sure if I'm doing this right, I've more or less followed the instructions here when setting up my view and projection matrices but the end result looks like this:
White areas are parts which are covered by one of the 6 shadow maps, the darker areas are ones which aren't covered by the shadowmaps. Obviously I don't have a problem with the teapots and boxes having their shadows projected onto the scene, however as you can see the 6 shadow maps have blindspots. Is this how a cubed shadow map is supposed to look? It doesn't look like a shadowmap of a point light source...
Actually you can adjust your six spots to have cones that perfectly fill each face of your cubemap. You can achieve this by setting each cone's aperture to create a circumscribed circle around each cubemap face. In this case you don't have to worry about overlapping, since the would be overlapping parts are out of the faces' area.
In other terms: adjust the lights' projection matrix' FOV, so it won't the view frustum that includes the light cone, but the cone will include the view frustum.
The a whole implementation see this paper.
What you're seeing here are a circle and two hyperbolas -- conic sections -- exactly the result you might expect if you took a double ended cone and intersected it with a plane.
This math may seem removed from the situation but it explains your problem. A spotlight creates a cone of light, and you can't entirely fill a solid space with a bunch of cones coming from the same point. (I'd suggest rolling up a bunch of pieces of paper and taping them together at the points to try it out.)
However, as you get far from the origin of your simulated-point-source, the cones converge to their assymptotes, and there is an infinitesimally-narrow gap in the light.
One option to solve this is to change the focus of the cones so that they overlap slightly -- this will create areas that are overexposed, but the overexposure will only become obvious as you get farther away. So long as all of your objects are near the point light source, this might not be much of an issue.
Another option is to move the focus of all of the lights much closer to their sources. This way, they'd converge to their assymptotes more quickly.

Resources