CN104835192A - Three-dimensional web page figure drawing method and apparatus - Google Patents
Three-dimensional web page figure drawing method and apparatus Download PDFInfo
- Publication number
- CN104835192A CN104835192A CN201510204401.3A CN201510204401A CN104835192A CN 104835192 A CN104835192 A CN 104835192A CN 201510204401 A CN201510204401 A CN 201510204401A CN 104835192 A CN104835192 A CN 104835192A
- Authority
- CN
- China
- Prior art keywords
- graphic element
- frame
- dimensional
- depending
- web page
- 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.)
- Pending
Links
Abstract
The invention relates to a three-dimensional web page figure drawing method and apparatus. The method includes the following steps that: attributes, coordinate values and sizes of figure elements are read; whether three-dimensional rendering attribute parameters exist in the attributes of the figure elements are judged; if three-dimensional rendering attribute parameters exist in the attributes of the figure elements, left-vision frame rending positions and right-vision frame rending positions of the figure elements are calculated according to the preset coordinate values and sizes, and the figure elements are rendered at the left-vision frame rending positions and the right-vision frame rending positions respectively, so that a three-dimensional web page figure can be obtained; and if three-dimensional rendering attribute parameters do not exist in the attributes of the figure elements, the figure elements are drawn on a screen according to the preset coordinate values and sizes. With the three-dimensional web page figure drawing method of the invention adopted, three-dimensional drawing can be performed on the figure elements in a web page; not only can three-dimensional drawing be performed on commonly-used figures such as rectangles, but also complex web page figures with three-dimensional elements and two-dimensional elements can be drawn. The three-dimensional web page figure drawing method has a wide application range and can satisfy display requirements of a variety of kinds of terminal equipment.
Description
Technical field
The application relates to a kind of three-dimensional web page pattern drawing method and device.
Background technology
Scaler vector figure (SVG) is a set of Web page graphical content standard that World Wide Web Consortium (W3C) is developed, and can be used for developing two dimension (2D) figure.It is a kind of grammatically similar with XML markup language Web page language.SVG can either be used for describing static vector graphics, also can describe motion graphics, supports real-time rendering and has higher quality.SVG figure can help user to describe the conventional fundamental figures such as circle, ellipse, rectangle, polygon very compactly.
As a kind of easy method describing 2D figure, SVG standard does not propose the method about drawing three-dimensional (3D) pattern figure.For this problem, more existing tentative solutions.Wherein great majority are the modes by projection, by the project objects in three dimensions in 2D plane, simulate the form in its original three dimensions in this way.In this way, the SVG figure on two dimensional surface can represent the three-dimensional bodies such as such as cube approx.Another kind of usual way is based on interpolation method, namely the two-dimentional SVG figure that selection two is identical or different is as foreground graphic and background graphics, insert some auxiliary patterns between, thus realize by some positions or size seamlessly transitting to another position or size, and cover a part for image more rearward with more forward image, the cumulative 3DSVG figure obtaining being similar to successively.
Said method all can only be applicable to the display of monocular 3D SVG figure, and cannot apply over the display.Along with popularizing of binocular solid display, design and Implement and can support that the binocular solid 3D figure of frame is looked in two, left and right simultaneously, and build complicated binocular 3D saleable vector graphics on this basis, to meet the display demand of multiple terminal equipment, the importance of this work highlights day by day.
Summary of the invention
The application provides a kind of three-dimensional web page pattern drawing method and device, can carry out 3 D rendering to the graphic element in webpage.
According to the first aspect of the application, the application provides a kind of three-dimensional web page pattern drawing method, comprising: read the attribute of graphic element and default coordinate figure and size; Judge whether carry three-dimensional rendering property parameters in the attribute of described graphic element, current element figure is plotted as solid figure for representing by described three-dimensional rendering attribute; Be carry three-dimensional rendering property parameters in the attribute of described graphic element if judge, then perform first and draw flow process: graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side according to described default coordinate figure and Size calculation; Play up position and the described right side on a described left side depending on frame to play up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure; Do not carry three-dimensional rendering property parameters if judge in the attribute of described graphic element, then perform second and draw flow process: on screen, draw described graphic element according to described default coordinate figure and size.
According to the second aspect of the application, the application provides a kind of three-dimensional web page graphics rendering device, comprising: reading unit, for reading the attribute of graphic element and default coordinate figure and size; Judging unit, for judge described graphic element attribute in whether carry three-dimensional rendering property parameters, current element figure is plotted as solid figure for representing by described three-dimensional rendering parameter; First drawing unit, comprising: computing unit and rendering unit; Computing unit, for judge described graphic element at described judging unit attribute in be carry three-dimensional rendering property parameters, then according to described default coordinate figure and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side; Rendering unit, plays up position and the described right side for the described left side that calculates at described computing unit depending on frame and plays up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure; Second drawing unit, for judge described graphic element at described judging unit attribute in do not carry three-dimensional rendering property parameters, then on screen, draw described graphic element according to described default coordinate figure and size.
The three-dimensional web page pattern drawing method that the application provides and device, for reading graphic element attribute and coordinate figure and size, judge whether there is three-dimensional rendering property parameters in graphic element attribute, if, then according to the coordinate figure preset and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side, play up position and the right side on a left side depending on frame to play up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure.Do not carry three-dimensional rendering property parameters if judge in the attribute of described graphic element, then on screen, draw described graphic element according to described default coordinate figure and size.By the application's method, 3 D rendering can be carried out to the graphic element in webpage.The more important thing is, not only can carry out 3 D rendering to conventional figures such as rectangles, for also can draw with the element of 3-D effect and these more complicated webpage patterns of element of two-dimensional effects simultaneously, applied widely, meet the display demand of multiple terminal equipment.
Accompanying drawing explanation
Fig. 1 is the method flow diagram of the embodiment of the present invention;
Fig. 2 is the another kind of method flow diagram of the embodiment of the present invention;
Fig. 3 utilizes the present embodiment method that single rectangular element is depicted as the design sketch of solid rectangle;
Fig. 4 utilizes the present embodiment method that multiple graphic element is depicted as the design sketch of solid rectangle;
Fig. 5 is the apparatus structure schematic diagram of inventive embodiments;
Fig. 6 is the another kind of apparatus structure schematic diagram of inventive embodiments.
Embodiment
By reference to the accompanying drawings the present invention is described in further detail below by embodiment.
In the embodiment of the present application, a kind of three-dimensional web page pattern drawing method and device are provided, 3 D rendering is carried out to the graphic element in webpage, meet the display demand of multiple terminal equipment.
Embodiment one:
Please refer to Fig. 1, Fig. 1 is the method flow diagram of the embodiment of the present invention one.As shown in Figure 1, a kind of three-dimensional web page pattern drawing method, can comprise the following steps:
101, the attribute of graphic element and default coordinate figure and size is read.
When certain graphic element is set to band three-dimensional stereo effect by needs, need the attribute revising conventional scalable polar plot (SVG) graphic element such as rectangle, circle, ellipse, fold-line-shaped, polygon.Particularly, be add three-dimensional rendering property parameters in the attribute of graphic element, preferably, can also pre-set for the thickness of graphic element and the degree of depth, particularly, default one-tenth-value thickness 1/10 and default depth value can be added in advance in the property parameters of graphic element.Add three-dimensional rendering property parameters and default one-tenth-value thickness 1/10 and default depth value as shown in table 1.Be understandable that, SVG supports that 2D draws, and when not needing pictorial element to be plotted as band 3-D effect, carries out drawing according to existing method.It is worthy of note, when setting up the figure with three-dimensional stereo effect, some webpage patterns are often comparatively complicated, multiple graphic element is needed to combine the effect that just can obtain designer's imagination, some time need some of them graphic element to be plotted as 3-D effect, other are then plotted as two-dimensional effects, then the superposition of multiple graphic element drafting effect just can be obtained final layout.Citing introduction is carried out to the two dimension of graphic element and the attribute of 3-D effect below:
Such as, represent that an apex coordinate is (10,20), width is 40, and be highly the rectangle of 30, the mode of writing of traditional two-dimensional rectangle is as follows:
<rect x＝“10”y＝”20”width＝“40”height＝“30”>。
In SVG fundamental element, add the attribute supporting that binocular 3D (three-dimensional) solid is played up, in browser after the modification, the rectangle of a binocular 3D can be write in the following manner:
<rect x＝“10”y＝”20”width＝“40”height＝“30”isStereo＝“1”s3dz＝”10”s3dthick＝“5”>。The introduction of newly-increased property parameters (three-dimensional rendering property parameters and default one-tenth-value thickness 1/10 and default depth value) is as shown in table 1.
| Property Name | Attribute value | The implication of attribute |
| isStereo | 1|0 | S3D pattern or 2D pattern |
| s3dz | Round values | The degree of depth of graphic element |
| s3dthick | Round values | The thickness of graphic element |
Table 1
102, judge whether carry three-dimensional rendering property parameters in the attribute of graphic element, then perform step 103-104, if not, then perform step 105.
Current element figure is plotted as solid figure for representing by three-dimensional rendering attribute.Because three peacekeepings two dimension drawing process of graphic element are different, first need to read in the attribute of this graphic element whether carry three-dimensional rendering property parameters, to determine this element to be carried out three-dimensional or two dimension is drawn.Particularly, when needs carry out 3 D rendering, perform first and draw flow process, namely perform the present embodiment step 103-104.When needs carry out two dimension drafting, perform second and draw flow process, namely perform the present embodiment step 105.
103, according to the coordinate figure preset and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side.
Based on the attribute of graphic element of the coordinate figure preset and size and above-mentioned steps 101, calculate each graphic element and look position in frame in left and right, so that follow-up, graphic element is played up.Computation process is with carrying out according to the ultimate principle of similar triangles.
Be understandable that, be that each graphic element coordinate figure of specifying and physical size refer in user observes when writing webpage, the character that this graphic element should have, but in order to this effect can be reached, need to be respectively left eye and right eye and draw a left side and play up position depending on frame and position is played up depending on frame in the right side.Graphic element is different from the value set when writing webpage with size depending on the coordinate on frame at these two, therefore needs first to calculate a left side and plays up position depending on frame and position is played up depending on frame in the right side.Position is played up depending on frame in order to draw a left side, (figure that user observes might not be positioned in the plane at indicator screen place the intersection point of line on indicator screen between calculating left eye and each summit of graphic element just, can be display front or rear), be connected in turn by these intersection points and just constitute a left side and look figure on frame, it is similar that frame drawing process is looked on the right side.
104, play up position and the right side on a left side depending on frame to play up position depending on frame and play up described graphic element respectively.
Play up and obtain a left side and look frame figure depending on frame figure and the right side, because the left side observed can superpose depending on frame figure depending on frame figure and the right side, three-dimensional web page figure can be obtained.
Playing up of newly-increased property value (three-dimensional rendering property parameters and default one-tenth-value thickness 1/10 and default depth value) is page rendering flow process based on browser kernel, this flow process is divided into html text parsings, SVG text resolution, builds in conjunction with the dom tree of CSS attribute, render tree generation, page layout and play up, several step such as drafting.Newly-increased property value is added into corresponding DOM node in SVG text resolution process, is added into corresponding render tree node in render tree generative process.Play up flow process traversal render tree, calculate according to the property value in each node.In order to play up graphic element, need to revise graph rendering module.Particularly, newly-increased attribute is added to DOM node, generates render tree and set property in its node, travel through these steps of render tree.
For the rendering module of graphic element in amendment browser kernel, realize two the playing up respectively depending on frame in left and right, the implementation of this process is: call the buffer zone of once playing up flow process also write correspondence respectively depending on frame for two, after process to be rendered terminates, then be plotted to indicator screen.This step makes left eye and right eye see a frame picture respectively, has certain difference between this two frames picture, and can form the effect of 3D after their superpositions.Based on original flow process of browser kernel, first travel through render tree and complete render process, then call graphics module, after left and right has calculated depending on frame by this step respectively, then unified call graphics module completes drawing.The rendering module of amendment browser kernel, is revised as two, left and right and plays up respectively depending on frame, realize binocular solid 3D effect by the single render mode depending on frame.
105, according to the coordinate figure preset and size graphing element on screen.
When needs carry out two dimension drafting, perform second and draw flow process, according to pre-set dimension, graphic element is drawn according to the original relevant position of the coordinate figure set on screen of graphic element.
The three-dimensional web page pattern drawing method that the application provides, read graphic element attribute and coordinate figure and size, judge whether there is three-dimensional rendering property parameters in graphic element attribute, if, then according to the coordinate figure preset and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side, play up position and the right side on a left side depending on frame to play up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure.Do not carry three-dimensional rendering property parameters if judge in the attribute of described graphic element, then on screen, draw described graphic element according to described default coordinate figure and size.By the application's method, 3 D rendering can be carried out to the graphic element in webpage.The more important thing is, not only can carry out 3 D rendering to conventional figures such as rectangles, for also can draw with the element of 3-D effect and these more complicated webpage patterns of element of two-dimensional effects simultaneously, applied widely, meet the display demand of multiple terminal equipment.
Embodiment two:
Please refer to Fig. 2, Fig. 2 is the method flow diagram of the embodiment of the present invention two.As shown in Figure 2, a kind of three-dimensional web page pattern drawing method, can comprise the following steps:
201, travel through each node in render tree, judge that whether the graphic element comprised in each node is more than one.If so, then step 202 is performed.
If not, then represent that this node only has a graphic element.Judge if follow-up to carry three-dimensional rendering property parameters, be depicted as three-dimensional picture by this single graphic element.As shown in Figure 3, be utilize the present embodiment method that single rectangular element is depicted as the design sketch of solid rectangle.
Page rendering flow process based on browser kernel is divided into html text parsing, SVG text resolution, builds in conjunction with the dom tree of CSS attribute, render tree generates, page layout and play up, several step such as drafting.All graphic elements that each node comprises together are drawn, if pattern primitive have multiple, will be superimposed on together after drafting, form the pattern with different-effect.Play up flow process traversal render tree, carry out drawing modification according to the property value of each graphic element in each node.
Preferably, the present embodiment also comprises step: combined by the multiple graphic elements comprised in individual node, obtains a graphical set and merges name.
Divided into groups by multiple graphic element, each group shows as a complicated pattern.This step for each block graphics plays a name, just can refer to this block graphics by this name after this, and not need again to write code again and draw same block graphics after being divided into groups by figure.In this step, respectively isStereo attribute is arranged to each graphic element, be used to specify each element and whether show in the mode of three-dimensional 3D.Based on the newly-increased attribute of newly-increased SVG graphic element and original graphic element, build complicated telescopic vector graphics, and be integrated into writing and render process of the page.
In order to verify the validity of the method, based on Ubuntu operating system, Webkit and drawing application development framework Qt, construct the browser supporting the display of binocular solid 3D SVG figure.Use the stereoscopic 3 d display based on polarization theory, SVG increases the support situation of attribute newly as shown in Figure 2, and the support situation of the saleable vector graphics of newly-increased SVG graphic element and complexity as shown in Figure 4.
202, whether each graphic element carries three-dimensional rendering property parameters in decision node respectively, if so, then performs step 203a-204 to graphic element, if not, then performs step 205, until all graphic elements complete drafting in node to graphic element.
203a, respectively by each summit line on left eye and graphic element, frame intersection point is looked on several left sides obtaining line crossing with screen, and respectively by each summit line on right eye and graphic element, obtains line several right sides crossing with screen and look frame intersection point.
203b, several left sides to be connected successively depending on frame intersection point, obtain the position that left eye looks frame, several right sides are connected successively depending on frame intersection point, obtain the position that right eye looks frame.
204, play up position on a left side depending on frame respectively and position is played up depending on frame in the right side, the gauge of graphic element is played up preset thickness value, the depth dimensions of graphic element is played up default depth value.
The attribute of graphic element also comprises: the one-tenth-value thickness 1/10 preset and default depth value.
The effect that web page element after playing up has " far away little near large ", namely obtains three-dimensional web page figure.
205, according to the coordinate figure preset and size graphing element on screen.
The implementation process of step 205 is identical with the step 105 in embodiment one, and the present embodiment repeats no more this step.
Embodiment three:
Accordingly, the application also provides a kind of three-dimensional web page graphics rendering device, please refer to Fig. 5, and Fig. 5 is apparatus structure schematic diagram of the invention process.As shown in Figure 5, three-dimensional web page graphics rendering device can comprise:
Reading unit 30, for reading the attribute of graphic element and default coordinate figure and size.
Judging unit 31, for judge described graphic element attribute in whether carry three-dimensional rendering property parameters, current element figure is plotted as solid figure for representing by described three-dimensional rendering parameter.
First drawing unit 32, comprising: computing unit 33 and rendering unit 34.
Computing unit 33, for judge described graphic element at judging unit 31 attribute in be carry three-dimensional rendering property parameters, then according to described default coordinate figure and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side.
Rendering unit 34, plays up position and the described right side for the described left side that calculates at computing unit 33 depending on frame and plays up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure.
Second drawing unit 35, for judge described graphic element at judging unit 31 attribute in do not carry three-dimensional rendering property parameters, then on screen, draw described graphic element according to described default coordinate figure and size.
See also Fig. 6, in an embodiment, computing unit 33 comprises:
Link module 330, for respectively by each summit line on left eye and described graphic element, frame intersection point is looked on several left sides obtaining line crossing with screen, and respectively by each summit line on right eye and described graphic element, obtains line several right sides crossing with screen and look frame intersection point.
Left link block 331, for being connected successively depending on frame intersection point on several left sides described, obtains the position that left eye looks frame.Right link block 332, for being connected successively depending on frame intersection point on several right sides described, obtains the position that right eye looks frame.
In an embodiment, three-dimensional web page graphics rendering device can also comprise:
Second judging unit 36, for traveling through each node in render tree, judges that whether the graphic element comprised in each described node is more than one.
Draw allocation units 37, for when described second judging unit judges result for being, judge in described node, whether each graphic element carries three-dimensional rendering property parameters respectively, if, then with the first drawing unit 32, first is performed to described graphic element and draw flow process, if not, then with the second drawing unit 35, second is performed to described graphic element and draw flow process, until all graphic elements complete drafting in node.
In an embodiment, three-dimensional web page graphics rendering device also comprises: name unit 38, for being combined by the multiple graphic elements comprised in individual node, obtaining a graphical set and merging name.
In an embodiment, the attribute of graphic element also comprises: the one-tenth-value thickness 1/10 preset and default depth value;
Rendering unit 34 specifically for:
Play up position on a described left side depending on frame respectively and a position is played up depending on frame in the described right side, the gauge of described graphic element is played up preset thickness value, the depth dimensions of described graphic element is played up described default depth value.
The three-dimensional web page graphics rendering device that the application provides, for reading graphic element attribute and coordinate figure and size, judge whether there is three-dimensional rendering property parameters in graphic element attribute, if, then according to the coordinate figure preset and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side, play up position and the right side on a left side depending on frame to play up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure.Do not carry three-dimensional rendering property parameters if judge in the attribute of described graphic element, then on screen, draw described graphic element according to described default coordinate figure and size.By the application's method, 3 D rendering can be carried out to the graphic element in webpage.The more important thing is, not only can carry out 3 D rendering to conventional figures such as rectangles, for also can draw with the element of 3-D effect and these more complicated webpage patterns of element of two-dimensional effects simultaneously, applied widely, meet the display demand of multiple terminal equipment.
Above content is in conjunction with concrete embodiment further description made for the present invention, can not assert that specific embodiment of the invention is confined to these explanations.For general technical staff of the technical field of the invention, without departing from the inventive concept of the premise, some simple deduction or replace can also be made.
Claims (10)
1. a three-dimensional web page pattern drawing method, is characterized in that, comprising:
Read the attribute of graphic element and default coordinate figure and size;
Judge whether carry three-dimensional rendering property parameters in the attribute of described graphic element, current element figure is plotted as solid figure for representing by described three-dimensional rendering attribute;
Be carry three-dimensional rendering property parameters in the attribute of described graphic element if judge, then perform first and draw flow process: graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side according to described default coordinate figure and Size calculation; Play up position and the described right side on a described left side depending on frame to play up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure;
Do not carry three-dimensional rendering property parameters if judge in the attribute of described graphic element, then perform second and draw flow process: on screen, draw described graphic element according to described default coordinate figure and size.
2. three-dimensional web page pattern drawing method as claimed in claim 1, is characterized in that, described according to described default coordinate figure and Size calculation graphic element play up position and the right side on a left side depending on frame and play up position depending on frame and comprise:
Respectively by each summit line on left eye and described graphic element, frame intersection point is looked on several left sides obtaining line crossing with screen, and respectively by each summit line on right eye and described graphic element, obtains line several right sides crossing with screen and look frame intersection point;
Several left sides described are connected successively depending on frame intersection point, obtains the position that left eye looks frame;
Several right sides described are connected successively depending on frame intersection point, obtains the position that right eye looks frame.
3. three-dimensional web page pattern drawing method as claimed in claim 1 or 2, it is characterized in that, also comprise: each node in traversal render tree, judges that whether the graphic element comprised in each described node is more than one, if, then judge in described node, whether each graphic element carries three-dimensional rendering property parameters respectively, if so, then first is performed to described graphic element and draw flow process, if not, then second is performed to described graphic element and draw flow process, until all graphic elements complete drafting in node.
4. three-dimensional web page pattern drawing method as claimed in claim 3, is characterized in that, also comprise: combined by the multiple graphic elements comprised in individual node, obtains a graphical set and merges name.
5. three-dimensional web page pattern drawing method as claimed in claim 3, it is characterized in that, the attribute of described graphic element also comprises: the one-tenth-value thickness 1/10 preset and default depth value;
Describedly play up position and the described right side on a described left side depending on frame and play up position depending on frame and described graphic element is played up comprise respectively:
Play up position on a described left side depending on frame respectively and position is played up depending on frame in the described right side, the gauge of described graphic element is played up preset thickness value, the depth dimensions of described graphic element is played up described default depth value.
6. a three-dimensional web page graphics rendering device, is characterized in that, comprising:
Reading unit, for reading the attribute of graphic element and default coordinate figure and size;
Judging unit, for judge described graphic element attribute in whether carry three-dimensional rendering property parameters, current element figure is plotted as solid figure for representing by described three-dimensional rendering parameter;
First drawing unit, comprising: computing unit and rendering unit;
Computing unit, for judge described graphic element at described judging unit attribute in be carry three-dimensional rendering property parameters, then according to described default coordinate figure and Size calculation, graphic element plays up position on a left side depending on frame and position is played up depending on frame in the right side; Rendering unit, plays up position and the described right side for the described left side that calculates at described computing unit depending on frame and plays up position depending on frame and play up described graphic element respectively, obtain three-dimensional web page figure;
Second drawing unit, for judge described graphic element at described judging unit attribute in do not carry three-dimensional rendering property parameters, then on screen, draw described graphic element according to described default coordinate figure and size.
7. three-dimensional web page graphics rendering device as claimed in claim 6, it is characterized in that, described computing unit comprises:
Link module, for respectively by each summit line on left eye and described graphic element, frame intersection point is looked on several left sides obtaining line crossing with screen, and respectively by each summit line on right eye and described graphic element, obtains line several right sides crossing with screen and look frame intersection point;
Left link block, for being connected successively depending on frame intersection point on several left sides described, obtains the position that left eye looks frame;
Right link block, for being connected successively depending on frame intersection point on several right sides described, obtains the position that right eye looks frame.
8. three-dimensional web page graphics rendering device as claimed in claims 6 or 7, is characterized in that, also comprise:
Second judging unit, for traveling through each node in render tree, judges that whether the graphic element comprised in each described node is more than one;
Draw allocation units, for when described second judging unit judges result for being, judge in described node, whether each graphic element carries three-dimensional rendering property parameters respectively, if, then with described first drawing unit, first is performed to described graphic element and draw flow process, if not, then with described second drawing unit, second is performed to described graphic element and draw flow process, until all graphic elements complete drafting in node.
9. three-dimensional web page graphics rendering device as claimed in claim 8, is characterized in that, also comprise: name unit, for being combined by the multiple graphic elements comprised in individual node, obtaining a graphical set and merging name.
10. three-dimensional web page graphics rendering device as claimed in claim 8, it is characterized in that, the attribute of described graphic element also comprises: the one-tenth-value thickness 1/10 preset and default depth value;
Described rendering unit specifically for:
Play up position on a described left side depending on frame respectively and a position is played up depending on frame in the described right side, the gauge of described graphic element is played up preset thickness value, the depth dimensions of described graphic element is played up described default depth value.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510204401.3A CN104835192A (en) | 2015-04-27 | 2015-04-27 | Three-dimensional web page figure drawing method and apparatus |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201510204401.3A CN104835192A (en) | 2015-04-27 | 2015-04-27 | Three-dimensional web page figure drawing method and apparatus |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN104835192A true CN104835192A (en) | 2015-08-12 |
Family
ID=53813056
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201510204401.3A Pending CN104835192A (en) | 2015-04-27 | 2015-04-27 | Three-dimensional web page figure drawing method and apparatus |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN104835192A (en) |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107707965A (en) * | 2016-08-08 | 2018-02-16 | 广州市动景计算机科技有限公司 | The generation method and device of a kind of barrage |
| CN112486378A (en) * | 2019-09-11 | 2021-03-12 | 腾讯科技（深圳）有限公司 | Graph generation method, device, terminal and storage medium |
| CN112749356A (en) * | 2019-10-30 | 2021-05-04 | 北京国双科技有限公司 | Webpage graph display method and device |
Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102063734A (en) * | 2009-11-18 | 2011-05-18 | 新奥特（北京）视频技术有限公司 | Method and device for displaying three-dimensional image |
| TW201123840A (en) * | 2009-12-31 | 2011-07-01 | Kuo-Ching Chiang | Method of transmitting stereo image through remote server |
| CN102831635A (en) * | 2011-06-13 | 2012-12-19 | 华为软件技术有限公司 | Method and terminal for displaying vector graphics |
| US20140215295A1 (en) * | 2013-01-29 | 2014-07-31 | Hon Hai Precision Industry Co., Ltd. | Three-dimensional image displaying system and method |
| CN104424288A (en) * | 2013-08-30 | 2015-03-18 | 腾讯科技（深圳）有限公司 | 3D display method and device of web page |
-
2015
- 2015-04-27 CN CN201510204401.3A patent/CN104835192A/en active Pending
Patent Citations (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102063734A (en) * | 2009-11-18 | 2011-05-18 | 新奥特（北京）视频技术有限公司 | Method and device for displaying three-dimensional image |
| TW201123840A (en) * | 2009-12-31 | 2011-07-01 | Kuo-Ching Chiang | Method of transmitting stereo image through remote server |
| CN102831635A (en) * | 2011-06-13 | 2012-12-19 | 华为软件技术有限公司 | Method and terminal for displaying vector graphics |
| US20140215295A1 (en) * | 2013-01-29 | 2014-07-31 | Hon Hai Precision Industry Co., Ltd. | Three-dimensional image displaying system and method |
| CN104424288A (en) * | 2013-08-30 | 2015-03-18 | 腾讯科技（深圳）有限公司 | 3D display method and device of web page |
Non-Patent Citations (2)
| Title |
|---|
| WENMIN WANG 等: "Stereoscopic 3D Web: From IStereoscopic 3D Web: From Idea to Implementationdea to Implementation", 《2014 INTERNATIONAL CONFERENCE ON ISEEE》 * |
| ZHONGXIN LIU 等: "The design and implementation of stereoscopic 3D scalable vector graphics based on WebKit", 《STEREOSCOPIC DISPLAYS AND APPLICATIONS XXV》 * |
Cited By (3)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN107707965A (en) * | 2016-08-08 | 2018-02-16 | 广州市动景计算机科技有限公司 | The generation method and device of a kind of barrage |
| CN112486378A (en) * | 2019-09-11 | 2021-03-12 | 腾讯科技（深圳）有限公司 | Graph generation method, device, terminal and storage medium |
| CN112749356A (en) * | 2019-10-30 | 2021-05-04 | 北京国双科技有限公司 | Webpage graph display method and device |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN103761397A (en) | Three-dimensional model slice for surface exposure additive forming and projection plane generating method | |
| CN102937968B (en) | A kind of binocular 3D webpage implementation method based on Canvas and system | |
| CN103412874B (en) | Method and system for realizing three-dimensional page | |
| CN102819855B (en) | The generation method of two dimensional image and device | |
| CN106934058B (en) | Vector data reading method and system and vector data visualization method and system | |
| CN104915373A (en) | Three-dimensional webpage design method and device | |
| CN106204704A (en) | The rendering intent of three-dimensional scenic and device in virtual reality | |
| CN104835192A (en) | Three-dimensional web page figure drawing method and apparatus | |
| CN105894551A (en) | Image drawing method and device | |
| CN108230433A (en) | 3D map scatterplot method for exhibiting data and system, information data processing terminal | |
| CN103745448A (en) | Rapid generating method for ultrahigh-resolution composite image in raster 3D displaying | |
| CN106204703A (en) | Three-dimensional scene models rendering intent and device | |
| CN107707965A (en) | The generation method and device of a kind of barrage | |
| TW201246123A (en) | System and method for meshing curved surface | |
| CN109712236A (en) | Three-dimensional visualization implementation method based on SVG map datum | |
| CN106934205A (en) | The methods of exhibiting and device of a kind of data correlation relation | |
| CN103150742A (en) | Method and device for vector graphic dynamic rendering | |
| CN108022309B (en) | Threedimensional model intelligent connecting method | |
| CN115423919B (en) | Image rendering method, device, equipment and storage medium | |
| CN105975259A (en) | Implementation method and device of 3D (Three-dimensional) space user interface | |
| CN111681307B (en) | Implementation method of dynamic three-dimensional coordinate axis applied to three-dimensional software | |
| CN104134201B (en) | The method and apparatus of texture image splicing | |
| CN103839217A (en) | Watermark image realization method | |
| CN105657210A (en) | 3D printing display method, system and electronic device | |
| CN107291725B (en) | Method and device for generating multi-directional tree |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| EXSB | Decision made by sipo to initiate substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20150812 |