Webpage 3D (three-dimensional) rendering and controlling method and device

A web and 3D technology, applied in the field of web 3D rendering and control methods and devices, can solve problems such as difficult front-end development and unsmooth 3D scene conversion, achieve smooth and efficient drawing, and reduce development difficulty.

Active Publication Date: 2012-07-18
TCL CORPORATION
View PDF2 Cites 8 Cited by
  • Summary
  • Abstract
  • Description
  • Claims
  • Application Information

AI Technical Summary

Problems solved by technology

[0010] The purpose of the embodiments of the present invention is to provide a webpage 3D rendering and control method and device, aiming at solving the problems of the existing technology that the 3D scene conversion is not smooth and the front-end development is difficult

Method used

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
View more

Image

Smart Image Click on the blue labels to locate them in the text.
Viewing Examples
Smart Image
  • Webpage 3D (three-dimensional) rendering and controlling method and device
  • Webpage 3D (three-dimensional) rendering and controlling method and device
  • Webpage 3D (three-dimensional) rendering and controlling method and device

Examples

Experimental program
Comparison scheme
Effect test

Embodiment 1

[0060] Such as figure 1The flow chart of the web page 3D rendering and control method provided by the present invention is shown, and for the convenience of description, only the parts related to the embodiment of the present invention are shown.

[0061] In step S101, a webpage 3D graphic interface is obtained through the DOM interface of the webpage canvas element.

[0062] In the embodiment of the present invention, the 3D graphic interface of the webpage is obtained through the DOM interface of the canvas element in the javascript of the webpage. Among them, the webpage 3D graphics interface is used to initialize the local window, set the device 3D rendering configuration, and realize 3D drawing by calling the OpenGL ES related interface.

[0063] In step S102, a local window and a local window controller are created, a drawing thread is created in the local window controller, and a drawing interval is set.

[0064] In the embodiment of the present invention, the local w...

Embodiment 2

[0074] Such as figure 2 Shown is that according to the state of the local window provided by the present invention, the drawing thread performs corresponding operations ( figure 1 The method flow chart of step S105) only shows the part related to the embodiment of the present invention for the convenience of description.

[0075] In step S201, obtain the state of the local window;

[0076] In step S202, it is judged whether the local window is in the state of destroying the local window, if yes, step S208 is executed, otherwise step S203 is executed;

[0077] In step S203, it is judged whether the local window is in the local window activation state, if yes, execute step S205, otherwise execute step S204.

[0078] In step S204, the drawing thread is suspended, and the drawing thread is run when the local window is restored to an active state.

[0079] In the embodiment of the present invention, when the local window is in an inactive state, in order to prevent the problem ...

Embodiment 3

[0088] In the embodiment of the present invention, a specific example of a device for realizing 3D rendering and control of web pages is provided, and its functional modules are as follows: image 3 shown.

[0089] In the embodiment of the present invention, the functional modules mainly include four major blocks, namely: web page 31, web engine 32, graphical user interface system 33 and OpenGL ES34. in:

[0090] The web page 31 is the process part of javascript calling the web page 3D graphic interface. It includes three modules, namely: a 3D interface preparation completion module 311 , a window change processing module 312 and a 3D scene drawing module 313 . Specifically:

[0091] The 3D interface preparation completion module 311 corresponds to the preparation completion event and is used for initializing the shader and the graphics data buffer area.

[0092] The window change processing module 312, corresponding to triggering the window change event, is used to call t...

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

PUM

No PUM Login to view more

Abstract

The invention provides a webpage 3D (three-dimensional) rendering and controlling method and a device, which are applicable to the field of computer application. The method includes acquiring a webpage 3D graphic interface via a document object model of webpage canvas elements; creating a local window and a local window controller, creating a drawing thread in the local window controller and setting drawing time intervals; triggering an event ready to be completed, initiating a shader and a graphic data buffer cache; running the drawing thread and obtaining the state of the local window; and executing corresponding operation of the drawing thread according to the state of the local window. In an embodiment of the invention, 3D scene drawing efficiency is high due to the fact that the local thread is used for timing triggering, and animation is drawn smoothly and high-efficiently. In addition, different operations are executed under different obtained states of the local window by the aid of a web engine, and front-end web development difficulty is reduced.

Description

technical field [0001] The invention belongs to the field of computer applications, and in particular relates to a web page 3D rendering and control method and device. Background technique [0002] With the advancement of technology and the rapid development of web technology, traditional 2D web pages can no longer meet people's needs. At present, HTML (Text Markup Language, Hypertext Markup Language) 5 uses WebGL (a 3D drawing standard) as a webpage 3D graphics interface, thereby establishing javascript (a scripting language) and OpenGL ES (OpenGL for Embedded Systems, OpenGL three-dimensional A call bridge between a subset of the graphics application programming interface). Therefore, the front-end personnel of the web page can realize the drawing of the 3D picture by calling OpenGL ES through webgl. There are two main drawing methods: [0003] First, the timer is used to draw the 3D scene. [0004] Firstly, the 3D graphic interface of the web page is obtained through ...

Claims

the structure of the environmentally friendly knitted fabric provided by the present invention; figure 2 Flow chart of the yarn wrapping machine for environmentally friendly knitted fabrics and storage devices; image 3 Is the parameter map of the yarn covering machine
Login to view more

Application Information

Patent Timeline
no application Login to view more
Patent Type & Authority Applications(China)
IPC IPC(8): G06F9/44
Inventor 吴成林
Owner TCL CORPORATION
Who we serve
  • R&D Engineer
  • R&D Manager
  • IP Professional
Why Eureka
  • Industry Leading Data Capabilities
  • Powerful AI technology
  • Patent DNA Extraction
Social media
Try Eureka
PatSnap group products