CN106846495B - 实现增强现实的方法与装置 - Google Patents

实现增强现实的方法与装置 Download PDF

Info

Publication number
CN106846495B
CN106846495B CN201710032125.6A CN201710032125A CN106846495B CN 106846495 B CN106846495 B CN 106846495B CN 201710032125 A CN201710032125 A CN 201710032125A CN 106846495 B CN106846495 B CN 106846495B
Authority
CN
China
Prior art keywords
image
augmented reality
page
canvas
identifier
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201710032125.6A
Other languages
English (en)
Other versions
CN106846495A (zh
Inventor
陈霖炜
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Tencent Technology Shenzhen Co Ltd
Original Assignee
Tencent Technology Shenzhen Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Tencent Technology Shenzhen Co Ltd filed Critical Tencent Technology Shenzhen Co Ltd
Priority to CN201710032125.6A priority Critical patent/CN106846495B/zh
Publication of CN106846495A publication Critical patent/CN106846495A/zh
Priority to PCT/CN2018/071776 priority patent/WO2018133692A1/zh
Application granted granted Critical
Publication of CN106846495B publication Critical patent/CN106846495B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G06F16/972Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T19/00Manipulating 3D models or images for computer graphics
    • G06T19/006Mixed reality

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • Computer Graphics (AREA)
  • Computer Hardware Design (AREA)
  • Software Systems (AREA)
  • Data Mining & Analysis (AREA)
  • Processing Or Creating Images (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

一种实现增强现实的方法及装置,一个实施例中的方法包括:向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;由所述增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。本实施例方案开发成本低,可以应用于任何操作系统的终端,可以跨平台使用,且维护便利,维护成本低。

Description

实现增强现实的方法与装置
技术领域
本发明涉及增强现实技术领域,特别是涉及一种实现增强现实的方法以及一种实现增强现实的装置。
背景技术
旨在增强现实技术(Augmented Reality,简称AR)是在虚拟现实技术的基础上发展出来的一个新的技术方向,是利用虚拟物体对真实场景进行现实增强的技术,其基于摄像头等采集器件采集到的真实物理环境,根据标记或特征来确定输入图像在该真实物理环境的三维空间中的坐标位置,然后将3D模型叠加到这个坐标系统,从而实现真实环境和虚拟环境的结合,实现对用户身处的现实物理环境的注释、说明,或者增强、强调现实环境的某些效果。AR给用户一种虚拟对象与现实环境两相融合的体验,能有效地帮助用户认知周围环境,增添周围环境的信息,实现用户与周围环境的交互。
目前的AR技术都是针对终端的客户端来实现,图1中示出了一个示例中的目前的AR技术实现的示意图,由图1可见,基于终端的操作系统的不同,会开发特定的实现AR技术的客户端,目前而言,通常分别为IOS和Android两个客户端。其实现原理,都是通过已有的图像识别库进行开发。然而,原生应用开发难度复杂,不仅不同的终端操作系统需要不同的开发人员,每一个改动要基于操作系统的版本进行,开发周期长,人力、开发成本等资源耗费大,而且在客户端版本有更新时,必须由终端用户手动下载更新,而且历史版本也必须要维护,维护成本高。
发明内容
基于此,本发明实施例的目的在于提供一种开发、维护成本低且使用方便快捷的实现增强现实的方法以及实现增强现实的装置。
为达到上述目的,本发明实施例采用以下技术方案:
一种实现增强现实的方法,包括步骤:
向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
由所述增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
一种实现增强现实的方法,包括步骤:
接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
由所述终端浏览器基于接收的所述WEB页面中的增强现实的装置,获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
一种实现增强现实的装置,包括:
页面请求发送模块,用于向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
页面响应接收模块,用于接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
所述增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
一种实现增强现实的装置,包括:
页面请求接收模块,用于接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
页面获取模块,用于获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
页面响应发送模块,用于向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
所述增强现实的装置在返回至所述终端浏览器后,获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
如上所述的实施例的方案,其通过WEB的方式实现增强现实的效果,实现时,是终端浏览器基于访问网页页面的方式从WEB服务器获得增强现实的装置,进而在终端上实现增强现实,其与终端的操作系统无关,因而在进行开发时针对不同的终端操作系统都只需要开发一套代码即可,开发成本低,使用时不仅方便便捷,而且可以应用于任何操作系统的终端,可以跨平台使用,另一方面,由于终端浏览器是从WEB服务器请求页面时获得增强现实的装置,在进行维护时可以只需在WEB服务器对其增强现实的装置进行维护即可,只需要在WEB服务器对增强现实的装置进行更新,后续任何终端访问时都是最新的增强现实的实现方式,维护便利且成本低。
附图说明
图1是一个示例中的目前的AR技术实现的示意图;
图2是一个实施例中本发明实施例方案的应用环境的示意图;
图3是一个实施例中的终端的组成结构示意图;
图4是一个实施例中的WEB服务器的组成结构示意图;
图5是一个实施例中的实现增强现实的方法的流程示意图;
图6是另一个实施例中的实现增强现实的方法的流程示意图;
图7是一个具体应用示例中的实现增强现实时的交互流程示意图;
图8是一个具体应用示例中的实现增强现实的技术原理示意图;
图9是一个具体应用示例中进行图像处理获得的灰度图像和二值化图像的示意图;
图10是一个具体应用示例中的预定标识的ID信息排列方式的示意图;
图11是图10所示的预定标识的图像示意图;
图12是一个实施例中的实现增强现实的装置的结构示意图;
图13是另一个实施例中的实现增强现实的装置的结构示意图。
具体实施方式
为使本发明的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本发明进行进一步的详细说明。应当理解,此处所描述的具体实施方式仅仅用以解释本发明,并不限定本发明的保护范围。
图2示出了本发明一个实施例中的工作环境示意图,如图2所示,其工作环境涉及终端101以及WEB(环球网)服务器100,终端101与WEB服务器100可以通过网络进行通信。终端101可以向WEB服务器100请求WEB页面,WEB服务器100基于终端101的请求获取对应的WEB页面并返回给终端101进行显示。在本发明实施例中,WEB服务器100在获取了终端101请求的WEB页面后,在该WEB页面中嵌入增强现实的装置,然后返回给终端101,终端101在获WEB得服务器100返回的WEB页面并显示后,WEB页面中嵌入的增强现实的装置执行增强现实的处理,使得在WEB的终端就可以产生增强现实的效果。
终端101在一个实施例中的结构示意图如图3所示。该终端101包括通过系统总线连接的处理器、存储介质、通信接口、电源接口和内存。其中,终端101的存储介质存储有一种实现增强现实的装置,该装置用于实现一种实现增强现实的方法。终端101的通信接口用于与WEB服务器100连接和通信,终端101的电源接口用于与外部电源连接,外部电源通过该电源接口向终端101供电。终端101可以是任何一种能够接入WEB网络的设备,例如移动终端、平板电脑、个人计算机等;也可以是其它具有上述结构的设备。
WEB服务器100在一个实施例中的结构示意图如图4所示。其包括通过系统总线连接的处理器、供电模块、存储介质、内存和通信接口。其中,WEB服务器的存储介质存储有操作系统、数据库和一种实现增强现实的装置,该装置用于实现一种实现增强现实的方法。WEB服务器100的通信接口用于与终端101进行连接和通信。
图5示出了一个实施例中的实现增强现实的方法的流程示意图,该实施例中是以应用在终端101为例进行说明。
如图5所示,该实施例中的实现增强现实的方法包括:
步骤S501:向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
步骤S502:接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
步骤S503:由所述增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
相对应地,图6示出了另一个实施例中的实现增强现实的方法的流程示意图,该实施例是以WEB服务器的处理过程为例进行说明。
如图6所示,该实施例中的实现增强现实的方法包括:
步骤S601:接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
步骤S602:获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
步骤S603:向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
步骤S604:由所述终端浏览器基于接收的所述WEB页面中的增强现实的装置,获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
如上所述的实施例的方案,其通过WEB的方式实现增强现实的效果,实现时,是终端浏览器基于访问网页页面的方式从WEB服务器获得增强现实的装置,进而在终端上实现增强现实,其与终端的操作系统无关,因而在进行开发时针对不同的终端操作系统都只需要开发一套代码即可,开发成本低,使用时不仅方便便捷,而且可以应用于任何操作系统的终端,可以跨平台使用,另一方面,由于终端浏览器是从WEB服务器请求页面时获得增强现实的装置,在进行维护时可以只需在WEB服务器对其增强现实的装置进行维护即可,只需要在WEB服务器对增强现实的装置进行更新,后续任何终端访问时都是最新的增强现实的实现方式,维护便利且成本低。
在一个具体示例中,上述增强现实的装置在获取所在终端的摄像设备的视频流之后,对所述视频流的视频帧进行图像处理之前,还可以将所述视频流的各视频帧转换为画布图像。从而在对视频流的视频帧进行图像处理时,可以是基于画布的图像处理能力,对转换到画布的画布图像进行图像处理。
在一个具体示例中,终端浏览器基于上述增强现实的装置,可以通过实时通信的媒体流接口获取所在终端的摄像设备的同步视频流。这里的实时通信的媒体流接口可以结合实际技术应用需要来设定,在一个具体示例中,该实时通信的媒体流接口可以为WebRTC的MediaStream接口。
在一个具体示例中,终端浏览器基于上述增强现实的装置,在对上述视频帧进行图像处理时,可以是依次进行灰度处理和二值化处理,例如,可以通过调用图像处理脚本对视频帧依次进行灰度化处理和二值化处理获得所述二值化图像。这里的图像处理脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像处理脚本可以为cv.js。
在一个具体示例中,终端浏览器基于上述增强现实的装置,可以通过图像识别库从所述二值化图像中识别出所述预定标识,获得所述预定标识的坐标范围,所述图像识别库包括图像识别库脚本。这里的图像识别库脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像识别库脚本可以为aruco.js、Awe.js。
在一个具体示例中,终端浏览器基于上述增强现实的装置,可以根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
为便于对本实施例方案的理解,图7示出了一个具体应用示例中的实现增强现实时的交互流程示意图。
如图7所示,在终端有访问网络的请求时,可以通过终端浏览器等向WEB服务器发送页面访问请求,该页面访问请求中包括有页面标识。
WEB服务器接收到该页面访问请求后,获取与上述页面标识对应的WEB页面,其中该WEB页面中嵌入有增强现实的装置,然后向终端浏览器返回页面访问响应,该页面访问响应中包括有上述WEB页面。
终端浏览器接收到WEB服务器返回的页面访问响应后,由该增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
图8中示出了一个具体应用示例中的实现增强现实的技术原理示意图,如图8所示,上述嵌入在WEB页面中的增强现实的装置,可以运用实时通信的媒体流接口,例如能为浏览器提供实时通信的javascript接口WebRtc,通过用户设备的摄像头获得视频同步流。WebRtc里面的MediaStream这个API可以通过设备的摄像头获得视频的同步流。例如通过html5的video标签可以获得摄像头的同步画面。
在获得用户设备的视频同步流后,可对该视频同步流的视频帧进行图像处理,将其转化为二值化图像。在可能的情况下,可以直接对视频同步流的视频帧进行上述图像处理。为了提高处理效率,可以应用画布的图像处理能力,因此可以创建画布后,将视频流的视频帧截取到创建的画布上,以将视频流的视频帧转换为画布图像。在转化为画布图像后,每一帧视频帧就转换成了一个canvas像素矩阵。
随后,即可对上述画布图像进行图像处理,并从图像处理后的图像中识别出预定标识。
在进行图像处理时,在一个具体示例中,可以是对画布图像进行灰度处理将其转换为灰度图像后,再对该灰度图像进行二值化处理获得二值化图像。具体的灰度处理和二值化处理的方式可以采用目前已有以及以后可能出现的任何方式进行。一个具体应用示例中,在进行图像处理时,可以通过调用图像处理脚本,例如JavaScript中的cv.js进行,一个具体应用示例中得到的灰度图像和二值化图像的示意图如图9所示。
在得到二值化图像后,即可基于设定的预定标识,从二值化图像中识别出预定标识时,确定二值化图像中的预定标识的位置。具体的从二值化图像中识别出预定标识的方式,可以结合图像识别库设定好的预定标识的类型来确定。
在一个具体示例中,假设图像识别库脚本为Aruco.js,即采用的是Aruco.js规定的标识,而Aruco.js的标识规定了其必须是一个七乘七、有黑色边框的、内部是五乘五的ID信息,图10中示出了一个具体示例中的Aruco.js规定的预定标识的ID信息排列方式的示意图。
以采用Aruco.js规定的标识为预定标识为例,上述cv.js确定的二值化图像可传递给Aruco.js,由Aruco.js从中识别出上述预定标识,一个具体示例中从图10中识别出的预定标识的图像示意图如图11所示。Aruco.js从中识别出上述预定标识后,可以返回识别出的预定标识的位置坐标,以预定标识为二维码为例,其返回的可以是标识的四个端点的坐标的数组。
在识别出该预定标识后,即可在识别出的预定标识的位置进行3D绘图,获得绘制的3D图像,在进行3D绘图时,可以是使用图像建模的库进行3D绘图,例如three.js。然后将绘制的该3D图像显示在摄像设备拍摄到的画面中,从而形成增强现实的显示画面,实现WEB端的增强现实的效果。
如上所述的实施例中的方法,开发成本低,周期短,且由于具体增强现实时的增强现实的装置是嵌入在WEB服务器向终端返回的WEB页面中,因此,在需要对增强现实的装置进行改变时,每个小改动可以通过实时更新WEB服务器上的相关页面,就可以终端用户可以实时查看到最新的版本,从而不仅可以方便、快捷的部署,不需要用户安装,而且也能使得终端用户总能访问到最新的版本,在需要实现不同的增强现实的效果时,无需大量的修改或者重新编写代码,通过更改图像建模库即可实现不同的增强现实的效果,迭代更新等维护过程容易。
基于与上述方法相同的思想,本发明实施例还提供一种实现增强现实的装置。
图12示出了一个实施例中的实现增强现实的装置的结构示意图,该实施例是以设置在终端101上为例进行说明。
如图12所示,该实施例中的装置包括:
页面请求发送模块1201,用于向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
页面响应接收模块1202,用于接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
所述增强现实的装置获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
如上所述的实施例的方案,其通过WEB的方式实现增强现实的效果,终端浏览器基于访问网页页面的方式从WEB服务器获得增强现实的装置,进而在终端上实现增强现实,其与终端的操作系统无关,因而在进行开发时针对不同的终端操作系统都只需要开发一套代码即可,开发成本低,使用时不仅方便便捷,而且可以应用于任何操作系统的终端,可以跨平台使用,另一方面,由于终端浏览器是从WEB服务器请求页面时获得增强现实的装置,在进行维护时可以只需在WEB服务器对其增强现实的装置进行维护即可,只需要在WEB服务器对增强现实的装置进行更新,后续任何终端访问时都是最新的增强现实的实现方式,维护便利且成本低。
如图12所示,在一个具体示例中,页面响应接收模块1202从WEB服务器接收的WEB页面中嵌入的增强现实的装置1200包括:
视频流获取模块1201,用于获取所在终端的摄像设备的视频流;在一个具体示例中,该视频流获取模块1201可以通过实时通信的媒体流接口获取所在终端的摄像设备的同步视频流;这里的实时通信的媒体流接口可以结合实际技术应用需要来设定,在一个具体示例中,该实时通信的媒体流接口可以为WebRTC的MediaStream接口;
图像处理模块1202,用于对所述视频流的视频帧进行图像处理获得图像处理后的图像;在一个具体示例中,图像处理模块1202在对上述视频帧进行图像处理时,可以是依次进行灰度处理和二值化处理得到二值化图像,例如,通过调用图像处理脚本对视频帧依次进行灰度化处理和二值化处理获得所述二值化图像;这里的图像处理脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像处理脚本可以为cv.js;
标识识别模块1203,用于从所述图像处理模块1202处理后的图像中识别出预定标识;在一个具体示例中,标识识别模块1203可以通过图像识别库从所述二值化图像中识别出所述预定标识,获得所述预定标识的坐标范围,这里的图像识别库可以包括图像识别库脚本,这里的图像识别库脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像识别库脚本可以为aruco.js、Awe.js等图像识别库;
3D绘图模块1204,用于在识别出的所述预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面;在一个具体示例中,3D绘图模块根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面;一个具体示例中的3D绘图方式,可以是采用three.js等进行绘制。
在一个具体示例中,上述增强现实的装置1200还包括画布图像转换模块:用于将所述视频流的各视频帧转换为画布图像。此时,上述图像处理模块1202,是对画布图像转换模块转换得到的画布图像进行图像处理获得所述二值化图像。
图13示出了另一个实施例中的实现增强现实的装置的结构示意图,该实施例是以设置在WEB服务器100上为例进行说明。
如图13所示,该实施例中的装置包括:
页面请求接收模块1301,用于接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
页面获取模块1302,用于获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
页面响应发送模块1303,用于向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
上述增强现实的装置在返回至所述终端浏览器后,获取所在终端的摄像设备的视频流,对所述视频流的视频帧进行图像处理,从图像处理后的图像中识别出预定标识,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
如上所述的实施例的方案,其通过WEB的方式实现增强现实的效果,实现时,是终端浏览器基于访问网页页面的方式从WEB服务器获得增强现实的装置,进而在终端上实现增强现实,其与终端的操作系统无关,因而在进行开发时针对不同的终端操作系统都只需要开发一套代码即可,开发成本低,使用时不仅方便便捷,而且可以应用于任何操作系统的终端,可以跨平台使用,另一方面,由于终端浏览器是从WEB服务器请求页面时获得增强现实的装置,在进行维护时可以只需在WEB服务器对其增强现实的装置进行维护即可,只需要在WEB服务器对增强现实的装置进行更新,后续任何终端访问时都是最新的增强现实的实现方式,维护便利且成本低。
如图13所示,在一个具体示例中,WEB服务器的页面响应发送模块1303向终端浏览器返回的WEB页面中嵌入的增强现实的装置1300包括:
视频流获取模块1301,用于获取所在终端的摄像设备的视频流;在一个具体示例中,该视频流获取模块1201可以通过实时通信的媒体流接口获取所在终端的摄像设备的同步视频流;这里的实时通信的媒体流接口可以结合实际技术应用需要来设定,在一个具体示例中,该实时通信的媒体流接口可以为WebRTC的MediaStream接口;
图像处理模块1302,用于对所述视频流的视频帧进行图像处理获得图像处理后的图像;在一个具体示例中,图像处理模块1202在对上述视频帧进行图像处理时,可以是依次进行灰度处理和二值化处理获得二值化图像,例如,通过调用图像处理脚本对视频帧依次进行灰度化处理和二值化处理获得所述二值化图像;这里的图像处理脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像处理脚本可以为cv.js;
标识识别模块1303,用于从图像处理模块1302处理后的图像中识别出预定标识;在一个具体示例中,标识识别模块1203可以通过图像识别库从所述二值化图像中识别出所述预定标识,获得所述预定标识的坐标范围,这里的图像识别库可以包括图像识别库脚本,这里的图像识别库脚本可以结合实际技术应用需要来设定,在一个具体示例中,该图像识别库脚本可以为aruco.js、Awe.js等图像识别库;
3D绘图模块1304,用于在识别出的所述预定标识上进行3D绘图获得绘制的3D图像,并将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面;在一个具体示例中,3D绘图模块根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面;一个具体示例中的3D绘图方式,可以是采用three.js等进行绘制。
本实施例的实现增强现实的装置中具体的技术应用实现方式,可以与上述实现增强现实的方法类似的方式处理。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的程序可存储于一非易失性的计算机可读取存储介质中,如本发明实施例中,该程序可存储于计算机系统的存储介质中,并被该计算机系统中的至少一个处理器执行,以实现包括如上述各方法的实施例的流程。其中,所述的存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)或随机存储记忆体(Random Access Memory,RAM)等。
以上所述实施例的各技术特征可以进行任意的组合,为使描述简洁,未对上述实施例中的各个技术特征所有可能的组合都进行描述,然而,只要这些技术特征的组合不存在矛盾,都应当认为是本说明书记载的范围。
以上所述实施例仅表达了本发明的几种实施方式,其描述较为具体和详细,但并不能因此而理解为对发明专利范围的限制。应当指出的是,对于本领域的普通技术人员来说,在不脱离本发明构思的前提下,还可以做出若干变形和改进,这些都属于本发明的保护范围。因此,本发明专利的保护范围应以所附权利要求为准。

Claims (14)

1.一种实现增强现实的方法,其特征在于,包括步骤:
向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
由所述增强现实的装置运用能为浏览器提供实时通信的javascript接口WebRtc中的MediaStream接口,通过html5的video标签获得所在终端的摄像设备的视频流,创建画布,并将所述视频流的视频帧截取到创建的画布上,以将所述视频流的视频帧转换为画布图像,通过调用图像处理脚本cv.js对所述画布图像依次进行灰度处理和二值化处理,获得二值化图像,并由图像识别库脚本Aruco.js或者Awe.js从所述二值化图像中识别出预定标识,获得所述预定标识的坐标范围,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
2.根据权利要求1所述的实现增强现实的方法,其特征在于,在进行3D绘图时,使用图像建模的库three.js进行3D绘图。
3.根据权利要求1或2所述的实现增强现实的方法,其特征在于,所述画布图像为canvas像素矩阵。
4.一种实现增强现实的方法,其特征在于,包括步骤:
接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
由所述终端浏览器基于接收的所述WEB页面中的增强现实的装置,运用能为浏览器提供实时通信的javascript接口WebRtc中的MediaStream接口,通过html5的video标签获得所在终端的摄像设备的视频流,创建画布,并将所述视频流的视频帧截取到创建的画布上,以将所述视频流的视频帧转换为画布图像,通过调用图像处理脚本cv.js对所述画布图像依次进行灰度处理和二值化处理,获得二值化图像,并由图像识别库脚本Aruco.js或者Awe.js从所述二值化图像中识别出预定标识,获得所述预定标识的坐标范围,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
5.根据权利要求4所述的实现增强现实的方法,其特征在于,所述终端浏览器基于所述增强现实的装置在进行3D绘图时,使用图像建模的库three.js进行3D绘图。
6.根据权利要求4或5所述的实现增强现实的方法,其特征在于,所述画布图像为canvas像素矩阵。
7.一种实现增强现实的装置,其特征在于,包括:
页面请求发送模块,用于向WEB服务器发送页面访问请求,所述页面访问请求包括页面标识;
页面响应接收模块,用于接收所述WEB服务器根据所述页面访问请求返回的页面访问响应,所述页面访问响应包括与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
所述增强现实的装置运用能为浏览器提供实时通信的javascript接口WebRtc中的MediaStream接口,通过html5的video标签获得所在终端的摄像设备的视频流,创建画布,并将所述视频流的视频帧截取到创建的画布上,以将所述视频流的视频帧转换为画布图像,通过调用图像处理脚本cv.js对所述画布图像依次进行灰度处理和二值化处理,获得二值化图像,并由图像识别库脚本Aruco.js或者Awe.js从所述二值化图像中识别出预定标识,获得所述预定标识的坐标范围,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
8.根据权利要求7所述的实现增强现实的装置,其特征在于,所述增强现实的装置在进行3D绘图时,使用图像建模的库three.js进行3D绘图。
9.根据权利要求7或8所述的实现增强现实的装置,其特征在于,所述画布图像为canvas像素矩阵。
10.一种实现增强现实的装置,其特征在于,包括:
页面请求接收模块,用于接收终端浏览器发送的页面访问请求,所述页面访问请求包括页面标识;
页面获取模块,用于获取与所述页面标识对应的WEB页面,所述WEB页面中嵌入有增强现实的装置;
页面响应发送模块,用于向所述终端浏览器返回页面访问响应,所述页面访问响应中包括所述WEB页面;
所述增强现实的装置在返回至所述终端浏览器后,运用能为浏览器提供实时通信的javascript接口WebRtc中的MediaStream接口,通过html5的video标签获得所在终端的摄像设备的视频流,创建画布,并将所述视频流的视频帧截取到创建的画布上,以将所述视频流的视频帧转换为画布图像,通过调用图像处理脚本cv.js对所述画布图像依次进行灰度处理和二值化处理,获得二值化图像,并由图像识别库脚本Aruco.js或者Awe.js从所述二值化图像处理后的图像中识别出预定标识,获得所述预定标识的坐标范围,在识别出的预定标识上进行3D绘图获得绘制的3D图像,并根据所述预定标识的坐标范围将绘制的3D图像显示在所述摄像设备拍摄到的画面中,形成增强现实的显示画面。
11.根据权利要求10所述的实现增强现实的装置,其特征在于,所述增强现实的装置在进行3D绘图时,使用图像建模的库three.js进行3D绘图。
12.根据权利要求11所述的实现增强现实的装置,其特征在于,所述画布图像为canvas像素矩阵。
13.一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至6中任一项所述的方法的步骤。
14.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至6中任一项所述的方法的步骤。
CN201710032125.6A 2017-01-17 2017-01-17 实现增强现实的方法与装置 Active CN106846495B (zh)

Priority Applications (2)

Application Number Priority Date Filing Date Title
CN201710032125.6A CN106846495B (zh) 2017-01-17 2017-01-17 实现增强现实的方法与装置
PCT/CN2018/071776 WO2018133692A1 (zh) 2017-01-17 2018-01-08 实现增强现实的方法、计算机设备及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710032125.6A CN106846495B (zh) 2017-01-17 2017-01-17 实现增强现实的方法与装置

Publications (2)

Publication Number Publication Date
CN106846495A CN106846495A (zh) 2017-06-13
CN106846495B true CN106846495B (zh) 2022-10-25

Family

ID=59123997

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710032125.6A Active CN106846495B (zh) 2017-01-17 2017-01-17 实现增强现实的方法与装置

Country Status (2)

Country Link
CN (1) CN106846495B (zh)
WO (1) WO2018133692A1 (zh)

Families Citing this family (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN106846495B (zh) * 2017-01-17 2022-10-25 腾讯科技(深圳)有限公司 实现增强现实的方法与装置
CN109582122B (zh) * 2017-09-29 2022-05-03 阿里巴巴集团控股有限公司 增强现实信息提供方法、装置及电子设备
CN108364324B (zh) * 2018-01-22 2021-10-08 杭州橙云科技创新服务有限公司 图像数据处理方法、装置及电子终端
CN108388637A (zh) * 2018-02-26 2018-08-10 腾讯科技(深圳)有限公司 一种用于提供增强现实服务的方法、装置以及相关设备
CN108830153A (zh) * 2018-05-07 2018-11-16 平安普惠企业管理有限公司 用于人脸识别的身份验证方法、装置、设备及存储介质
CN111435069B (zh) * 2019-01-14 2022-07-08 顺丰科技有限公司 测量体积的方法和装置
CN112822557A (zh) * 2019-11-15 2021-05-18 中移物联网有限公司 信息处理方法、装置、电子设备及计算机可读存储介质
CN113055309A (zh) * 2019-12-28 2021-06-29 中移(成都)信息通信科技有限公司 资源加载方法、装置、设备及介质
CN111652637A (zh) * 2020-05-26 2020-09-11 北京掌中飞天科技股份有限公司 Ar广告营销活动跨平台解决方法及电子设备
CN111966942B (zh) * 2020-08-11 2024-06-07 济南科明数码技术股份有限公司 一种移动终端的vr展示方法、系统及设备
CN112433651B (zh) * 2020-11-13 2022-03-11 北京鸿腾智能科技有限公司 区域识别方法、设备、存储介质及装置

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102523288A (zh) * 2011-12-16 2012-06-27 北京视博云科技有限公司 一种为终端设备提供网页服务的系统与方法
CN104134229A (zh) * 2014-08-08 2014-11-05 李成 实时交互的增强现实系统以及方法

Family Cites Families (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20100008265A1 (en) * 2008-07-14 2010-01-14 Carl Johan Freer Augmented reality method and system using logo recognition, wireless application protocol browsing and voice over internet protocol technology
CN104361075A (zh) * 2014-11-12 2015-02-18 深圳市幻实科技有限公司 一种图像网址系统及实现方法
CN104571527B (zh) * 2015-01-26 2017-11-07 华东理工大学 一种基于增强现实技术的3d分子交互对接系统及实现方法
CN106161988A (zh) * 2015-03-26 2016-11-23 成都理想境界科技有限公司 一种增强现实视频生成方法
CN106846495B (zh) * 2017-01-17 2022-10-25 腾讯科技(深圳)有限公司 实现增强现实的方法与装置

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102523288A (zh) * 2011-12-16 2012-06-27 北京视博云科技有限公司 一种为终端设备提供网页服务的系统与方法
CN104134229A (zh) * 2014-08-08 2014-11-05 李成 实时交互的增强现实系统以及方法

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
七宝.Web前端也能做的AR互动.《https://tgideas.qq.com/webplat/info/news_version3/804/7104/7106/m5723/201612/537832.shtml》.2016,第1-10页. *

Also Published As

Publication number Publication date
CN106846495A (zh) 2017-06-13
WO2018133692A1 (zh) 2018-07-26

Similar Documents

Publication Publication Date Title
CN106846495B (zh) 实现增强现实的方法与装置
CN107222529B (zh) 增强现实处理方法、web模块、终端和云端服务器
US11024092B2 (en) System and method for augmented reality content delivery in pre-captured environments
CN113741698B (zh) 一种确定和呈现目标标记信息的方法与设备
US10970938B2 (en) Method and apparatus for generating 3D information
US20190311544A1 (en) Image processing for augmented reality
CN110517214B (zh) 用于生成图像的方法和装置
CN111311756B (zh) 增强现实ar显示方法及相关装置
CN106651992B (zh) 优化Android资源图片的方法及系统
CN108430032B (zh) 一种实现vr/ar设备位置共享的方法及设备
CN110852332A (zh) 训练样本的生成方法、装置、存储介质及电子设备
CN113256781A (zh) 虚拟场景的渲染和装置、存储介质及电子设备
CN115546377B (zh) 一种视频融合方法、装置、电子设备及存储介质
CN110598139A (zh) 基于5G云计算的Web浏览器增强现实实时定位的方法
CN108364324B (zh) 图像数据处理方法、装置及电子终端
EP3679520A1 (en) Processing images to localize novel objects
CN114842120B (zh) 一种图像渲染处理方法、装置、设备及介质
CN113590878A (zh) 在视频画面上规划路径的方法、装置、终端设备
CN114494659A (zh) 一种图像显示方法、装置、ar头戴设备及存储介质
CN106156675A (zh) 一种获取二维码信息的方法及装置
CN117496029A (zh) 基于云端渲染技术的slam系统ar实时可视化方法和系统
CN116074485A (zh) 一种基于增强现实的通话方法及终端
CN113242398A (zh) 一种三维标注的音视频通话方法和系统
CN112394809A (zh) 一种实现增强现实的方法、装置及通信设备
CN112634460B (zh) 基于Haar-like特征的户外全景图生成方法及装置

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant