我继承了一个用 jQuery 编写的项目，该项目允许用户将项目（可拖动的 div）拖放到页面（更大的 div）上。页面可拖动并可调整大小，项目可以自由放置或相互对齐以及页面边缘。项目不能悬在页面边缘或重叠。
创建这些项目的数据是从另一个程序中读入的。每个项目都有一个“真实的”整数宽度和高度，单位为 1/10 毫米。为了创建代表这些项目的 div，这些“真实单位”使用缩放因子转换为像素（目前为 50%，我们希望在未来使其动态化，以便用户可以放大和缩小）。
当用户对页面上项目的放置感到满意时，他们可以导出他们的设计。项目相对于页面左上角的 x,y 像素位置使用相同的缩放因子转换回“实际单位”。
项目需要捕捉到 5x5 实际单位 (0.5mm) 网格。显然这是不可能的，因为 5 个实际单位 = 2.5px，尽管我们希望它能够在不考虑比例因子的情况下工作。
在真实单位和像素之间来回切换的最简单方法是什么，确保真实单位始终在网格上，同时保持像素表示一致？这可以在仍然依靠 jQuery 可拖动/可拖放/可调整大小的类的同时完成，还是我最好重写整个事情？