制作按钮地图? [英] Make a Map of Buttons?
问题描述
我如何执行以下操作我不是在要求特定的代码，但我需要一些指导，因为我已经为此绞尽脑汁数周了.只是我想制作一张地图，例如.美国和每个州都是不同的图片或区域，可以将鼠标悬停在上面并单击.我尝试使用 png 和透明胶片，但我陷入了死胡同.更雄心勃勃地，我想将带有州首字母的标签拖到每个州上并将它们放在那里然后有一个过程，如果标签/首字母与州匹配，则它是正确的，否则就不是.
How do I do the following I'm not asking for specific code but I need some direction as I have been racking my brains on this for weeks. Simply I want to make a map of the eg. united states and each state is a different picture or area that can be moused over and clicked. I tried playing with png and transparencies but I'm at a dead end. More ambitiously I'd like to drag labels with state capitals over each state and drop them there then have a process where if the label/capital matches the state it correct else it's not.
我已经尝试过 GIS(?) 我想做这个 C#，但到目前为止我无法理解如何去做.任何人都可以帮忙吗?这在 C# 中太难了吗?我应该使用另一种方法吗?请问方法是什么?
I've tried GIS(?) I want to do this C# but I can't get traction how to do it so far. Can anyone help? Is this too difficult in C#? SHould i be using another approach? Please what is the approach?
推荐答案
好消息首先:编程部分并不难，即使使用旧的 Winforms，您也可以在几行中完成核心检查.但是，可点击区域不能是 Winforms 中的按钮.
The good news first: The programming part is not so hard and even with good old Winforms you can do the core checks in a few lines. The clickable areas can't be Buttons in Winforms, however.
这里有两个解决方案:
解决方案 1:您可以定义一个区域列表，称为区域并测试是否有人点击.
Solution 1 : You can define a list of areas, called regions and test if one got clicked.
这是一个开始:我定义了一个非常简单的Rectangle Region 和一个不那么简单的Polygon Region 并测试每次点击是否被击中.如果它被击中，我将其数据输出到表单的标题文本中:
Here is a start: I define a very simple Rectangle Region and a not so simple Polygon Region and test on each click if one was hit. If it was hit I output its data into the Form's title text:
//..
using System.Drawing.Drawing2D;
//..
public Form1()
{
InitializeComponent();
// most real states don't look like rectangles
Region r = new Region(new Rectangle(0, 0, 99, 99));
regions.Add(r);
List<int> coords = new List<int>() {23,137, 76,151, 61,203,
117,283, 115,289, 124,303, 112,329, 76,325, 34,279, 11,162};
List<Point> points = new List<Point>();
for (int i = 0; i < coords.Count ; i += 2)
points.Add(new Point(coords[i], coords[i+1]));
byte[] fillmodes = new byte[points.Count];
for (int i = 0 ; i < fillmodes.Length; i++) fillmodes[i] = 1;
GraphicsPath GP = new GraphicsPath(points.ToArray(), fillmodes);
regions.Add(r);
}
List<Region> regions = new List<Region>();
private void pictureBox1_MouseClick(object sender, MouseEventArgs e)
{
using (Graphics G = pictureBox1.CreateGraphics() )
foreach(Region r in regions)
{
Region ri = r.Clone();
ri.Intersect(new Rectangle(e.X, e.Y, 1, 1));
if (!ri.IsEmpty(G)) // hurray, we got a hit
{ this.Text = r.GetBounds(G).ToString(); break; }
}
}
测试程序中的区域不可见.为了进行测试，您可能需要添加如下内容:
The regions in the test programm are not visible. For testing you may want to add something like this:
private void button1_Click(object sender, EventArgs e)
{ // paint a non-persistent filling
using (Graphics G = pictureBox1.CreateGraphics())
foreach (Region r in regions)
{ G.FillRegion(Brushes.Red, r); }
}
但现在坏消息是:您可以将区域定义为看起来像真实状态的复杂多边形，但是这很多工作的！网络上有现成的图像地图编辑器，用于在网站上制作可点击的地图.您最好的方法可能是使用其中一个来创建所有这些多边形，然后将 html 输出转换为您可以读入程序的点列表.你甚至可能很幸运，找到了美国的现成图像地图，但我没有看过..
But now for the bad news: You can define regions to be complicated polygons that look like real states, however that is a lot of work! There are ready-made image map editors out there in the web for making clickable maps on websites. Your best course might be to use one of these to create all those polygons and then convert the html output to a list of points you can read into your program. You may even get lucky and find ready image maps for the USA, but I haven't looked..
更新:有许多美国的图像地图.一个甚至在维基百科上.将这些坐标转换为适合您的地图将是一项任务，但比从头开始创建它们要容易得多，imo.我已更改代码以包含来自维基百科源的一个坐标列表.猜状态！
Update: There are many image maps of the USA out there. One is even on wikipedia. Converting these coordinates to fit your map will be a task but lot easier than creating them from scratch, imo. I have changed the code to include one list of cordinates from the wikipedia source. Guess the state!
我已经实现了一个程序，可以让你点击一个状态并在 78 行代码中显示名称，不包括带有 50 个状态的文本文件.
I have implmented a program that lets you click on a state and displays the name in 78 lines of code, excluding the text file with the 50 states.
解决方案 2:
您可以准备一个彩色地图而不是多边形列表，并将颜色用作 Dictionary 或 Dictionary 的键.您必须确保每个状态都有一种独特的颜色，并且图像不会被压缩为 jpeg，这会引入伪影并弄乱键映射.
Instead of a list of polygons you can prepare a colored map and use the colors as keys into a Dictionary<Color, string> or Dictionary<Color, StateInfo>. You must make sure that each state has one unique color and that the image is not compressed as jpeg, which would introduce artifacts and mess up the key mapping.
接下来将每种颜色映射到相关信息；这是真正的工作，因为您必须知道这些状态才能创建字典 ;-)
Next you map each color to the related info; this is the real work because you must know those states to create the Dictionary ;-)
最后您可以在您创建的字典中查找点击的颜色:
Finally you can look up the clicked color in the Dictionary you have created:
Color c = ((Bitmap) pictureBox1.Image).GetPixel(e.X, e.Y)
string StateName = stateDictionary[c];
如果您使用类或结构作为字典中的值，则可以包含大写等.
If you are using a class or struct as your value in the dictionary you can include the capital etc..
您可以缩放，但必须相应地缩放点击位置；如果您不是在图片框中而是在不可见的颜色代码位图中查找关键颜色，您甚至可以显示地理图像.总而言之，一个更简单的解决方案 imo.. 您的选择！
You can zoom but must scale the click location accordingly; you can even display a geographical Image if you look up the key color not in the PictureBox but in an invisible color code bitmap. All in all an even simpler solution imo.. your pick!
一旦你开始工作，你就可以拖放了.在这里，您需要在 DragDrop 或 Mouseup 上进行测试，以查看您放置标签的位置.
Once you got that working, you can play with drag&drop. Here you'll want to test on DragDrop or maybe on Mouseup to see where you have dropped the Label.
这是一个不错的项目，非常值得创建一些类来使事情变得更容易和更可扩展..！
This is a nice project and well worth of creating a few classes to make things easier and more expandable..!
对于真正的按钮，您可能会因为 WPF 而走运.
For real Buttons you may get lucky with WPF.
这篇关于制作按钮地图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
