專利名稱：一種白板同步的方法
技術(shù)領(lǐng)域：
本發(fā)明屬于網(wǎng)絡(luò)技術(shù)領(lǐng)域，尤其涉及一種白板同步的方法。
背景技術(shù)：
隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展，人們的生活也隨之發(fā)生改變，逐漸由傳統(tǒng)的生活方式轉(zhuǎn)變?yōu)樾畔⒒罘绞?。借助于互?lián)網(wǎng)，人們便可以在線看電視、讀書、交朋友、打電話、發(fā)郵件、看新聞，信息化生活已經(jīng)成為我們生活不可缺少的一部分。當(dāng)然，人們必須借助鍵盤、鼠標(biāo)、顯示器、耳麥、攝像頭等硬件設(shè)備才能充分感受到互聯(lián)網(wǎng)的便利與信息化生活的豐富多彩。顯示器是上述硬件中占用空間最大且最重要的設(shè)備，其顯示區(qū)域大小將直接影響人們對(duì)互聯(lián)網(wǎng)的體驗(yàn)，比如，使用低分辨率顯示器閱讀篇幅稍長的一段文字就需要不停地拉動(dòng)滾動(dòng)條，這使原本簡單輕松的閱讀變得非常繁雜。另外，由于顯示器品牌眾多，企業(yè)內(nèi)部普遍存在使用不同分辨率顯示器的情況，這將導(dǎo)致使用同一套系統(tǒng)、進(jìn)行同一個(gè)操作帶來不同的視覺效果。隨著網(wǎng)絡(luò)會(huì)議普及，其中一些很重要的功能如文檔同步演示逐漸受到人們的青睞。在進(jìn)行網(wǎng)絡(luò)會(huì)議時(shí)，主講人在演示文檔上標(biāo)注區(qū)塊內(nèi)容，如果分辨率不同，參會(huì)人員的顯示器將不會(huì)顯示同一區(qū)塊，無法實(shí)現(xiàn)精確定位畫筆痕跡，這些都是現(xiàn)行網(wǎng)絡(luò)視頻會(huì)議、遠(yuǎn)程教育、書籍閱讀等應(yīng)用系統(tǒng)中普遍存在的問題。

