如何将不同维度的点击坐标转换为320维度？

编程入门行业动态更新时间:2024-10-27 08:26:33

本文介绍了如何将不同维度的点击坐标转换为320维度？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述

我感到非常烦恼，找到将各种设备尺寸的点击坐标转换为320 [iPhone 4]屏幕的解决方案。

I'm too much annoyed to find the solution for converting click coordinates of various device dimension into 320[iPhone 4] screen.

我有所有必需的数据，如元素偏移，点击偏移，窗口宽度/高度等，但没有找到任何适当的解决方案将其转换为320。

I have all required data like element offset, click offset, window width/height, etc. but not found any proper solution to convert it into 320.

对于例如我需要转换下面提到的X，Y，我从480屏幕收集：

For e.g. I need to convert below mentioned X,Y which I collect from 480 screen:

元素偏移x，y [30，1903] / li>

单击x，y中的偏移量[225,38] //这里我提到元素的点击偏移不是文档/窗口。

元素宽度/高度（以px为单位）[420，38]

AND

是我将这些数据转换成320后的结果。

Below is the result which I expecting after converting this data relative to 320.

[X，Y] = [161，38]

[X,Y] = [161, 38]

有没有人可以帮我这样做？

Can any one help me to do so?

推荐答案

你可以使用一点比较数学...

You could use a little ratio math...

var xratio=225/420; //420-mouse-x-coord divided by 420 var yratio=38/38; // mouse-y-coord/element height var x=320*xratio; var y=38*yratio;

您可能需要在Math.round（）中放置x和y值才能获得完美像素而不是十进制。

You may have to put x and y values in Math.round() to get a perfect pixel and not decimal.

编辑

您必须根据所有偏移量进行调整（我使用225，但是您可能需要添加或减去您的30元素偏移量到第225位，除以420才能得到比例百分比，具体取决于您如何对所有偏移量进行求和）。

You'll have to adjust it based on what all your offsets are (I used 225, but you may have to add or subtract your 30 element offset to the 225 first BEFORE dividing by 420 to get the ratio percentage depending on how you are summing all your offsets)

要反向工程你想要的，你可以使用交叉乘法或简单的代数：

To reverse engineer what you want you can use cross multiplication or simple algebra:

161是320，什么x到420;

161 is to 320, what x is to 420;

（161/320）=（x / 420）

(161/320)=(x/420)

0.503125 =（x / 420）

0.503125=(x/420)

0.503125 * 420 = x

0.503125*420=x

211.3125 = x;

211.3125=x;

你的x坐标必须是211.3125在420宽度对象上，与320宽度对象上的161成正比;

Your x coordinate would have to be 211.3125 on a 420 width object to be proportionally the same as as 161 on a 320 width object;

另：

对于任何可能试图为Web应用程序执行此操作的人， getBoundingClientRect（）可以轻松处理所有各种偏移属性。

For anyone who might be trying to do this for web applications, getBoundingClientRect() is way easier then dealing with all the various offset properties.