Develop Reference

2D Dynamic HW Position on Image WPF View

I am working on a .Net WPF app that displays fixed network gateways (switches, routers) inside an office premises.
I am looking at represent the office plant on 2D view, and dynamically/automatically place items on it that represent those network devices to give an overview of their position.
I have thought about storing the coordinates XY (pixel) with the HW Details, so the end-user can just adjust those coordinates to move the device to a new position on the image.
1. Will this work?
2. Is this a very rudimentary solution? Will it adapt if the Window size changes.
3. Can anyone recommend a Nuget Package ?
4. Can anyone recommend me an algorithm?
Appreciate your help.
Regards

There is a nice DragCanvas Demo at codeplex. Which shows a lot of what you want to do.
You can resize the window and handle the event to resize all the controls on the canvas but it sounds like if this solution just used inside your company, I would avoid the extra code just allow a reasonable fixed window size so you can store the offsets of each network image and restore them when the program is reloaded (but yes you can do it).
Yes this will work
You do not need a complex solution?
No packages needed.
algorithms not really needed. ( google "resizing canvas controls")
Figure out how you want to save/load the positions in file or Db and you are done.

Marking an interest point in an image using c++

I have a bitmap image like this
My requirement is to create a GUI to load the image and for changing the contrast and other things on the image and algorithm to mark the particular area in silver colour as shown in the fig using C++ or C#.I am new to image processing and through my search I have found out that I can use the Histogram of the image for finding the required area.These are the steps.
Get the histogram
Search for intensity difference
Search for break in the line
Can someone suggest me how can I proceed from here.Can I use Opencv for this or any other efficient methods are available..?
NOTE:
This image have many bright points and the blob algorithm is not successful.
Any other suggestions to retrieve the correct coordinates of the rectangle like object.
Thanks

OpenCV should work.
Convert your input image to greyscale.
adaptiveThreshold converts it to black and white
Feature detection has a whole list of OpenCV feature detectors; choose one depending on the exact feature that you're trying to detect.
E.g. have a look at the Simple Blob Detector which lists the basic steps needed. Your silver rectangle certainly qualifies as "simple blob" (no holes or other hard bits)

If all of your pictures look like that, it seems to me not complicate to segment the silver area and find its centre. Basically you will need to apply these algorithms in the sequence below:
I would suggest binaryze the image using Otsu adaptive threshold algorithm
Apply a labelling (blob) algorithm
If you have some problem with noise you can use an opening filter or median before the blob algorithm
If you end up with only one blob (with the biggest area I guess) use moment algorithm to find its centre of mass. Then you have the X,Y coordinate you are looking for
These algorithms are classical image processing, I guess it wouldn't be hard to find then. In any case, I may have they implemented in C# and I can post here latter in case you think they solve your problem.

May be a research on Directshow, a multi media framework from Microsoft will help you to accomplish your task.

search for shapes in BMP image file

I have an image processing question, using C#.
Say I have some schematic diagrams in BMP format, the diagram contains component shapes which are connected to each other.
I wrote a simple program to detect square shapes in the diagram as one component, and record the location of it. However, the next level is to detect more complicated shapes like a few arcs joined together. Note that these shapes can be different sizes in the image. Does anyone know any good method of doing it? without downloading any library (this is my limitation now).
After detecting the shapes, I also need to record which shape is connected to which, so later on, I can redraw them. I have one week to do this, so thanks a lot for any help!!
I'm using C#.

Have a look at this paper. My understanding of their approach:
Detect edges
Detect corners by looking for perpendicular edges
Detect polygons by looking for groups of corners
Detect circles using Hough transform
This is a fairly difficult research problem. Even with a powerful computer vision library like OpenCV, implementing an effective solution within 1 week would be a demanding task.

Have you taken a look at using EmguCV? It is an open-source C# wrapper of OpenCV. It also has a shape detection sample you might interested in.

To answer an old post I had, I have done what I needed to do in 2 weeks time, it worked well. I actually ended up using different algorithms for different shapes. The algorithms are a bit self inventions, but a good method I want to mention is that get the histogram and then use projection on different axis helped a lot.

