将形状从平面的equirectangular全景图映射到A帧内的平面 [英] Mapping shapes from a flat equirectangular panorama to planes within A-Frame

问题描述

我正在尝试在A-Frame中为360个图像构建一个热点编辑器。

I'm trying to build a hotspot editor for 360 images within A-Frame.

这个想法是你可以画一个equirectangular全景，然后这个工具将形状转换为THREE.ShapeGeometry的平面。

The idea is that you could draw on an equirectangular panorama and then this tool would convert the shapes into planes with THREE.ShapeGeometry.

我可以从JS矢量编辑器和A-Frame中渲染的平面获取每个形状节点的X / Y坐标。但是，我在将它们正确放置在天空盒上时遇到了问题。

I can get X/Y coordinates for each shape's nodes from a JS vector editor and the planes rendered in A-Frame. However, I'm having problems getting them positioned correctly atop the skybox.

我知道我需要做一些equirectangular投影，但我不确定如何处理它上下文。

I know I need to do some kind of equirectangular projection but am unsure how to approach that in this context.

任何想法？

矢量编辑器的屏幕截图显示了什么我的意思是

推荐答案

目前尚不清楚如何在3D空间中显示这些平面几何图形，但可能还有以下信息可以帮助你一些...

It’s not clear how you want to display those planar geometries in 3D space but perhaps the following information can help you some of the way...

使用物理风格球形极坐标 - 像纬度和经度，但不是从西到东从-180到180，从南到北从-90到90，你有类似于从0指向直线的纬度最多180个直指向下，phi从0到360围绕Y轴旋转。

Using the physics style spherical polar coordinates - like latitude and longitude but instead of running from -180 to 180 in west to east and -90 to 90 in south to north you have theta analogous to latitude running from 0 pointing straight up to 180 pointing straight down and phi running from 0 to 360 rotating around the Y axis.

从这两个角度你可以映射到x，y，z（笛卡儿）在球体上的坐标和带有纹理的equirectangular投影中，你有一个U轴，从0到1水平ally在phi和0轴上从0到360，从0到1垂直运行，就像0到180 in the。

From those two angles you can map to x,y,z (cartesian) coordinates on a sphere and in the equirectangular projection with a texture, you have a U axis running from 0 to 1 horizontally which is like 0 to 360 in phi and V axis running from 0 to 1 vertically which is like 0 to 180 in theta.

有了这些信息，你应该能够在theta和phi球面极坐标中的等角矩形平面上识别您选择的顶点，然后将它们转换为球体表面上的x，y，z笛卡尔坐标。

With that information you should be able to identify the vertices of your selection on the equirectangular plane in theta and phi spherical polar coordinates and so translate them to x,y,z cartesian coordinates on the surface of a sphere.

你想从那里做什么取决于...我会提出一个建议但是把它拿走或者随意离开。

What you want to do from there depends... I'll make a suggestion but take it or leave it as you please.

我想你想做什么从那里将这些点径向投射到与球体表面相切的平面上，即具有穿过球体中心的法向矢量。我认为，有问题的部分在于决定使用什么样的平面以及距离球体中心的距离是什么。

I think what you want to do from there is to project those points radially onto a plane that is tangential to the surface of the sphere, i.e. with a normal vector that goes through the centre of the sphere. The problematic part, I think, comes in deciding what plane normal to use and at what distance from the centre of the sphere to place it.

随机的持续思考让我思考回到几何和物理课程，并考虑表面上恒定密度的质心等事物。

Random continued musing makes me think back to geometry and physics lessons and thinking of things like centre of mass given constant density across the surface.

一个更简单的解决方案可能是只需点击定义形状内的某个位置即可定义平面应切向的球体表面上的点，然后将法线的长度从等于半径减小到足够小于定义形状的投影顶点的长度，使其全部适合于球体。

A simpler solution could be to just click somewhere within the defined shape to define the point on the surface of the sphere to which the plane should be tangential and then reduce the length of the normal from being equal to the radius to being something enough less than that for the projected vertices of the defined shape to all fit inside the sphere.

要将投影完美地安装在球体内部的定义形状的平面上，可以通过识别最远的定义形状的顶点来分析地完成从切向点（沿着径向线的平面法线与sph的表面相交） ere）这就像大圆圈中最大弧长一样。

To fit the projection onto the plane of the defined shape perfectly just inside the sphere, that can be done analytically by identifying the vertex of the defined shape that is furthest from the tangential point (where the plane normal along a radial line intersects the surface of the sphere) which would be something like the largest arc length along a great circle.

这篇关于将形状从平面的equirectangular全景图映射到A帧内的平面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！