CN102314466B - Whiteboard synchronizing method - Google Patents
Whiteboard synchronizing method Download PDFInfo
- Publication number
- CN102314466B CN102314466B CN2011100599368A CN201110059936A CN102314466B CN 102314466 B CN102314466 B CN 102314466B CN 2011100599368 A CN2011100599368 A CN 2011100599368A CN 201110059936 A CN201110059936 A CN 201110059936A CN 102314466 B CN102314466 B CN 102314466B
- Authority
- CN
- China
- Prior art keywords
- picture
- coordinate
- flash
- blank
- whiteboard
- 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
Links
Images
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
The invention belongs to the technical field of networks and particularly relates to a whiteboard synchronizing method, which comprises the following steps of: opening a webpage by a user, loading flash, adding a container for the flash to serve as a whiteboard, loading an image to the interior of the whiteboard by the whiteboard, trigging a complete event after the loading of the image is completed, and centralizing and displaying the image on the whiteboard by a flash program; after a control side user draws a graph on the whiteboard, sending all coordinate data constituting the graph and the coordinates of the currently centralized image to all client sides by the flash at the same time; and renewably calculating the coordinates of the local graphs by the client sides according to the local image coordinates, the image coordinates in a message and the coordinates of the graphs, drawing graphs according to the new coordinates of the graph. According to the method, the labels of all user whiteboards can be completely synchronized under any resolution ratio.
Description
Technical field
The invention belongs to networking technology area, relate in particular to the synchronous method of a kind of blank.
Background technology
Along with the development of Internet technology, people's life also changes thereupon, changes information-based life style into by traditional pattern of life gradually.By means of the internet, people just can onlinely see TV, read, make friends, make a phone call, send out mail, see news, and information-based life has become our the indispensable part of living.Certainly, people must could fully experience the facility and information-based live rich and varied of internet by keyboard, mouse, display, headset, the first-class hardware device of shooting.
Display is take up room in the above-mentioned hardware maximum and most important equipment; The big young pathbreaker in its viewing area directly influences the experience of people to the internet; Such as; Use lower resolution displays to read the long slightly passage of length and just need ceaselessly spur scroll bar, this makes to read simply easily originally and becomes very numerous and diverse.In addition, because the display brand is numerous, the enterprises ubiquity uses the situation of different resolution display, and this will cause using same set of system, carry out same operation brings the different visual effect.
Along with Web conference is popularized, some of them very important function such as the synchronous demonstration of document receive people's favor gradually.When carrying out Web conference; The speaker marks the block content on presentation file; If resolution is different; Personnel participating in the meeting's display will can not show same block, can't realize accurately locating the paintbrush vestige, and these all are ubiquitous problems in the application systems such as the existing network teleconference, long-distance education, books reading.
Summary of the invention
The invention provides the synchronous method of a kind of blank, realized accomplishing between the different resolution user that blank is synchronous.
For achieving the above object, technical scheme of the present invention is:
The synchronous method of picture back placed in the middle blank under the different resolution of realizing on a kind of webpage may further comprise the steps:
1) user opens webpage, loads flash, the flash zoom mode is set is convergent-divergent not, and it is upper left alignment that alignment thereof is set;
2) the flash loading needs the picture of demonstration, according to the size of the size of picture and flash picture is set and shows between two parties at blank;
3) control end user after picture shape on the blank, sends the coordinate of figure and the coordinate of picture and arrives all clients;
4) after the client user receives message, obtain figure coordinate and picture coordinate in the message;
5) client recalculates local figure coordinate according to the picture coordinate of this locality, picture coordinate, figure coordinate in the message, and according to the new figure coordinate figure that draws.
In the technique scheme, step 1) comprises following process:
1a) user opens webpage, loads a flash, and the stage.scaleMode that flash is set is StageScaleMode.NO_SCALE;
The stage.align attribute that 1b) flash is set is StageAlign.TOP_LEFT, makes the upper left alignment of stage;
1c) flash connects communication system.
In the technique scheme, step 2) comprise following process:
2a) increase a container as blank, the flash blank that Loads Image, and increase the complete action listener of picture;
After 2b) picture loads and accomplishes; Trigger the complete incident; Flash calculates picture coordinate placed in the middle according to the size of stage and the physical size of picture, and the size of stage is provided with width and is: stageWidth is provided with highly and is: stageHeight; The physical size of picture is provided with width: imageWidth is provided with highly and is: imageHeight.Coordinate Calculation formula placed in the middle is: x horizontal ordinate px=(stageWidth-imageWidth)/2, y ordinate py=(stageHeight-imageHeight)/2;
The x attribute that 2c) picture is set is that (0, px), the y attribute that picture is set is that (0, py), the Math.max here can guarantee that picture shows all the time to Math.max in the visible range to Math.max.
In the technique scheme, step 3) comprises following process:
3a) control end user, figure draws on blank;
3b) flash all coordinate datas and the current picture coordinate placed in the middle that will constitute figure simultaneously sends to all clients through communication system.
In the technique scheme, step 4) comprises following process:
After 4a) client user receives message from communication system, resolve message data;
4b) obtain figure coordinate and picture coordinate in the message, figure x is set, the y coordinate is respectively drawX and drawY, picture x is set, the y coordinate is respectively imageX and imageY, local picture x, y coordinate are set are respectively myImageX and myImageY.
In the technique scheme, step 5) comprises following process:
5a) obtain figure coordinate and picture coordinate in the message, figure x is set, the y coordinate is respectively drawX and drawY, local picture x, y coordinate are set are respectively myImageX and myImageY;
5b) client is converted into local coordinate with the figure coordinate in the message, and reduction formula is: horizontal ordinate localX=drawX+myImageX-imageX, ordinate localY=drawY+myImageY-imageY;
5c) call the flash method and create figure, the x attribute that figure is set is localX, and the y attribute that figure is set is localY.In the technique scheme, communication system described in the step 1) is meant the instant communicating system that can send to one or more users from a user.
The present invention compared with prior art has the following advantages:
(1) can under different resolution, realize the complete unity of the position of the figure that paintbrush is drawn, not have deviation, user experience is good.
(2) in time synchronously, mild, the phenomenon that can not occur pausing.
(3) owing in the position that each client is calculated figure alone, little for the computing pressure of server end.
(4) realize based on webpage fully, need not download any plug-in unit.
(5) can apply to other internet system easily.
Description of drawings
Accompanying drawing described herein is used to provide further understanding of the present invention, constitutes the application's a part, and illustrative examples of the present invention and explanation thereof are used to explain the present invention, do not constitute improper qualification of the present invention.In the accompanying drawings:
Fig. 1 is a detail flowchart of the present invention.
Embodiment
Below will and combine embodiment to specify the present invention with reference to accompanying drawing.Need to prove that under the situation of not conflicting, embodiment and the characteristic among the embodiment among the application can make up each other.
The synchronous method of picture back placed in the middle blank under the different resolution of realizing on a kind of webpage may further comprise the steps:
1) user opens webpage, loads flash, the flash zoom mode is set is convergent-divergent not, and it is upper left alignment that alignment thereof is set;
2) the flash loading needs the picture of demonstration, according to the size of the size of picture and flash picture is set and shows between two parties at blank;
3) control end user after picture shape on the blank, sends the coordinate of figure and the coordinate of picture and arrives all clients;
4) after the client user receives message, obtain figure coordinate and picture coordinate in the message;
5) client recalculates local figure coordinate according to the picture coordinate of this locality, picture coordinate, figure coordinate in the message, and according to the new figure coordinate figure that draws.
Following further explain method of the present invention:
Referring to Figure of description, the user opens webpage, loads flash, and the scaleMode that flash is set is NO_SCALE, and it is StageAlign.TOP_LEFT that stage.align is set.And increase a container to flash, and as blank, blank its inside that Loads Image; Behind the picture loaded; Trigger the complete incident, the flash program calculates x, the y coordinate figure that can let picture placed in the middle according to the size of the container of the size of stage and picture, and it is Math.max (0 that the coordinate position of picture in container is set; X), Math.max (0, y).The control end user, all coordinate datas and current picture coordinate placed in the middle that the figure that on blank, draws, flash will constitute figure simultaneously send to all clients.Client recalculates local figure coordinate according to the picture coordinate of this locality, picture coordinate, figure coordinate in the message, and according to the new figure coordinate figure that draws.
Fig. 1 is a detail flowchart of the present invention, and detailed step is following:
Step 101: the user opens webpage;
Step 102: load flash, on the flash blank that Shows Picture;
Step 103: blank is set is zoom mode not, it is upper left alignment that alignment thereof is set;
Step 104:, picture is set in blank, shows between two parties according to the size of picture;
Step 105: the control end user, after picture shape on the picture, send the coordinate of figure and the coordinate of picture and arrive all clients;
Step 106: after the client user receives message, obtain figure coordinate and picture coordinate in the message;
Step 107: client recalculates local figure coordinate according to the picture coordinate of this locality, picture coordinate, figure coordinate in the message, and according to the new figure coordinate figure that draws;
Step 108: finish.
Obviously, it is apparent to those skilled in the art that each step of above-mentioned the present invention can realize with the general calculation device; They can concentrate on the single calculation element, perhaps are distributed on the network that a plurality of calculation element forms, alternatively; They can realize with the executable program code of calculation element, thereby, can they be stored in the memory storage and carry out by calculation element; And in some cases; Can carry out step shown or that describe with the order that is different from here, perhaps they are made into each integrated circuit modules respectively, perhaps a plurality of modules in them or step are made into the single integrated circuit module and realize.Like this, the present invention is not restricted to any specific hardware and software combination.
The above is merely the preferred embodiments of the present invention, is not limited to the present invention, and for a person skilled in the art, the present invention can have various changes and variation.All within spirit of the present invention and principle, any modification of being done, be equal to replacement, improvement etc., all should be included within protection scope of the present invention.
Claims (5)
1. the method that blank is synchronous is characterized in that, may further comprise the steps,
1) user opens webpage, loads flash, the flash zoom mode is set is convergent-divergent not, and it is upper left alignment that alignment thereof is set;
2) the flash loading needs the picture of demonstration, according to the size of the size of picture and flash picture is set and shows between two parties at blank;
3) control end user after picture shape on the blank, sends the coordinate of figure and the coordinate of picture and arrives all clients;
4) after the client user receives message; Obtain figure coordinate and picture coordinate in the message; Figure x is set, the y coordinate is respectively drawX and drawY, picture x is set, the y coordinate is respectively imageX and imageY, local picture x, y coordinate are set are respectively myImageX and myImageY;
5) client is converted into local coordinate with the figure coordinate in the message; Reduction formula is: horizontal ordinate localX=drawX+myImageX-imageX; Ordinate localY=drawY+myImageY-imageY; And call the flash method and create figure, the x attribute that figure is set is localX, the y attribute that figure is set is localY.
2. the method for claim 1 is characterized in that, wherein step 1) comprises following process:
1a) user opens webpage, loads a flash, and the stage.scaleMode that flash is set is StageScaleMode.NO_SCALE;
The stage.align attribute that 1b) flash is set is StageAlign.TOP_LEFT, makes the upper left alignment of stage;
1c) flash connects communication system.
3. the method for claim 1 is characterized in that, wherein step 2) comprise following process:
2a) increase a container as blank, the flash blank that Loads Image, and increase the complete action listener of picture;
After 2b) picture loads and accomplishes; Trigger the complete incident; Flash calculates picture coordinate placed in the middle according to the size of stage and the physical size of picture, and the size of stage is provided with width and is: stageWidth is provided with highly and is: stageHeight; The physical size of picture is provided with width: imageWidth; Be provided with highly and be: imageHeight, coordinate Calculation formula placed in the middle is: x horizontal ordinate px=(stageWidth-imageWidth)/2, y ordinate py=(stageHeight-imageHeight)/2;
The x attribute that 2c) picture is set is that (0, px), the y attribute that picture is set is that (0, py), the Math.max here can guarantee that picture shows all the time to Math.max in the visible range to Math.max.
4. the method for claim 1 is characterized in that, wherein step 3) comprises following process:
3a) control end user, figure draws on blank;
3b) flash all coordinate datas and the current picture coordinate placed in the middle that will constitute figure simultaneously sends to all clients through communication system.
5. the method for claim 1; It is characterized in that: behind the blank picture align center of control end; The coordinate of picture, the coordinate of figure are all sent to client; Client shows on blank after figure coordinate being converted into the coordinate of client terminal local after receiving these coordinate datas.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN2011100599368A CN102314466B (en) | 2010-09-27 | 2011-03-14 | Whiteboard synchronizing method |
Applications Claiming Priority (3)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201010293261.9 | 2010-09-27 | ||
| CN2010102932619A CN101963980A (en) | 2010-09-27 | 2010-09-27 | Method for realizing whiteboard synchronization after picture centering under different resolutions on webpage |
| CN2011100599368A CN102314466B (en) | 2010-09-27 | 2011-03-14 | Whiteboard synchronizing method |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN102314466A CN102314466A (en) | 2012-01-11 |
| CN102314466B true CN102314466B (en) | 2012-11-21 |
Family
ID=43516853
Family Applications (2)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN2010102932619A Pending CN101963980A (en) | 2010-09-27 | 2010-09-27 | Method for realizing whiteboard synchronization after picture centering under different resolutions on webpage |
| CN2011100599368A Active CN102314466B (en) | 2010-09-27 | 2011-03-14 | Whiteboard synchronizing method |
Family Applications Before (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN2010102932619A Pending CN101963980A (en) | 2010-09-27 | 2010-09-27 | Method for realizing whiteboard synchronization after picture centering under different resolutions on webpage |
Country Status (1)
| Country | Link |
|---|---|
| CN (2) | CN101963980A (en) |
Families Citing this family (7)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102130972A (en) * | 2011-04-27 | 2011-07-20 | 苏州阔地网络科技有限公司 | Method and system for synchronizing white board after picture centralization under different resolution ratios |
| CN102170443A (en) * | 2011-04-27 | 2011-08-31 | 苏州阔地网络科技有限公司 | Method and system for synchronizing white boards under different resolution ratios after centering picture |
| CN102185850A (en) * | 2011-04-28 | 2011-09-14 | 苏州阔地网络科技有限公司 | Method and system for synchronizing whiteboard after picture centering under different resolutions |
| US9535646B2 (en) * | 2013-06-18 | 2017-01-03 | Microsoft Technology Licensing, Llc | Methods and systems for electronic ink projection |
| CN105589696B (en) * | 2015-12-22 | 2019-06-04 | 武汉斗鱼网络科技有限公司 | A kind of exchange method and interactive device of clog-free full frame viewing video image |
| CN110505529A (en) * | 2019-08-16 | 2019-11-26 | 上海掌学教育科技有限公司 | Courseware synchronous display method, device, background server, medium and system |
| CN112399213B (en) * | 2019-08-18 | 2022-11-22 | 海信视像科技股份有限公司 | Display device and remote controller key multiplexing method |
Family Cites Families (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1658567A (en) * | 2005-02-21 | 2005-08-24 | 华东师范大学 | Cooperative plotting method based on internet |
| CN1842005B (en) * | 2005-03-28 | 2010-07-14 | 腾讯科技（深圳）有限公司 | Method for realizing picture and words message show |
| CN101630501B (en) * | 2008-07-14 | 2011-11-16 | 比亚迪股份有限公司 | Method and system for displaying image |
| CN101729850A (en) * | 2008-10-13 | 2010-06-09 | 刘盛举 | Video communication method based on handwriting characteristic data flow and processing system thereof |
| CN101477697A (en) * | 2009-01-21 | 2009-07-08 | 施昊 | Network information inputting editor, network information inputting editing system and method |
-
2010
- 2010-09-27 CN CN2010102932619A patent/CN101963980A/en active Pending
-
2011
- 2011-03-14 CN CN2011100599368A patent/CN102314466B/en active Active
Also Published As
| Publication number | Publication date |
|---|---|
| CN101963980A (en) | 2011-02-02 |
| CN102314466A (en) | 2012-01-11 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN102314466B (en) | Whiteboard synchronizing method | |
| CN106803921A (en) | Instant audio/video communication means and device based on AR technologies | |
| CN103632578A (en) | Informationalized interactive electronic classroom system | |
| CN110727361A (en) | Information interaction method, interaction system and application | |
| CN107135387A (en) | Online Customer Reception method and its system based on VR technologies | |
| US7509389B1 (en) | System for providing transparent participation of third parties in instant messaging communication | |
| CN103023873A (en) | Terminal-spanning real-time interactive online distributing method of lantern slide | |
| CN103035137A (en) | Digital classroom | |
| CN104376121A (en) | Picture self-adaptation matching and combined displaying system, method and user terminal | |
| CN115334025B (en) | Decentralized instant messaging method, decentralized instant messaging device, decentralized instant messaging equipment and storage medium | |
| CN107734364B (en) | Projector control method, system and computer readable storage medium | |
| CN112817671A (en) | Image processing method, device, equipment and computer readable storage medium | |
| CN105302651A (en) | Method and apparatus for supplier and user to remotely and synchronously browse commodity | |
| CN104469078A (en) | Interactive projection control method and system | |
| KR20140076469A (en) | System and method for advertisiing using background image | |
| CN112783905A (en) | Data updating method, system and storage medium based on electronic whiteboard shared screen | |
| CN102130972A (en) | Method and system for synchronizing white board after picture centralization under different resolution ratios | |
| CN103294193A (en) | Multi-terminal interaction method, device and system | |
| CN102314471A (en) | Method for synchronizing scroll bars | |
| CN103384293B (en) | The method of split type terminal room applicating cooperation and split type terminal | |
| CN101902465A (en) | Cursor pen-based questioning method for multi-party network interaction | |
| CN102185870B (en) | Method and system for realizing mode switch between instant messaging and network conference | |
| CN106656725B (en) | Intelligent terminal, server and information updating system | |
| CN110708491A (en) | Video conference display method, mobile terminal, and computer-readable storage medium | |
| CN107291834A (en) | A kind of data inputting method based on code-reading, equipment and terminal |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| C14 | Grant of patent or utility model | ||
| GR01 | Patent grant | ||
| C56 | Change in the name or address of the patentee | ||
| CP01 | Change in the name or title of a patent holder |
Address after: 215121 Jiangsu Province, Suzhou City Industrial Park No. 666 Feng Ting Avenue Weiting Intelligent Industrial Park Building 8 Patentee after: Kuo Di education and science company limited Address before: 215121 Jiangsu Province, Suzhou City Industrial Park No. 666 Feng Ting Avenue Weiting Intelligent Industrial Park Building 8 Patentee before: Suzhou Kuodi Network Technology Co., Ltd. |
|
| TR01 | Transfer of patent right |
Effective date of registration: 20201123 Address after: 226100 Guangzhou road Jiangsu city Nantong Province Haimen Economic and Technological Development Zone No. 999 Patentee after: Nantong Construction Engineering Co.,Ltd. Address before: 215121 Jiangsu Province, Suzhou City Industrial Park No. 666 Feng Ting Avenue Weiting Intelligent Industrial Park Building 8 Patentee before: CODYY EDUCATION TECHNOLOGY Co.,Ltd. |
|
| TR01 | Transfer of patent right |