How to create Heatmap of eyetracking points in c# windows forms - c#

I have a database that holds data of eyetracking on some videos.
I export those data to an int[,] input matrix for this issue. And then try to create a heatmap.
What I get so far is something like this:
But this is not actually what I want it to be. I want something like the heatmaps that you see when you google it, e.g.:

Treat each spot as an artificial circle with the center at that spot. A circle that has, say, 50 pixel radius. Now, go over all pixels of the image and for each one count all circles that cover that pixels. This is your score for that pixel. Translate it into color, i.e 0: black/transparent, 10: light green, 20: yelow, and so on. After analyzing all pixels you will get a color for each pixel. Write a bitmap, look at it. It should be something close to what you want.
Of course, circle radius, color mappings, etc, need adjusting to your needs. Also, that's probably not the best/simplest/fastest algorithm.

Different approach would be to store the "heat" in the pixels greyvalue.
Just create a second image with the same size as the original one and count up the greyvalue of a pixel everytime it was looked at.
Later you can use that value to calculate a size and color for the circle you want to draw.
You can then lay the heatmap image on top of the original one and you are done (dont forget to set transparency).

Related

Algorithm for filling space between points with color

I have points from arrays which looks like this after printing:
Points are printed based on three arrays: one with x coordinate, second with y coordinate and third with value for color .Now I need an algorith to fill space between those points. Important thing is I don't want to fill space between separate shapes. Is there any method for doing that except using concave hull (there is no implementation in c#)
edit: is it possible to somehow separate those areas and then use flood fill?
How precise do you need the algorithm to be?
If you can tolerate some imprecision (a small area around the point shapes would be selected too), you could do with a blur.
It would go like this:
1) Blur the image with a small radius (equal to half of the maximum allowed distance between the points).
2) Each pixel that has color which is precisely equal to the background color is considered "outside" (each pixel with a different color is within a small disance to one of the darker points).
There is BlueBitmapEffect in WPF, but that probably cannot be used in your scenario. You can find countless blur implementations online though.
If you need to be precise, you are out of luck in my opinion. Your goal is basically the definition of convex/concave hull.

C# Xna interpolate edges on 2d Image like a 1d Graph

I generated some caves with random walk. The problem is that the output is far too small and i want to scale it up about 10-20 times. When i do so every pixel becomes visible so i need some algorithm to solve this. I thought about some sinus or cubic interpolation as it is in 1 dimension, that goes along the edges and interpolates between the centers of the pixels... So basicly the height of each pixel would be the Y axis of the graph. The image itself has only 2 "colors" wich are black and white.
The black dot is the center of each pixel and the red line the Interpolation i would like to archive:
Here is how the whole cave looks like:
Is there a way to realise that? Or is it impossible? I wonder how i could solve it when the caves edge goes back on the X axis, since the graph couldnt have 2 dots for each X.
You can blur or antialias and then posterize to BW again. Basically this is going to smooth the edges, as if you applied an exponential smoothing function.

How to detect a line/curve in a bitmap? ( C# )

Suppose I have such bitmap from laser scanning with a red line from the laser on it, what would be the right way to find the center of that line? Either to store its coordinates in an array or to just draw a think line over it.
What approach would you suggest? Preferebly with an option to be able to smooth out that line.
(source: gyazo.com)
THanks
I'd suggest to
Convert image to monochrome
Convert image to black-white using "image thresholding"
Split image in small parts
For every part,that is not entirely black, calculate Hough Transform and fine approximating segment
Merge these segments into chain and then smooth them (using Catmull-Rom splines for example)
However It is not the only possible approach, there are a lot of them
I would approach this with a worm. Have your worm start on one pixel and allow it to move along the line. Every time you detect a change in direction in any dimension you place a point. Then fit a spline through your points. Add the start and end locations as points too.
Important issues:
You need to maintain which pixels have been visited, such that when a worm finishes you can detect if you need to start a new one on what is left.
You need to maintain a velocity vector in your worm and weight posible forward choices based on which will more closely continue the line your're currently on. This is because...
You need to deal with topology changes, where you have two or more lines intersecting the same point. or a Split in the line into two.
For fitting the spline itself have a look at Numerics on NuGet
My suggestion is:
you go row by row, saving the coordinates of the first and last appearance of red-ish pixel in each row.
then, stretch a line between each two coordinates in every row, or between the middle pixels of each two coordinates.

Fill clipped area with color

I'd like to achieve an effect in XNA where I move a clipping plane through an object, and the object gradually disappears WHILE the clipped area is filled with a custom color or texture.
This is what I was able to achieve via HLSL:
And this is what I would actually need:
I think the teapot isn't a really great example because the models I would use would always be fully closed at all times.
Are there any good solutions to this?
I think that if you just have calculated if a pixel is front or back, you don´t need to clip it if the pixel is front, you only should set the pixel normal to the plane normal value, and calculate light as usual...

Detect Rotation of a scanned image in C#

We want a c# solution to correct the scanned image because it is rotated. To solve this problem we must detect the rotation angle first and then rotate the image. This was our first thought for our problem. But then we thought image warping would be more accurate as I think it would make the scanned image like our template. Then we can process it as we know all the coordinates of our template... I searched for a free SDK or a free solution in c#. Helping me in this will be great as it is the last task in our work. Really, thanks for all.
We used the PrimeOCR product to do this. It's not free, but we couldn't find a free program that was comparable.
So, the hard part is to detect the angle of the page.
If you have full control over the template, the simplest way to do this is probably to come up with an easily-detectable symbol (e.g. a solid black circle) and stick 3 of them on the template. Then, detect them (just look for big blocks of pixels with high saturation, in the case of a solid black circle).
So, you'll then have 3 sets of coordinates. If you have a top circle, a left circle, and a right circle with all 3 circles at difference distances from one another, detecting which circle is the top circle should be pretty easy.
Then just call a rotation function. This part is easy and has been done before (e.g. http://www.switchonthecode.com/tutorials/csharp-tutorial-image-editing-rotate ).
Edit:
I suggested a circle because it's easier to find the center, but a rectangle should work, too.
To be more explicit about how to actually locate the rectangles/circles, take the average Brightness value of every a × a group of pixels. If that value is greater than b, then that a × a group of pixels is part of a rectangle. a and b are varables you'll want to come up with yourself.
Use flood-fill (or, more precisely, Connected Component Labeling) group the resulting pixels together. The end result should give you your rectangles.

Categories