發(fā)明內(nèi)容
本發(fā)明提供了一種白板同步的方法，實(shí)現(xiàn)了不同分辨率用戶之間做到白板同步。為達(dá)到上述目的，本發(fā)明的技術(shù)方案為—種網(wǎng)頁上實(shí)現(xiàn)的不同分辨率下圖片居中后白板同步的方法，包括以下步驟1)用戶打開網(wǎng)頁，加載flash，設(shè)置flash縮放模式為不縮放，設(shè)置對(duì)齊方式為左上對(duì)齊；2)flash加載需要演示的圖片，根據(jù)圖片的尺寸和flash的尺寸設(shè)置圖片在白板居中顯示；3)控制端用戶，在白板上畫圖形后，發(fā)送圖形的坐標(biāo)和圖片的坐標(biāo)到所有的客戶端；4)客戶端用戶收到消息后，獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)；5)客戶端根據(jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形。上述技術(shù)方案中，步驟1)包含如下過程la)用戶打開網(wǎng)頁，加載一個(gè)flash，設(shè)置flash的stage. scaleMode為 StageScaleMode. N0_SCALE ；lb)設(shè)置 flash 的 stage, align 屬性為 MageAlign. T0P_LEFT,使舞臺(tái)左上對(duì)齊；
lc) flash連接通訊系統(tǒng)。上述技術(shù)方案中，步驟幻包含如下過程2a)增加一個(gè)容器作為白板，flash加載圖片到白板，并增加圖片的complete事件監(jiān)聽；2b)圖片加載完成后，觸發(fā)complete事件，flash根據(jù)舞臺(tái)的尺寸和圖片的實(shí)際尺寸計(jì)算出圖片居中的坐標(biāo)，舞臺(tái)的尺寸設(shè)置寬度為=StageWidth，設(shè)置高度為 stageHeight,圖片的實(shí)際尺寸設(shè)置寬度為dmageWidth，設(shè)置高度為imageHeight。 居中坐標(biāo)計(jì)算公式為x橫坐標(biāo)px = (stageWidth-imageWidth) /2，y縱坐標(biāo)py = (stageHeight-imageHeight)/2 ；2c)設(shè)置圖片的χ屬性為Math, max (0，px)，設(shè)置圖片的y屬性為Math, max (0，py)， 此處的Math, max可以確保圖片始終在可見區(qū)內(nèi)顯示。上述技術(shù)方案中，步驟幻包含如下過程3a)控制端用戶，在白板上畫出圖形；3b) flash同時(shí)將構(gòu)成圖形的所有坐標(biāo)數(shù)據(jù)和當(dāng)前居中的圖片坐標(biāo)通過通訊系統(tǒng)發(fā)送給所有的客戶端。上述技術(shù)方案中，步驟4)包含如下過程4a)客戶端用戶從通訊系統(tǒng)中收到消息后，解析消息數(shù)據(jù)；4b)獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)，設(shè)置圖形χ、y坐標(biāo)分別為drawX和 drawY,設(shè)置圖片x、y坐標(biāo)分別為imageX和imageY，設(shè)置本地的圖片x、y坐標(biāo)分別為 myImageX 禾口 mylmageYo上述技術(shù)方案中，步驟幻包含如下過程5a)獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)，設(shè)置圖形χ、y坐標(biāo)分別為drawX和 drawY,設(shè)置本地的圖片x、y坐標(biāo)分別為mylmageX和myhageY ；5b)客戶端將消息中的圖形坐標(biāo)換算成本地的坐標(biāo)，換算公式為橫坐標(biāo)IocalX =drawX+mylmageX-imageX,縱坐標(biāo) IocalY = drawY+mylmageY-imageY ；5c)調(diào)用flash方法創(chuàng)建圖形，設(shè)置圖形的χ屬性為localX，設(shè)置圖形的y屬性為 localY。上述技術(shù)方案中，步驟1)中所述通訊系統(tǒng)是指可以從一個(gè)用戶發(fā)送到1個(gè)或多個(gè)用戶的即時(shí)通訊系統(tǒng)。本發(fā)明與現(xiàn)有技術(shù)相比具有以下優(yōu)點(diǎn)(1)可以在不同分辨率下，實(shí)現(xiàn)畫筆所畫的圖形的位置的完全統(tǒng)一，沒有偏差，用戶體驗(yàn)好。(2)同步及時(shí)，平緩，不會(huì)出現(xiàn)停頓的現(xiàn)象。(3)由于在每個(gè)客戶端獨(dú)自計(jì)算圖形的位置，對(duì)于服務(wù)器端的運(yùn)算壓力小。(4)完全基于網(wǎng)頁進(jìn)行實(shí)現(xiàn)，不需要下載任何插件。(5)可以很方便地運(yùn)用于其它互聯(lián)網(wǎng)系統(tǒng)。