Shopping Mall Map Directory Editing [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
I have a shopping mall directory image (for example like this: http://www.westfield.com/annapolis/map/ ) and want to make an application like this http://www.youtube.com/watch?v=LNj8D8JKv-4&feature=related where I can draw the path between two locations without needing make many images for the paths.
So, What techniques (Library, programming techniques, softwares .. etc) do you suggest to do this using .NET (Windows Forms/ WPF) application?
EDIT for BOUNTY
I am looking for some start like. I am on 3rd Floor. I have a image of third floor. There is a point of entrance from 3rd floor in map. There are 29 seats in the floor. I want to show with line path, where is somebody's seat. I want to do it through Web App. C# MVC 4.5 Where should I start from ? Any sample code will be very helpful.

I solved similar problem some time ago. In short, I was making a game like Heroes of Might and Magic and since I didn't want to draw background myself I decided to use a static image which I would simply manipulate along with player moves.
So we found an open-source game with a map editor that we used for creating of a map background. Then we created a mapper that would load an image created from the map editor and user would mark places on a grid. The following image is a screenshot from our map mapper.
There was the image, and drawed grid with adjustable size for cells so that we could map objects very precisely. The yellow boxes with an item inside are mapped objects (some of them actually do not give a sense, it is just a proof of concept). When we were content of the result, we would safe position and information about all obejcts to a xml file so that I can be used from our game application.
In our game we have defined a class called TileMap that was aware of all objects (stored as instances of a class Tile) on the map and all players move requests were permitted or forbidden by it.
Finally, this is how I would solve your problem. I have only positive experience with this solution. Create an application that would allow to you to specify where there is a path, where there is a store and how it is called, and so forth. Serialize values to xml or another format you are confident with. Then, create an application that works with these obejcts, define a tile map and you are nearly finished. Now you just need to implement path finding and drawing. Path finding is easy, there are plenty different algorithms with different efficiency and speed. Once you know what tiles you have to cross in order to get into a destination, simply draw stars, arrows or whatever you like above the tiles.
Cons
you need to create two applications
Pros
no need to generate more images, you are drawing on a transparent layer and you can safe already generated paths in memory or file
quite easy implementation, just a lot of code
feel free to choose a technology - we used WinRT, but WPF and even WinForms are also suitable
if you like GUI applications, you will have a plenty of fun while doing this :)
Feel free to ask any design and even implementation details questions .

Prepare the list of all places that you want to be searchable. Give each one an ID. The stairs and elevators should have IDs too.
Create the map floor masks. The easy way is the "coloring book" technique. Create semi-transparent layer in Photoshop and overlay it above the map. Then, draw the walls with some set "color 1". Then, draw each distinct place with a distinct color. Just convert the place ID to Hex and use that hex value as the color. Draw the mask for each floor (in a separate image).
Create the map loader. It should load the mask images and extract the object position and passing ability information. You have to find the position (x, y, floor) of each place by scanning the maps and looking at the pixel color hex value. You have to locate the stairs and elevators, their positions and the floors that they connect.
Implement the pathfinding algorithm like A*. It's quite easy and looks like viscous water flowing to the destination's low point. For each position (x, y, floor) one can move in any of the four directions where there aren't walls. And if there is an elevator at that point, one can move to some other floor. The algorithm can quickly find the best route between any two (x, y, floor) points.
When user gives you the name of the place where he wants to go, you need to find out the user's position coordinates (you may try to use GPS) and the destination position (use the object location table, you prepared when you loaded the map on step 3). Give these two (x, y, floor) points to the pathfinding algorithm to get back the route - the sequence of the (x, y, floor) points leading to the destination.
Analyze the route. You need to scan the route and find out what floors does it pass through. Split the route in chunks where each chunk belongs to a single floor. Now you have a list of floors and the route points for each of the floors.
Visualize the floors and their route parts by drawing the route points over the floor maps. To increase the root point spacing, you may just draw every 10th point or so. With HTML5, the sequence of route points can be drawn as an SVG or canvas overlay on top of the floor map image background.

The best way to set up something like this is to pick up a book on game programming, as it will give you a lot of information on setting up paths around "solid objects". The actual UI technology should not matter as much, so choose WPF or Windows Forms, HTML5 etc. Of the choices you have, I would probably aim for WPF or Silverlight, as it gives you much more flexibility on creating the UI. But I would not be adverse to HTML5 either.

You can definately do the whole thing in WPF, you're looking at drawing simple paths so you need to chunk your project into multiple sub issues:
1) How to draw the UI area (i assume you already know that)
2) How to draw the map, it heavily depends on the map data you have but it could be as simple as a single image, please add more detail for your source
3) How to figure out the path, for this you will need to use some form of pathfinding algorithm (one of the simplest one is A*, but there is a myriad of algorithms for different needs)
4) How to draw the Path, this depends on what you're looking for once again
I know it isn't much of an answer yet but depending on your needs (please add a comment bellow) i'll edit it to help you the best i can.

