Jacques Martin
Jacques Martin

Reputation: 150

Interactive map wpf

Here is my situation : i have many pictures that give a complete map when assembled. Each picture has a file name "x,y.png" where x and y are the coords of the piece of map represented by the picture.

What i want to do is to assemble all this pics into an interactive map in wpf. Each pic will be a cell with an x and y coords, and i need to interact with the user : highlight the pic when the mouse is over, do an action on click and so on.

My map is a custom map that is not earth so openstreetmap and solutions like that doesn't work.

I have looked on google and stack overflow and i didn't find anything.

I have found this : http://www.codeproject.com/Articles/855699/Complete-Sudoku-Game-in-Csharp-WPF-Silverlight that would be great, but the grid is separated manually in the xaml, in my case it's not possible because the map is something like 80x80 cells...

I thought about using a listbox with custom data template that shows the pic of a class cell which will have 3 properties (x, y, and the pic uri) but i don't think it will render as a complete map without, you know, holes and blank space.

So how can i display this to the user ?

Thanks for your help

Upvotes: 0

Views: 1050

Answers (1)

nvi9
nvi9

Reputation: 1893

I think the siplest solution is something like below.

You can generate 80-80 RowDefinition and ColumnDefinition programmatically and then add them to the grid:

for (int c = 0; c < 80; c++) mapGrid.ColumnDefinitions.Add(new ColumnDefinition{ Width = new GridLength(1, GridUnitType.Star) });
for (int r = 0; r < 80; r++) mapGrid.RowDefinitions.Add(new RowDefinition{ Width = new GridLength(1, GridUnitType.Star) });

Then you can create any Image and add them to the Grid too:

foreach (string path in mapImagePaths) { // mapImagePaths: a list of map image names
  var b = new BitmapImage();
  b.BeginInit();
  b.UriSource = new Uri(path, UriKind.Relative); // or Absolute
  b.CacheOption = BitmapCacheOption.OnLoad; // maybe needed
  b.EndInit();

  var i = new Image { Source = b, Stretch = Stretch.Uniform };

  Grid.SetRow(i, /*the row index based on the coordinates*/);
  Grid.SetColumn(i, /*the column index based on the coordinates*/);

  mapGrid.Children.Add(i);
}

I didn't have the possibility to test the code, but it should work...

Upvotes: 1

Related Questions