交互式(可点击)地图
我有一张露营地图,就是这样:
现在,在这张地图上,有很多露营场所。 所有的地方(黄色,粉红色和条纹黄色)都需要点击。
所以我的问题是,我将如何实现这一目标? 我正在考虑使用SVG或其他东西。 这是一个好的解决方案吗?
基本思路:创建颜色贴图以查找用户点击的位置。
要创建该颜色贴图,请从原始贴图开始,使用空位图覆盖它并编写一个小工具应用程序来帮助您:
- 它应该让你为每个站点点画一个特殊颜色的实心圆圈
- 理想情况下,这些颜色应该允许您重新构建地点的数量和类型
- 每次点击时,应准备下一种颜色
- 你不需要太精确地匹配这个地方,但你需要用油漆程序改进色彩图; 将原始地图放在它下面的一层中,然后使用吸管工具获得正确的颜色,然后将这些地方画得更好一些
- 因为很多地方都有连续的数字
- 每次点击都会计算出来
- 使用输入框设置新的起始编号
对于实际应用,你应该
- 将颜色映射保存在内存中
- 使用
PictureBox
获取场所的坐标 - 用缩放因子乘以(或者说等分)
- 在颜色图上使用
GetPixel
来获取颜色然后 - 提取地点编号。
ARGB
颜色有3个颜色字节; 两个就足够了地方号码,你仍然会有一个字节用于颜色编码类型的地方..
缩放系数是1f * PictureBox.clientSize.Width / PictureBox.Image.Width
。
为了获得最佳用户体验,我将使用PictureBox.MouseMove
在颜色映射中查找位置,并在颜色发生变化时给出反馈 ,包括在可点击位置时设置和清除Hand
和Default
的mouse cursor
,即具有非彩色地图上的透明色..
为了避免伪影,颜色贴图必须存储为PNG
,而不是JPG
!
如果你想要更多信息你可以(并且应该)创建一个Place
类并按住Dictionary
来查找Place
by Color
..
例如,如果将图像放在PictureBox
,则可以使用MouseClick
事件。