由多个图像文件组成的响应式地图

Question

在响应式网页设计方面，我几乎是个菜鸟，我正在尝试制作一个带有交互式地图的响应式网络应用程序。

该地图由七个独立的图像文件组成 - 每个区域一个。必须将地图拆分为单独的图像，以便我可以根据从数据库中获取的数据更改每个图像的透明度（以及区域颜色强度）。

我希望地图居中，但我也希望每个区域的单独图像（构成地图）保持其位置。

我能想到的最好的类比是拼图，即使调整浏览器大小时，拼图仍保持正确的位置以完成拼图的图像。

实现此目标的最简单方法是什么？

切记，我仍然需要能够控制每个区域图像的透明度。

任何帮助或建议将不胜感激，因为我不知道从哪里开始！抱歉，如果我的描述很差 - 请随时探讨。

干杯，

将

Answer 1

我最终使用了 il​​lustrator 制作的 SVG，效果非常好。将它嵌入内联，而不是在目录中有一个 SVG 文件。