本發(fā)明屬于自動生成ofd文件領(lǐng)域，特別涉及一種基于canvas動態(tài)排版布局生成ofd文件的方法及系統(tǒng)。

背景技術(shù)：

1、ofd(open?fixed-layout?document)是我們國家自主研發(fā)、自主制定的版式文件標準。當前生成ofd版式文件的方法，大概分為兩種：第一種是使用第三方的文件轉(zhuǎn)換服務(wù)，將其他類型的文件轉(zhuǎn)為ofd版式文件，如數(shù)科、wps均提供文件轉(zhuǎn)換接口，實現(xiàn)word/pdf/excel/圖片等類型的文件轉(zhuǎn)為ofd格式，但容易出現(xiàn)亂碼等問題；第二種是通過一些開源項目后端編碼實現(xiàn)ofd文檔的生成，但是此種方法的缺陷在于文檔最終展示的效果只能依賴于后端服務(wù)的編碼實現(xiàn)，無法做到用戶自定義，最終效果用戶不可控。因此需要一種方案能夠結(jié)合紙張屬性自動生成ofd文件的方式。

技術(shù)實現(xiàn)思路

1、針對上述問題，本發(fā)明采用的技術(shù)方案是：一種基于canvas動態(tài)排版布局生成ofd文件的方法，所述方法包括以下步驟：

2、創(chuàng)建canvas畫布，模擬ofd紙張對象；

3、在所述畫布上輸入內(nèi)容時判斷該內(nèi)容的元素分類，所述元素分類包括參與動態(tài)排版的布局元素和不參與動態(tài)排版的定位元素；

4、基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上；

5、獲取所述畫布中各元素的信息，并匯總形成json格式配置數(shù)據(jù)發(fā)送至后端；

6、后端遍歷并解析所述配置數(shù)據(jù)生成ofd文件。

7、可選地，所述方法還包括以下步驟：

8、指定canvas畫布信息，包括紙張方向、尺寸大小、頁邊距、繪制順序；

9、基于所述畫布信息以及已繪制的內(nèi)容獲取待繪制區(qū)域。

10、可選地，在所述的基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上的步驟中，包括：

11、若待繪制元素為布局元素，則計算待繪制元素的寬w和高h；

12、定義并記錄當前行繪制寬度draww，每繪制一個元素則更新行繪制寬度draww+＝w，并記錄當前行最大高度rowmaxh；

13、獲取可繪制區(qū)域的寬innerw和高innerh，并判斷innerw是否小于draww+w；

14、若是，則進行換行操作，且draww和rowmaxh重新賦值為0；

15、定義并記錄當前頁繪制高度drawh，且每次換行更新當前頁繪制高度drawh+＝rowmaxh，并判斷innerh是否小于drawh；

16、若是，則進行換頁操作，且drawh重新賦值為o；

17、記錄元素相對于畫布的位置信息后再將所述待繪制元素輸入畫布。

18、可選地，在所述的記錄當前行最大高度rowmaxh的步驟中，包括：

19、每繪制一個元素，計算該元素的高度h*lineheight，其中l(wèi)ineheight為行間距；

20、比較h*lineheight和rowmaxh大??；

21、若h*lineheight大于rowmaxh，則將rowmaxh重新賦值為h*lineheight；

22、若h*lineheight小于rowmaxh，則rowmaxh不變。

23、可選地，在所述的基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上的步驟中，還包括：

24、若待繪制元素為定位元素，則獲取用戶所選位置坐標；

25、根據(jù)所選位置坐標以及所述定位元素類型，計算定位元素相對于畫布的位置信息后再將所述定位元素輸入畫布。

26、可選地，所述方法還包括以下步驟：

27、基于畫布控件對應(yīng)的元素性質(zhì)劃分可編輯控件；

28、在用戶點擊畫布內(nèi)元素時，獲取用戶點擊的位置坐標；

29、遍歷json數(shù)據(jù)，根據(jù)各元素的位置信息以及用戶點擊位置確定用戶所選的元素控件；

30、根據(jù)控件類型在控件元素繪制區(qū)域插入形狀相同的懸浮dom元素；

31、根據(jù)用戶對所述dom元素的操作同步調(diào)整對應(yīng)的控件元素。

32、可選地，所述方法還包括以下步驟：

33、將布局元素按類型劃分成獨立的功能模塊，包括封面、封底、目錄、章節(jié)；

34、于所述功能模塊中插入開始標識和結(jié)束標識；

35、在繪制畫布時，當遇到所述開始標識時終止當前頁布局，并創(chuàng)建新的畫布進行繪制。

