如何将经度/经度热点投影到360x180度全景图像上?
使用javascript?
真实数据:
以十进制度表示的经度/经度和以米表示的高度:
摄像机坐标: 49.994249,8.66539,2
热点坐标: 49.994163,8.665388,2
相机到热点的距离: 9.55
将方向角相机指向热点的角度(0-360度):170
图像方向: 130度(x图像的中间),这是必要的吗?
地平线是图像的中间。
图片大小宽: 1024,高: 512像素
我需要的是javascript代码来确定热点的x,y像素图像坐标。
0表示左上角。
准确性并不重要。距离将始终小于100米。
谢谢,
1月
janmartin AT diy-streetview DOT org
发布于 2010-09-10 16:42:33
看起来您已经完成了困难的部分:将GPS坐标转换为相对方位角(和距离)。
如果360°图像的中心指向北130°(假设围绕指南针顺时针旋转),并且相机位置的方位角和热点距离北170°,则热点在图像上相对于图像中心的40°。而且,由于图像包含360°和1024px的水平方向,因此热点似乎位于图像中心的1024px / 360°* 40°=114px处。
由于相机和热点都在同一高度,因此相对间距为零。
把这些放在一起,你就得到了坐标: 512 + 114,256 +0=坐标: 626,256。
如果热点的高度与相机的高度不同,那么你必须使用一些简单的trig来计算俯仰:
首先,让我们假设ground distance
=相机位置和热点位置之间的地面距离。这将是相同的,无论每个高度。
因此,您的重点将是: atan (热点高度-相机高度)/地面距离。
例如,如果你的地面距离是100米,热点在10.75米,而相机仍然在2米的高度,那么你可以计算你的俯仰角:
螺距= atan (10.75m - 2m) / 100m = atan ( 8.75m / 100m )= atan (0.0875) = 5°
要在全景图上绘制此图: 512px / 180°* 5°= 14px高于中间。由于中间是256px,图像的左上角是0,0,那么我们将从256中减去14px,得到242px。
按照您的要求将所有这些放到Javascript中:
// We'll use degrees, but this would be simpler if
// everything were computed in radians, since that
// is how the Math methods work.
function getRelativePitch(cameraAlt, hsAlt, groundDistance)
{
var degPerRad = 180 / Math.PI;
if (groundDistance == 0) { return 0.0; } // fringe case
var rad = Math.atan( ( hsAlt - cameraAlt) / groundDistance );
// Convert to degress
return rad * degPerRad;
}
// Pretty simply this one.
function getRelativeHeading(cameraHeading, hsHeading)
{
return hsHeading - cameraHeading;
}
var cameraHeading = 130; // degrees
var hotspotHeading = 170; // degrees
var cameraAltitude = 2; // meters
var hotspotAltitude = 10.75; // meters
var groundDistance = 100; // meters
var panoWidth = 1024; // pixels
var panoHeight = 512; // pixels
var panoRangeX = 360; // degrees
var panoRangeY = 180; // degrees
var relativeHeading = getRelativeHeading(cameraHeading, hotspotHeading);
var relativePitch = getRelativePitch(cameraAltitude, hotspotAltitude, groundDistance);
// Now convert to pixels
var hotspotX = Math.round( panoWidth / 2 + panoWidth / panoRangeX * relativeHeading );
var hotspotY = Math.round( panoHeight / 2 - panoHeight / panoRangeY * relativePitch );
// Just in case we endup out of range
while (hotspotX < 0) { hotspotX += panoWidth; }
while (hotspotX > panoWidth) { hotspotX -= panoWidth; }
while (hotspotY < 0) { hotspotY += panoHeight; }
while (hotspotY > panoHeight) { hotspotY -= panoHeight; }
alert("Hotspot is at: " + hotspotX + ", " + hotspotY);
我希望这能帮到你!
https://stackoverflow.com/questions/3174382
复制相似问题