C# 如何在imagemap上为asp热点着色？

我有一个图像（图像是一个建筑的平面图），图像中包含了各种可以开放或保留的房间。我使用了一个Imagemap和热点来绘制房间的坐标，我正在处理onclick事件来完成我需要它们完成的任务。问题是，一旦房间被预订，我如何给热点的坐标上色？我在数据库中跟踪已预订的房间，因此知道哪个房间已预订不是问题，但问题是热点没有颜色属性。最好的办法是什么？Javascript

---

我知道我可以通过单击之类的方式交换图像，但是有数百个房间，对于所有可能的预订/未预订房间都有这么多图像是浪费时间的。

HTML5通过程序绘制，你不必说jQuery，但它肯定比从头开始容易。执行此操作的jQuery插件：

您的数据库访问问题有点令人费解。在加载页面时，服务器没有理由不能传递作为标记一部分所需的数据，例如

<script type="application/json" id="map-data">
  [1,2,10,33]
</script>

[1,2,10,33]

。。或者任何对您有用的格式/结构/数据类型。您不必使用

脚本

块-您可以将其放入隐藏的

div

，这真的不重要。也不必使用JSON，这很方便。然后，您可以将该数据用作ImageMapster之类的输入，以突出显示所需的区域。只需隐藏映像，直到完成配置，最终用户将看到，这就是从服务器加载映像的方式

从标记中获取一些数据，并使用它使用ImageMapster在imagemap上设置热点的示例：

---

回答得很好，但是如果我需要从服务器端而不是客户端进行绘制，我会有问题吗？我必须能够访问我的数据库，所以在pageload上，给预订的房间上色。哦，那么使用gdi+将是一个不错的选择。如果早上没有其他人看到，我会在早上发布一个例子吗？我认为这会遇到同样的问题，必须访问我的数据库并在页面加载时更改房间颜色…有什么方法可以在服务器端执行此操作吗？当然有一种方法可以在服务器端执行此操作，但是，使用GDI+或类似工具来实际绘制图像可能需要大量的工作。它还要求最终用户在每次访问页面时下载一个全新的图像，从声音上看，这可能是一个大图像。你用一个问题换另一个问题。现在Javascript速度非常快，没有理由预测在客户端执行此操作会出现性能问题。您不需要向数据库发出特殊请求，只需将页面加载上的数据作为JSON传递，然后让客户端使用它进行渲染。用一个示例更新了我的答案，说明了如何使用从服务器传递的数据。很抱歉，但您能再解释一下我是如何从服务器获取数据的吗？我正在使用SQLServer2008。在页面加载时（在代码隐藏中），我想从数据库中加载预订房间，并可能将它们存储在数据集中？我不知道通常如何从服务器获取数据，但是在任何呈现页面本身的代码中，都会输出一些包含数据的HTML。你看过我贴的小提琴了吗？您所要做的就是让服务器生成一些随页面一起发送的内容。在我的示例中，该内容存储在

。

块中。如何做到这一点完全取决于您自己，如果您使用的是ASP.NET webforms，那么只需添加一个

控件，并将其

文本

属性设置为

[…您的数据..]

。