场景中添加图片

下面说说如何在场景中添加(插入)图片?

我们在上一篇文章中介绍了一种添加背景音乐的方法,即在场景中插入音频,而本篇文章介绍的添加图片的步骤,与其类似。

在预览窗口中选择“图像”。

然后在要插入的位置双击鼠标,在弹出的文件中选择要插入的图片。

选择插入的图片后,我们一般都需要对插入的图片进行调整,目的是使图片更契合场景。

我们看到预览窗口中我们插入的图片,以及左面相应的参数设置区域。显然,我们需要对插入的这张图片进行调整(为了更好的深入介绍,特意选择了场景空间中原本存在的图片,同时,插入的图片与场景中的原图略有出入,这样便能详细的讲解一些参数调整)。

我们注意,对插入的图片进行调整,我们可以通过左边的区域设置参数,也可以直接对右边的图片通过鼠标拖动调整,当然,两者相辅相成才能更好的调整出来最终效果。

开始调整。

首先,由于插入的图片尺寸过大,我们对预览窗口先鼠标滚轮,改变一下视场角(拉远距离)。

然后我们初步调整下图片在预览窗口中的大小,鼠标左键按住图片四个角的其中一个,上下拖动,向上是放大,向下是缩小。

先暂时调整个大概,下面进行契合度的调整。

我们注意到图片上有三个旋转箭头,这三个箭头是示意,分别围绕各自中心轴旋转。

这也是参数区域对应的示意图

我们对于这张图片让它绕Y轴旋转

鼠标左键按住红框的旋转箭头,上下拖动,使图片与场景中的图片在空间上大概平行。

然后我们再次拖动图片顶点,调整大小,并点击图片中间“相机”位置移动位置。

然后我们需要在左侧参数设置区域,调整“垂直拉伸”(后面的数值大于100%是拉伸,小于100%是压缩),将数值调小进行垂直方向的压缩。

然后重复几步上面的步骤,拖动图片的位置,改变大小,垂直方向的伸缩,或调整XYZ旋转,最终使得图片契合场景。

输出预览一下,契合度还可以。

整个调整过程比较繁琐,我们需要耐心点,刚开始可能会很麻烦,慢慢地熟能生巧,大部分都会调整的非常契合。

再次说明一下,参数对应的调整。

绕X、Y、Z轴旋转我们就不说了,在预览窗口中有三个旋转箭头与之相对应。

平移、倾角是图片的在空间中的定位,也即通过这两个参数,移动图片在空间的位置,当然我们可以直接点击图片中心的“相机”图标拖动改变位置。

视场角/视场,即图片在空间的大小,我们可以直接在预览窗口中上下拖动图片的定点调整大小。

垂直拉伸,即改变图片的宽高比例,当然我们还可以直接调整上面参数的“大小”像素值,来改变图片的尺寸比例。

剩下就是单击模式和手指光标了,后者没有什么特殊的,打勾后,输出预览时,鼠标经过插入的图片时,箭头光标会变成小手光标。

我们最后说一下单击模式。

单击模式有两种,一种是正常弹出,一种时是100%弹出。

正常弹出的意思是,点击插入的图片,图片由契合场景的状态弹出放大,放大到原本自身的尺寸,这种适合插入的图片尺寸不大,如果尺寸过大,超出浏览器显示区域的大小,那么超出的部分将会看不到。

而100%弹出的意思,是点击弹出放大,但会撑满浏览器的宽或高,视图片的宽高比例而定,图片宽高比小于浏览器显示区域的宽高比(图片竖条状),也即我们演示的这个例子,那么图片的高会撑满浏览器显示区域的高(垂直空间)。反之,则反。如果比较巧的话,插入的图片宽高比等于览器显示区域的宽高比,那么图片将会铺满显示区。

当然不论那种模式,再次点击一下弹出的图片,图片将会恢复到插入的状态。

补充一下,如果我们不想使用100%弹出,铺满宽或高的显示。那么我们可以使用正常弹出,只要插入的图片我们提前处理一下大小就可以,使图片不要超出浏览器的宽且高就好。但是,如果输出的漫游也在手机浏览器观看,那么还是100%弹出更省心一些,否则得兼顾考虑常见电脑和手机的屏幕尺寸比例。而如果这张图在场景中很大,我们又不能处理的太小,否则插入,需要往大了拉伸,可能导致插入场景不清晰的结果。

注意:实际案例可能这种场景嵌入图片的形式比较少见,因为调整契合比较麻烦,且有时候效果不太让人满意。常见的形式是 热点弹出图片 。

“场景中添加图片”的17个回复

  1. 你好,非常好的教程。想问下插入图片后有四个控制点,发现是没法单独控制的是吗,比如解锁比例缩放,单独拖拽某个点调整。

    1. 是的,这个比较麻烦一些,不能像PS的“扭曲”一样调整,只能缩放,可“垂直拉伸”非比例缩放,调整只能通过绕轴旋转和位移调整。

  2. 你好,感谢编辑这么全面的教程。看完这节有个问题,请问如何在场景中删除添加的图片?

  3. 很严谨完备的一套关于pano2vr的教程,非常感谢。在图片显示这里追问以下问题:当我的图片需要弹出后通过触摸缩放是否支持?如何设置?这里的操作我看完后测试了一下,图片弹出后只能拖拽全景图,不能缩放所弹出的图片,我想这个需求应该是合理的,不知道能否告知一下

    1. 需求是合理的,不过pano2vr并没有考虑到这个需求,所以单纯的软件本身并不能直接实现。通常实现的办法是热点或热区弹出网页层,加载一个能随意拖拽和鼠标滚轮缩放图片的web程序。
      实现不难,两个关键点:1.热点(区)弹出网页层 2.自写或找一个现成的符合功能需求的web程序

    1. 检查一下output的文件夹下image文件夹里有没有插入的图片,检查一下图片命名是否有中文。

    1. 还真没遇到过插入图片不显示的情况,图片使用常用的格式,比如jpg/png,另外注意一下不要太大,如果这些都没问题,很可能就是软件的问题了。

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注