It would be pretty significant undertaking if you are trying to do this whole thing by yourself. All you have is image of shopping mall. From there you need to convert it in to vector data which in itself a fairly significant project. Then you will need to design navigation algorithms and then you need to setup UX for the whole thing. IMO, all these would require a lot of resources and research if you want to do this nicely and accurately.
Fortunately here is a good news: Google has been trying to do same thing for quite sometime and throwing lot more resources than that are likely at your disposal. Their effort is called "indoor mapping" which you can pretty much leverage out-of-box for your scenario. I'm going to give out here pointers to start you off as you have asked.
First visit Google blog to get familiarize with their indoor maps initiative. Then try out adding your floor plan in Google maps here. You are basically uploading image and aligning with the building in Google maps at this point. Here's another tutorial. Note that this does not make your floor plan navigable and may not show yet users location on it because to do that you need data from wifi/cell towers to triangulate users location on floor plan. We'll go over that next. If you have tons of these floor plans, I'd suggest taking help of mechanical turk or such service to have other humans do it for you cheaply. Google maps allows you to keep floor plan privates by using overlays but likely you don't want to do that so users can access it from anywhere.
Next, you want to make your user locatable on your floor plan. This involves getting data such as wifi/cell tower signals at different points on your floor plan. Google has app for this. And here's little demo. You can also use SketchUp to add vector data and polygons.
Next, you want to embed Google maps in your app so it becomes integral part of your app instead of users having to go through Google Maps website. To do this look at Maps SDK (here's link for iOS, and snippet for indoor maps).
Good luck!

You may easier this job by looking into Google map indoor solution. http://maps.google.com/help/maps/indoormaps/
No programming except a web page is needed.

How to draw an unfilled square on top of a stream video using a mouse and track the object enclosed in the square automatically in C#?

I am making an object tracking application. I have used Emgucv 2.1.0.0
to load a video file
to a picturebox. I have also taken the video stream from a web camera.
Now, I want
to draw an unfilled square on the video stream using a mouse and then track the object enclosed
by the unfilled square as the video continues to stream.
This is what people have suggested so far:-
(1) .NET Video overlay drawing(DirectX) - but this is for C++ users, the suggester
said that there are .NET wrappers, but I had a hard time finding any.
(2) DxLogo sample
DxLogo – A sample application showing how to superimpose a logo on a data stream.
It uses a capture device for the video source, and outputs the result to a file.
Sadly, this does not use a mouse.
(3) GDI+ and mouse handling - this area I do not have a clue.
And for tracking the object in the square, I would appreciate if someone give me some research paper links to read.
Any help as to using the mouse to draw on a video is greatly appreciated.
Thank you for taking the time to read this.
Many Thanks

It sounds like you want to do image detection and / or tracking.
The EmguCV ( http://www.emgu.com/wiki/index.php/Main_Page ) library provides a good foundation for this sort of thing in .Net.
e.g. http://www.emgu.com/wiki/index.php/Tutorial#Examples
It's a pretty meaty subject with quite a few years and different branches of research associated with it so I'm not sure anyone can give the definitive guide to such things but reading up neural networks and related topics would give you a pretty good grounding in the way EmguCV and related libraries manage it.
It should be noted that systems such as EmguCV are designed to recognise predefined items within a scene (such as a licence plate number) rather than an arbitory feature within a scene.
For arbitory tracking of a given feature, a search for research papers on edge detection and the like (in combination with a library such a EmguCV) is probably a good start.
(You also may want to sneak a peek at an existing application such as http://www.pfhoe.com/ to see if it fits your needs)