XY图表坐标

Question

该项目仍处于规划阶段。我试图了解什么是最好的方法。 如果我有一个情节区域，有点像照片。然后添加jQuery UI draggable / droppable功能来拖动图表周围的对象，我怎样才能记录每个对象相对于彼此的位置？立即回答是获得坐标点，但屏幕尺寸可能不同。

1. 是否有可能以百分比的方式做到这一点？

2. 如果我保存这些结果，我将如何显示从最高到最低顺序的项目列表？

Answer 1

您知道您的平面部分有多大（以像素为单位），您可以指定特定尺寸的区域，也可以询问它在页面上的大小。您还将拥有所有点的坐标（以像素为单位）。

因此，当您与服务器通话以保持点时，请告诉它容器有多大以及所有点相对于容器坐标系的位置;所有这些值都可以在客户端JavaScript中轻松计算。

您的服务器代码可以跟踪上述所有内容并根据需要将它们映射到新的坐标系统，也可以将所有内容标准化为标准坐标系并将内容存储在标准坐标中;你可以说该区域总是X服务器单位宽，并做一些数学计算来缩放传入的坐标以符合您的标准。在服务器上使用一个标准坐标系可能会让事情变得更容易。

至于“我如何以最高到最低的顺序显示项目列表？”那么，答案取决于你想要如何定义“最高”。如果“height”测量Y坐标，那么您只需按y坐标（也可能是x坐标来断开连接）。如果“最高”是一个量级的度量，那么你只需使用欧几里德范数：

d = sqrt(x*x + y*y)

并按此排序。如果您只是将量级用于排序，那么您可以通过放弃平方根并简单地按x*x + y*y排序（平方根不会改变排序）甚至曼哈顿来节省几个CPU周期规范（abs(x) + abs(y)）。

您可能迟早会在​​订单中遇到问题，这样您就可以立即处理。你想让Y优先于X，反之亦然吗？你有一个可以用作辅助排序键的字符串标签吗？您选择的可能取决于您计划如何列出要点：

• 如果您将点列为（x，y）坐标，则使用X作为辅助键，因为这对人类来说更自然。
• 如果您将这些点列为（标签，（x，y））对，则将该标签用作辅助密钥。

目标是双重的：

1. 制作对人类有意义的输出。
2. 面对关系时的一致排序。

所以只需选择合理的辅助排序键并保持一致。