36、以及，一種基于canvas動態(tài)排版布局生成ofd文件的系統(tǒng)，所述系統(tǒng)包括：

37、創(chuàng)建模塊：用于創(chuàng)建canvas畫布，模擬ofd紙張對象；

38、繪制模塊：用于在所述畫布上輸入內(nèi)容時判斷該內(nèi)容的元素分類，基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上；其中，所述元素分類包括參與動態(tài)排版的布局元素和不參與動態(tài)排版的定位元素；

39、數(shù)據(jù)收集模塊：用于獲取所述畫布中各元素的信息，并匯總形成json格式配置數(shù)據(jù)發(fā)送至后端；

40、ofd生成模塊：用于解析所述配置數(shù)據(jù)生成ofd文件。

41、可選地，所述系統(tǒng)還包括用于編輯元素的dom編輯模塊，在編輯時具體包括以下步驟：

42、在用戶點擊畫布內(nèi)元素時，獲取用戶點擊的位置坐標；

43、遍歷json數(shù)據(jù)，根據(jù)各元素的位置信息以及用戶點擊位置確定用戶所選的元素控件；

44、根據(jù)控件類型在控件元素繪制區(qū)域插入形狀相同的懸浮dom元素；

45、根據(jù)用戶對所述dom元素的操作同步調(diào)整對應(yīng)的控件元素。

46、本發(fā)明由于采用上述技術(shù)方案，使其具有以下有益效果：實現(xiàn)了業(yè)務(wù)模板的快速搭建，同時解決了傳統(tǒng)html頁面無法很好的根據(jù)紙張分割內(nèi)容元素的弊端。此外，還支持canvas畫布中元素?zé)o法交互編輯的技術(shù)問題。

47、本發(fā)明的其它特征和優(yōu)點將在隨后的說明書中闡述，并且，部分地從說明書中變得顯而易見，或者通過實施本發(fā)明而了解。本發(fā)明的目的和其他優(yōu)點可通過在說明書、權(quán)利要求書以及附圖中所指出的結(jié)構(gòu)來實現(xiàn)和獲得。

技術(shù)特征：

1.一種基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，所述方法包括以下步驟：

2.如權(quán)利要求1所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，所述方法還包括以下步驟：

3.如權(quán)利要求1所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，在所述的基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上的步驟中，包括：

4.如權(quán)利要求3所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，在所述的記錄當前行最大高度rowmaxh的步驟中，包括：

5.如權(quán)利要求1所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，在所述的基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上的步驟中，還包括：

6.如權(quán)利要求1所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，所述方法還包括以下步驟：

7.如權(quán)利要求1所述的基于canvas動態(tài)排版布局生成ofd文件的方法，其特征在于，所述方法還包括以下步驟：

8.一種基于canvas動態(tài)排版布局生成ofd文件的系統(tǒng)，其特征在于，所述系統(tǒng)包括：

9.如權(quán)利要求8所述的基于canvas動態(tài)排版布局生成ofd文件的系統(tǒng)，其特征在于，所述系統(tǒng)還包括用于編輯元素的dom編輯模塊，在編輯時具體包括以下步驟：

技術(shù)總結(jié)
本發(fā)明公開了一種基于canvas動態(tài)排版布局生成ofd文件的方法及系統(tǒng)，其中所述方法包括以下步驟：創(chuàng)建canvas畫布，模擬ofd紙張對象；在所述畫布上輸入內(nèi)容時判斷該內(nèi)容的元素分類，所述元素分類包括參與動態(tài)排版的布局元素和不參與動態(tài)排版的定位元素；基于所述元素分類觸發(fā)對應(yīng)操作將內(nèi)容繪制于所述畫布上；獲取所述畫布中各元素的信息，并匯總形成json格式配置數(shù)據(jù)發(fā)送至后端；后端遍歷并解析所述配置數(shù)據(jù)生成ofd文件。本發(fā)明實現(xiàn)了業(yè)務(wù)模板的快速搭建，同時解決了傳統(tǒng)html頁面無法很好的根據(jù)紙張分割內(nèi)容元素的弊端。此外，還支持canvas畫布中元素?zé)o法交互編輯的技術(shù)問題。

技術(shù)研發(fā)人員：趙維,牛坤,李勇,朱陽軍
受保護的技術(shù)使用者：安徽產(chǎn)業(yè)互聯(lián)數(shù)據(jù)智能創(chuàng)新中心有限公司
技術(shù)研發(fā)日：
技術(shù)公布日：2025/1/2