一种3d网页的同步显示方法及系统的制作方法_3

文档序号:9597912阅读:来源:国知局
3D输出显示。
[0095]具体来说,实际应用场景下,由于网络的不稳定,浏览器接收到的文字信息和图片通常并不是完整的,尤其是在网页本身带有大量图片的情况下,这时候会产生左视图的内容已经加载而右视图不加载的情况。为了应对这种情况,本发明进行了进行同步控制。
[0096]步骤2中,前述的本发明的3D网页的网页代码依照上述顺序被逐行传输至浏览器。步骤3中,对同一 3D网页中截止到[3dprogress]L100[/3dprogress]的代码被传送到浏览器时,浏览器通过实时判断发现,目前仅有左视图进度标志位,不存在右视图进度标志位,即,左、右视图不存在相同的进度,则不进行渲染。
[0097]假设同一 3D网页中截止到[3dprogress]R50[/3dprogress]的代码被传送到浏览器,浏览器通过实时判断发现,目前已经接收并加载的代码中包括有进度标志位[3dprogress] L50 [/3dprogress],可见,左视图与右视图均已加载到一相同进度,50%。此时,针对左视图中前50%的代码和右视图中前50%的代码,执行渲染,对于左、右视图的渲染结果,分别输送至左、右视图播放通道进行3D输出显示。
[0098]另外,由于只渲染了 50%,不能组成一帧完整的画面,故而,本发明利用被渲染的部分以及空白像素,封装成一帧图像画面,进行3D输出显示。此时,用户所看到的画面虽然不完整,但是,左右眼分别看到的画面是对应的,则双眼不会出现不适的感觉。
[0099]另外,在步骤3中进一步包括:
[0100]步骤31,实时判断是否存在具有最新相同进度的左视图进度标志位以及右视图进度标志位;如果是,将具有最新相同进度的左视图进度标志位以及右视图进度标志位作为该目标标志位。
[0101]具体来说,在浏览器继续接收网页代码以及加载的过程中,假设截止到[3dprogress] R75 [/3dprogress]的代码被传送到浏览器,贝丨J浏览器实时判断出,当前加载的代码中,同时包括[3dprogress]L75[/3dprogress]以及[3dprogress]R75[/3dprogress],则当前最新相同进度为75%,则此时将左视图中截止到[3dprogress]L75[/3dprogress]的代码,以及右视图中截止到[3dprogress]R75[/3dprogress]的代码,执行渲染,对于左、右视图的渲染结果,分别输送至左、右视图播放通道进行3D输出显示。
[0102]其中,由于左右视图均只渲染了 75%,不能组成一帧完整的画面,故而,本发明需利用被渲染的75%以及25%的空白像素,封装成一帧图像画面,进行3D输出显示。
[0103]在该步骤2中,既可以先传输左视图的全部代码,后传输右视图的全部代码,也可以先传输右视图的全部代码,后传输左视图的全部代码。
[0104]另外,在另一实施例中,该步骤2、3之间还包括:
[0105]步骤21,判断当前是否接收到一幅完整的3D网页的全部代码,如果否,使渲染停止,通过留白或者加进度条的方式锁定屏幕,继续执行步骤3,如果是,对接收到的该幅3D网页进行整体渲染,封装成一帧图像画面,进行3D输出显示。
[0106]在步骤21中,同样根据进度标志位进行完整性的判断,如果左视图进度标志位以及右视图进度标志位的相应进度均达到了 100%,则视为当前接收到了一幅完整的3D网页的全部代码。
[0107]本发明通过进行完整性判断,在完整时直接进行整体渲染,在不完整时,再执行所述同步显示方法,以提高处理效率。
[0108]另外,在网页设计的过程中,为了使得3D显示的效果更佳,使得用户的双眼收看网页更加自然,本申请对3D网页的设计存在一些具体的设计方法。
[0109]在左右视图中,同一图片的设置位置需要做到对应,CSS代码可以通过margin或者padding属性来设置各个元素从距离各个方向的边界的边距。
[0110]该左视图的代码与右视图的代码中,就同一图片的位置关系为:
[0111]rtop = Itop ;
[0112]rbottom = Ibottom
[0113]rleft = lleft+wide/2
[0114]rright = 2*wide-rleft-lleft-lright
[0115]其中,rtop为右视图中的图片距离该3D网页的顶边的边距,Itop左视图中的图片距离该3D网页的顶边的边距,rbottom为右视图中的图片距离该3D网页的底边的边距,Ibottom为左视图中的图片距离该3D网页的底边的边距,rleft为右视图中的图片距离该3D网页的左边界的边距,Ileft为左视图中的图片距离该3D网页的左边界的边距,rright为右视图中的图片距离该3D网页的右边界的边距,Iright为左视图中的图片距离该3D网页的右边界的边距,wide为该3D网页的宽度。
[0116]该左视图的代码与右视图的代码中,就同一文字的位置关系为:
[0117]rtop = Itop ;
[0118]rbottom = Ibottom
[0119]rleft = lleft+wide/2+n
[0120]rright = lright-wide/2+n
[0121]其中,rtop为右视图中的文字距离该3D网页的顶边的边距,Itop左视图中的文字距离该3D网页的顶边的边距,rbottom为右视图中的文字距离该3D网页的底边的边距,Ibottom为左视图中的文字距离该3D网页的底边的边距,rleft为右视图中的文字距离该3D网页的左边界的边距,Ileft为左视图中的文字距离该3D网页的左边界的边距,rright为右视图中的文字距离该3D网页的右边界的边距,Iright为左视图中的文字距离该3D网页的右边界的边距,wide为该3D网页的宽度,η为用于视差模拟的像素个数,η为整数。
[0122]具体来说,左右图片位置计算方法为以左图为标准。以下例子均以像素为单位,设计屏幕大小为1920x1080像素。
[0123]左图片:ltop100 Ibottom 900 Ileft 100 Iright 1800
[0124]右图片:rtop100 rbotton 900 rleft 1060 rright 880
[0125]文字计算方法实际上也可以和图片相同,因为目前各个系统上的字体都是平面设计。但是,如需展现字体的3D效果,需要将字体进行3D建模,目前为了兼容普通字体的3D效果,可以通过错开η个像素来模拟视差,η既可为正整数也可为负整数,η的值决定了文字的突出效果,过大的η值会导致左右眼图像无法重合,该值可以根据不同的设备进行适配。
[0126]左文字:ltop200 Ibotton 800 Ileft 100 Iright 1800
[0127]右文字:rtop200 rbottom 800 rleft 1060+n rright 880-n
[0128]通过上述3D网页的设置,使得左右视图在3D显示过程中,更加利于使人眼产生立体感,进而在同步显示时能够得到更自然的效果。
[0129]综上所述,通过本发明的上述技术方案,可以使得3D网页在显示过程中进行左右视图同步渲染,提升3D观影的用户体验。
[0130]以上仅为本发明的技术方案的实施例,本领域的技术人员依照本发明权利要求所记载的方案所实施的等效或明显变形,也包括于本发明的保护范围内。
【主权项】
1.一种3D网页的同步显示方法,应用于一立体影视播放装置,其特征在于,包括: 步骤1,于3D网页的代码中,为隶属于同一 3D网页的左视图设置多个左视图进度标志位,为隶属于同一 3D网页的右视图设置多个右视图进度标志位; 步骤2,该立体影视播放装置接收所传输的该3D网页的代码; 步骤3,实时判断当前所收取到的代码中,是否存在具有相同进度的左视图进度标志位以及右视图进度标志位,如果是,将该具有相同进度的左视图进度标志位
当前第3页1 2 3 4 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1