此處所說明的附圖用來提供對(duì)本發(fā)明的進(jìn)一步理解，構(gòu)成本申請(qǐng)的一部分，本發(fā)明的示意性實(shí)施例及其說明用于解釋本發(fā)明，并不構(gòu)成對(duì)本發(fā)明的不當(dāng)限定。在附圖中
圖1是本發(fā)明的詳細(xì)流程圖。
具體實(shí)施例方式以下將參考附圖并結(jié)合實(shí)施例來詳細(xì)說明本發(fā)明。需要說明的是，在不沖突的情況下，本申請(qǐng)中的實(shí)施例及實(shí)施例中的特征可以相互組合。一種網(wǎng)頁上實(shí)現(xiàn)的不同分辨率下圖片居中后白板同步的方法，包括以下步驟1)用戶打開網(wǎng)頁，加載flash，設(shè)置flash縮放模式為不縮放，設(shè)置對(duì)齊方式為左上對(duì)齊；2)flash加載需要演示的圖片，根據(jù)圖片的尺寸和flash的尺寸設(shè)置圖片在白板居中顯示；3)控制端用戶，在白板上畫圖形后，發(fā)送圖形的坐標(biāo)和圖片的坐標(biāo)到所有的客戶端；4)客戶端用戶收到消息后，獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)；5)客戶端根據(jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形。下面進(jìn)一步詳細(xì)說明本發(fā)明所述的方法參見說明書附圖，用戶打開網(wǎng)頁，加載flash，設(shè)置flash的scaleMode為N0_ SCALE，設(shè)置 stage, align 為 MageAlign. T0P_LEFT。并給 flash 增加一個(gè)容器，用作白板， 白板加載圖片到其內(nèi)部，圖片加載完畢后，觸發(fā)complete事件，flash程序根據(jù)舞臺(tái)的尺寸和圖片的容器的尺寸計(jì)算出可讓圖片居中的x、y坐標(biāo)值，設(shè)置圖片在容器中的坐標(biāo)位置為 Math, max (0, χ), Math, max (0, y) 0控制端用戶，在白板上畫出圖形，flash同時(shí)將構(gòu)成圖形的所有坐標(biāo)數(shù)據(jù)和當(dāng)前居中的圖片坐標(biāo)發(fā)送給所有的客戶端?？蛻舳烁鶕?jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形。圖1是本發(fā)明的詳細(xì)流程圖，詳細(xì)步驟如下步驟101 用戶打開網(wǎng)頁；步驟102 加載flash，顯示圖片到flash白板上；步驟103 設(shè)置白板為不縮放模式，設(shè)置對(duì)齊方式為左上對(duì)齊；步驟104 根據(jù)圖片的尺寸，設(shè)置圖片在白板中居中顯示；步驟105 控制端用戶，在圖片上畫圖形后，發(fā)送圖形的坐標(biāo)和圖片的坐標(biāo)到所有的客戶端；步驟106 客戶端用戶收到消息后，獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)；步驟107 客戶端根據(jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形；步驟108 結(jié)束。顯然，本領(lǐng)域的技術(shù)人員應(yīng)該明白，上述的本發(fā)明各步驟可以用通用的計(jì)算裝置來實(shí)現(xiàn)，它們可以集中在單個(gè)的計(jì)算裝置上，或者分布在多個(gè)計(jì)算裝置所組成的網(wǎng)絡(luò)上，可選地，它們可以用計(jì)算裝置可執(zhí)行的程序代碼來實(shí)現(xiàn)，從而，可以將它們存儲(chǔ)在存儲(chǔ)裝置中由計(jì)算裝置來執(zhí)行，并且在某些情況下，可以以不同于此處的順序執(zhí)行所示出或描述的步驟，或者將它們分別制作成各個(gè)集成電路模塊，或者將它們中的多個(gè)模塊或步驟制作成單個(gè)集成電路模塊來實(shí)現(xiàn)。這樣，本發(fā)明不限制于任何特定的硬件和軟件結(jié)合。
以上所述僅為本發(fā)明的優(yōu)選實(shí)施例而已，并不用于限制本發(fā)明，對(duì)于本領(lǐng)域的技術(shù)人員來說，本發(fā)明可以有各種更改和變化。凡在本發(fā)明的精神和原則之內(nèi)，所作的任何修改、等同替換、改進(jìn)等，均應(yīng)包含在本發(fā)明的保護(hù)范圍之內(nèi)。
權(quán)利要求
1.一種白板同步的方法，其特征在于，包括以下步驟，1)用戶打開網(wǎng)頁，加載flash，設(shè)置flash縮放模式為不縮放，設(shè)置對(duì)齊方式為左上對(duì)齊；2)flash加載需要演示的圖片，根據(jù)圖片的尺寸和flash的尺寸設(shè)置圖片在白板居中顯不；3)控制端用戶，在白板上畫圖形后，發(fā)送圖形的坐標(biāo)和圖片的坐標(biāo)到所有的客戶端；4)客戶端用戶收到消息后，獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)；5)客戶端根據(jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形。
2.如權(quán)利要求1所述的方法，其特征在于，其中步驟1)包含如下過程la)用戶打開網(wǎng)頁，加載一個(gè)flash，設(shè)置flash的stage. scaleMode為 StageScaleMode. N0_SCALE ；lb)設(shè)置flash的stage, align屬性為MageAlign. T0P_LEFT，使舞臺(tái)左上對(duì)齊； lc) flash連接通訊系統(tǒng)。
3.如權(quán)利要求1所述的方法，其特征在于，其中步驟2)包含如下過程2a)增加一個(gè)容器作為白板，flash加載圖片到白板，并增加圖片的complete事件監(jiān)聽；2b)圖片加載完成后，觸發(fā)complete事件，flash根據(jù)舞臺(tái)的尺寸和圖片的實(shí)際尺寸計(jì)算出圖片居中的坐標(biāo)，舞臺(tái)的尺寸設(shè)置寬度為=StageWidth，設(shè)置高度為 stageHeight,圖片的實(shí)際尺寸設(shè)置寬度為dmageWidth，設(shè)置高度為dmageHeight， 居中坐標(biāo)計(jì)算公式為x橫坐標(biāo)px = (stageWidth-imageWidth) /2，y縱坐標(biāo)py = (stageHeight-imageHeight)/2 ；2c)設(shè)置圖片的χ屬性為Math, max (0，px)，設(shè)置圖片的y屬性為Math, max (0，py)，此處的Math, max可以確保圖片始終在可見區(qū)內(nèi)顯示。
4.如權(quán)利要求1所述的方法，其特征在于，其中步驟3)包含如下過程 3a)控制端用戶，在白板上畫出圖形；3b) flash同時(shí)將構(gòu)成圖形的所有坐標(biāo)數(shù)據(jù)和當(dāng)前居中的圖片坐標(biāo)通過通訊系統(tǒng)發(fā)送給所有的客戶端。
5.如權(quán)利要求1所述的方法，其特征在于，其中步驟4)包含如下過程 4a)客戶端用戶從通訊系統(tǒng)中收到消息后，解析消息數(shù)據(jù)；4b)獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)，設(shè)置圖形χ、y坐標(biāo)分別為drawX和drawY，設(shè)置圖片χ、y坐標(biāo)分別為imageX和imageY，設(shè)置本地的圖片x、y坐標(biāo)分別為mylmageX和 myImageYο
6.如權(quán)利要求1所述的方法，其特征在于，其中步驟5)包含如下過程5a)獲取消息中的圖形坐標(biāo)和圖片坐標(biāo)，設(shè)置圖形χ、y坐標(biāo)分別為drawX和drawY，設(shè)置本地的圖片X、y坐標(biāo)分別為mylmageX和mylmageY ；5b)客戶端將消息中的圖形坐標(biāo)換算成本地的坐標(biāo)，換算公式為橫坐標(biāo)IocalX = drawX+mylmageX-imageX,縱坐標(biāo) IocalY = drawY+mylmageY-imageY ；5c)調(diào)用flash方法創(chuàng)建圖形，設(shè)置圖形的χ屬性為localX，設(shè)置圖形的y屬性為IocalY0
7.如權(quán)利要求1所述的方法，其特征在于控制端的白板圖片居中對(duì)齊后，將圖片的坐標(biāo)、圖形的坐標(biāo)都發(fā)送給客戶端，客戶端在收到這些坐標(biāo)數(shù)據(jù)后，將圖形坐標(biāo)換算成客戶端本地的坐標(biāo)后在白板上顯示出來。
8.一種白板同步的方法，其特征在于控制端用戶的白板圖片居中對(duì)齊后，將圖片、圖形坐標(biāo)發(fā)送給所有客戶端并由所述客戶端結(jié)合本地的圖片坐標(biāo)，計(jì)算出本地的圖形坐標(biāo)， 并根據(jù)新的圖形坐標(biāo)畫出圖形。
9.根據(jù)權(quán)利要求8所述的方法，其特征在于用戶打開網(wǎng)頁，加載flash，設(shè)置所述 flash縮放模式為不縮放，設(shè)置對(duì)齊方式為左上對(duì)齊；所述flash加載需要演示的圖片，根據(jù)圖片的尺寸和所述flash的尺寸設(shè)置圖片在白板居中顯示。
全文摘要
本發(fā)明屬于網(wǎng)絡(luò)技術(shù)領(lǐng)域，尤其涉及一種白板同步的方法，包括以下步驟用戶打開網(wǎng)頁，加載flash，給flash增加一個(gè)容器，用作白板，白板加載圖片到其內(nèi)部，圖片加載完畢后，觸發(fā)complete事件，flash程序?qū)D片居中顯示在白板上?？刂贫擞脩簦诎装迳袭嫵鰣D形后，flash同時(shí)將構(gòu)成圖形的所有坐標(biāo)數(shù)據(jù)和當(dāng)前居中的圖片坐標(biāo)發(fā)送給所有的客戶端?？蛻舳烁鶕?jù)本地的圖片坐標(biāo)、消息中的圖片坐標(biāo)、圖形坐標(biāo)重新計(jì)算出本地的圖形坐標(biāo)，并根據(jù)新的圖形坐標(biāo)畫出圖形。該方法能實(shí)現(xiàn)在任意的分辨率下，所有用戶白板的標(biāo)注都完全同步。
文檔編號(hào)G06F17/30GK102314466SQ20111005993
公開日2012年1月11日 申請(qǐng)日期2011年3月14日 優(yōu)先權(quán)日2010年9月27日
發(fā)明者胡加明 申請(qǐng)人:蘇州闊地網(wǎng)絡(luò)科技有限公司