TW201411378A - 資料庫交互系統及方法 - Google Patents

Abstract

一種資料庫交互系統及方法，該系統用於：在用戶端創建一個腳本文檔及一個資料獲取方法；在用戶端創建一個網頁文檔，在該網頁文檔中添加一個庫文檔及該腳本文檔；利用該資料獲取方法將資料獲取參數傳遞給伺服器，並獲取從伺服器的資料庫中查詢得到的資料；將獲取的資料傳遞給該網頁文檔中一個資料容器中；利用所述庫文檔將該獲取的資料從該網頁文檔的資料容器導入一個指定圖形文檔；在該指定圖形文檔中創建繪製指定圖形的元素及接收該獲取的資料的元素，並根據該創建的元素繪製出該指定圖形。利用本發明可以在用戶端動態生成SVG圖形。

Description

資料庫交互系統及方法

本發明涉及一種資料庫管理系統及方法，尤其涉及一種資料庫交互系統及方法。

SVG（Scalable Vector Graphics，可縮放向量圖）是一種與圖像解析度無關的向量圖形格式，採用XML（Extensible Markup Language，可擴展標記語言）文本描述物件，完全開源，具有很好的交互性與動態性，並且完全支援DOM（Document Object Model，文檔物件模型）。

但是，SVG只能將資料嵌入到文檔中靜態的顯示，隨著SVG被各大主流媒體廣泛支援以及在無線電設備應用中的日益擴張，怎樣實現SVG與資料庫進行交互成為了亟待解決的問題。

鑒於以上內容，有必要提供一種資料庫交互系統及方法，應用於用戶端，其可從伺服器端的資料庫中獲取繪製SVG圖形的資料，根據獲取的資料在用戶端繪製出SVG圖形，實現SVG與資料庫的交互。

鑒於以上內容，還有必要提供一種資料庫交互系統及方法，應用於伺服器，其可接收用戶端傳送的資料獲取參數，根據該資料獲取參數從資料庫中查詢相關資料，並將查詢得到的資料返回給用戶端，用戶端根據伺服器查詢得到的資料制出SVG圖形，實現SVG與資料庫的交互。

一種資料庫交互系統，應用於用戶端，該系統包括：第一創建模組，用於在用戶端創建一個腳本文檔，並在該腳本文檔中創建一個資料獲取方法；第二創建模組，用於在用戶端創建一個網頁文檔，在該網頁文檔中添加一個庫文檔及該腳本文檔，然後調用該腳本文檔中的資料獲取方法；資料獲取模組，用於利用該資料獲取方法將資料獲取參數傳遞給伺服器中的資料庫查詢方法，並獲取該資料庫查詢方法從伺服器的資料庫中查詢得到的資料；資料處理模組，用於將資料獲取模組獲取的資料傳遞給該網頁文檔中一個資料容器中；所述資料處理模組，還用於創建一個指定圖形文檔，將該指定圖形文檔嵌入該網頁文檔，並利用所述庫文檔將該獲取的資料從該網頁文檔的資料容器導入該指定圖形文檔；圖形顯示模組，用於在該指定圖形文檔中創建繪製指定圖形的元素及接收該獲取的資料的元素，並根據該創建的元素繪製出該指定圖形。

一種資料庫交互系統，應用於伺服器，該系統包括：第三創建模組，用於在伺服器中創建一個服務程式，並在該服務程式中創建一個資料庫查詢方法；資料查詢模組，用於當該資料庫查詢方法接收到用戶端傳送的資料獲取參數後，調用該資料庫查詢方法，獲取從資料庫中查詢得到的資料；資料返回模組，用於將查詢得到的資料返回給用戶端，以便用戶端根據該查詢得到的資料繪制出一個指定圖形。

一種資料庫交互方法，應用於用戶端，該方法包括：第一創建步驟，在用戶端創建一個腳本文檔，並在該腳本文檔中創建一個資料獲取方法；第二創建步驟，在用戶端創建一個網頁文檔，在該網頁文檔中添加一個庫文檔及該腳本文檔，然後調用該腳本文檔中的資料獲取方法；資料獲取步驟，利用該資料獲取方法將資料獲取參數傳遞給伺服器中的資料庫查詢方法，並獲取該資料庫查詢方法從伺服器的資料庫中查詢得到的資料；資料處理步驟一，將資料獲取步驟獲取的資料傳遞給該網頁文檔中一個資料容器中；資料處理步驟二，創建一個指定圖形文檔，將該指定圖形文檔嵌入該網頁文檔，並利用所述庫文檔將該獲取的資料從該網頁文檔的資料容器導入該指定圖形文檔；圖形顯示步驟，在該指定圖形文檔中創建繪製指定圖形的元素及接收該獲取的資料的元素，並根據該創建的元素繪製出該指定圖形。

一種資料庫交互方法，應用於伺服器，該方法包括：第三創建步驟，在伺服器中創建一個服務程式，並在該服務程式中創建一個資料庫查詢方法；資料查詢步驟，當該資料庫查詢方法接收到用戶端傳送的資料獲取參數後，調用該資料庫查詢方法，獲取從資料庫中查詢得到的資料；資料返回步驟，用於將查詢得到的資料返回給用戶端，以便用戶端根據該查詢得到的資料繪制出一個指定圖形。

相較於習知技術，所述的資料庫交互系統及方法，其可根據用戶在用戶端輸入的查詢關鍵字，從伺服器端的資料庫中獲取繪製SVG圖形的資料，根據獲取的資料在用戶端繪製出SVG圖形，實現SVG與資料庫的交互，動態生成SVG圖形，即根據用戶輸入的不同查詢關鍵字動態生成不同的SVG圖形。

參閱圖1所示，係本發明用戶端與伺服器的網路架構圖。在本實施方式中，所述伺服器4透過網路3與多個用戶端2相連，並透過資料庫連接與資料庫5連接。所述網路可以是企業內部網路（Intranet），也可以是網際網路（Internet）或其他類型的通訊網路，如GPRS、Wi-Fi/WLAN、3G/WCDMA、3.5G/HSDPA等。所述資料庫連接可以是JDBC（Java Database Connectivity，Java資料庫連接）或ODBC（Open Database Connectivity，開放資料庫連接）等。

在本實施方式中，所述資料庫交互系統包括安裝於每個用戶端2的資料庫交互系統用戶端24與安裝於伺服器4中的資料庫交互系統服務端44。

參閱圖2所示，係本發明資料庫交互系統用戶端的運行環境示意圖。該資料庫交互系統用戶端24運行於每個用戶端2中。該用戶端2還包括透過資料匯流排相連的第一顯示設備20、第一輸入設備22、第一儲存器23和第一處理器25。

所述第一儲存器23用於儲存所述資料庫交互系統用戶端24的程式碼等資料。所述第一顯示設備20用於顯示SVG圖形等資料。所述第一輸入設備22用於輸入用戶設置的各種資料。

所述資料庫交互系統用戶端24用於從伺服器4的資料庫5中獲取繪製SVG圖形的資料，根據獲取的資料在用戶端2的第一顯示設備20上繪製出一個SVG圖形，實現SVG與資料庫5的交互，具體過程以下描述。

在本實施方式中，所述資料庫交互系統用戶端24可以被分割成一個或多個模組，所述一個或多個模組被儲存在所述第一儲存器23中並被配置成由一個或多個處理器（本實施方式為第一處理器25）執行，以完成本發明。例如，參閱圖4所示，所述資料庫交互系統用戶端24被分割成第一創建模組240、第二創建模組241、資料獲取模組242、資料處理模組243和圖形顯示模組244。本發明所稱的模組是完成一特定功能的程式段，比程式更適合於描述軟體在用戶端2中的執行過程。以下將結合圖6說明各模組240-244的具體功能。

參閱圖3所示，係本發明資料庫交互系統服務端44的運行環境示意圖。該資料庫交互系統服務端44運行於伺服器4中。該伺服器4還包括透過資料匯流排相連的第二顯示設備40、第二輸入設備42、第二儲存器43和第二處理器45。

所述第二儲存器43用於儲存所述資料庫交互系統服務端44的程式碼等資料。所述第二顯示設備40和第二輸入設備42用做伺服器4的輸入輸出設備。

所述資料庫交互系統服務端44用於接收用戶端2傳送的資料獲取參數，根據該資料獲取參數從資料庫5中查詢相關資料，並將查詢得到的資料返回給用戶端2，以便用戶端2根據伺服器查詢得到的資料繪制出一個SVG圖形，實現SVG與資料庫5的交互，具體過程以下描述。

在本實施方式中，所述資料庫交互系統服務端44可以被分割成一個或多個模組，所述一個或多個模組被儲存在所述第二儲存器43中並被配置成由一個或多個處理器（本實施方式為第二處理器45）執行，以完成本發明。例如，參閱圖5所示，所述資料庫交互系統服務端44被分割成第三創建模組440、資料查詢模組441和資料返回模組442。本發明所稱的模組是完成一特定功能的程式段，比程式更適合於描述軟體在伺服器4中的執行過程。以下將結合圖6說明各模組440-442的具體功能。

參閱圖6所示，係本發明資料庫交互方法的較佳實施方式的流程圖。

步驟S10，第三創建模組440在伺服器4中創建一個服務程式，並在該服務程式中創建一個資料庫查詢方法。例如，該服務程式可以是泛型處理常式（格式為.ashx）或Web Service（Web服務）。

步驟S11，第一創建模組240在用戶端2創建一個腳本文檔，並在該腳本文檔中創建一個資料獲取方法。在本實施方式中，該腳本文檔為Jscript文檔。在其他實施方式中，該腳本文檔也可以採用其他格式。

該資料獲取方法包括資料獲取類型、資料獲取參數、資料獲取地址等。其中，資料獲取類型包括post類型或get類型，資料獲取參數包括用戶名和查詢關鍵字等，資料獲取地址為伺服器4的地址（即服務程式的地址）。例如，該資料獲取地址可以是該伺服器4的URL（Universal Resource Locator，統一資源定位器）地址。

步驟S12，第二創建模組241在用戶端2創建一個網頁文檔，在該網頁文檔中先添加一個庫文檔，然後再添加該腳本文檔，並在該網頁文檔的載入事件（onload event）中調用該腳本文檔中的資料獲取方法。在本實施方式中，該網頁文檔為HTML文檔。在其他實施方式中，該網頁文檔也可以採用其他格式。該庫文檔可以是JQuery庫文檔。

步驟S13，資料獲取模組242利用該資料獲取方法將資料獲取參數傳遞給伺服器4中的資料庫查詢方法，並獲取該資料庫查詢方法查詢得到的資料。

具體而言，當伺服器4中的資料庫查詢方法接收到該資料獲取參數後，資料查詢模組441在該伺服器4的服務程式的特定方法（如Process Request方法）中調用該資料庫查詢方法，並獲取該資料庫查詢方法查詢得到的資料。然後，資料返回模組442透過Response.Write()的形式，將查詢得到的資料返回給用戶端2。

步驟S14，資料處理模組243將資料獲取模組242獲取的資料傳遞給該網頁文檔中一個資料容器（Data Container）中，並透過JavaScript對該獲取的資料進行分類。其中，該資料容器可以是該網頁文檔的一個隱藏層（如Div層）。

舉例而言，假設用戶需要瞭解某一個專利申請的審查歷程，用戶可以輸入該專利申請的申請號，資料獲取模組242將該申請號（即查詢關鍵字）傳送給資料查詢模組441。資料查詢模組441將根據該申請號從資料庫5中獲取該專利申請審查歷程的相關資料。例如，參閱圖7所示，資料查詢模組441從資料庫5中獲取四筆資料記錄，每筆記錄包括審查階段、核駁法條和發文日期等，本實施方式以美國專利申請為例進行說明。其中，Rejection(F)代表第一次審查意見通知，Rejection(FF)代表第二次審查意見通知。

資料處理模組243對圖7中的資料按照審查階段、核駁法條和發文日期等進行分類，得到圖8所示的分類後的資料。其中，每一類的資料用一個字串儲存。例如，第一字串“Str1”儲存審查階段的資料，第二字串“Str2”儲存核駁法條的資料，第三字串“Str3”儲存發文日期的資料，具體表示如下：

Str1 = ( Rejection(F), Rejection(F), Rejection(FF), Rejection(FF) );

Str2=(35U.S.C.103(a),35U.S.C.112,35U.S.C.103(a),

35U.S.C.112);

Str3=(2009/7/6, 2009/7/6, 2010/2/2, 2010/2/2)。

步驟S15，資料處理模組243創建一個SVG文檔，將該新建的SVG文檔嵌入該網頁文檔，並利用上述庫文檔（如JQuery庫文檔）將分類後的資料從該網頁文檔的數據容器（如隱藏層Div）中導入該SVG文檔中。在本實施方式中，所述資料處理模組243以Object（物件）、Embed（嵌入）或iFrame（框架）之一的形式將新建的SVG文檔嵌入該網頁文檔中。

步驟S16，圖形顯示模組244利用JavaScript在該SVG文檔中創建繪製SVG圖形的元素（如DOM元素）及接收該分類後的資料的元素，並在該SVG文檔中運用CSS（Cascading Style Sheet，級聯樣式表）樣式，根據該創建的元素繪製出一個SVG圖形，最後將該創建的SVG圖形顯示在第一顯示設備20上。

其中，所述繪製SVG圖形的元素包括用於繪製線的DOM元素（如<line>）、用於繪製矩形的DOM元素（如<rect>）、用於繪製橢圓的DOM元素（如<ellipse>）等。所述接收分類後的資料的元素可以是<text>元素。

舉例而言，假該SVG圖形為該專利申請審查階段的魚骨圖，則根據圖8中分類後的資料創建的一個SVG圖形參閱圖9所示。具體而言，圖形顯示模組244取出上述三個字串中的第一個元素，即(Str1[0], Str2[0], Str3[0])，組成第一個資料(Rejection(F), 35U.S.C.103(a), 2009/7/6)。

取出上述三個字串中的第二個元素，即(Str1[1], Str2[1], Str3[1])，組成第二個資料(Rejection(F), 35U.S.C.112, 2009/7/6)。

取出上述三個字串中的第三個元素，即(Str1[2], Str2[2], Str3[2])，組成第三個資料(Rejection(FF), 35U.S.C.103(a), 2010/2/2)。

取出上述三個字串中的第四個元素，即(Str1[3], Str2[3], Str3[3]，組成第四個資料(Rejection(FF), 35U.S.C.112, 2010/2/2)。

然後，圖形顯示模組244將上述組成的四個資料顯示在繪製的魚骨圖上，得到一個動態生成的SVG圖形。在本實施方式中，所述動態生成是指根據用戶輸入的不同查詢關鍵字動態生成不同的SVG圖形。

需要說明的是，本實施方式是以SVG圖形為例進行說明的，但本發明所述方法並不限於對SVG圖形與資料庫的交換，對其他與SVG圖形有相似屬性的圖形本發明同樣適用。

另外，在步驟S14中，資料處理模組243將資料獲取模組242獲取的資料傳遞給該網頁文檔的資料容器後，也可以不對該獲取的資料進行分類，直接將該獲取的資料從該網頁文檔的資料容器導入該SVG文檔中。然後，圖形顯示模組244利用JavaScript在該SVG文檔中創建繪製SVG圖形的元素及接收該獲取的資料的元素，繪製一個SVG圖形，並將該獲取的資料顯示在該SVG圖形中。

最後應說明的是，以上實施方式僅用以說明本發明的技術方案而非限制，儘管參照較佳實施方式對本發明進行了詳細說明，本領域的普通技術人員應當理解，可以對本發明的技術方案進行修改或等同替換，而不脫離本發明技術方案的精神和範圍。

2．．．用戶端

3．．．網路

4．．．伺服器

5．．．資料庫

20．．．第一顯示設備

22．．．第一輸入設備

23．．．第一儲存器

24．．．資料庫交互系統用戶端

25．．．第一處理器

240．．．第一創建模組

241．．．第二創建模組

242．．．資料獲取模組

243．．．資料處理模組

244．．．圖形顯示模組

40．．．第二顯示設備

42．．．第二輸入設備

43．．．第二儲存器

44．．．資料庫交互系統服務端

45．．．第二處理器

440．．．第三創建模組

441．．．資料查詢模組

442．．．資料返回模組

圖1係本發明用戶端與伺服器的網路架構圖。

圖2係本發明資料庫交互系統用戶端的運行環境示意圖。

圖3係本發明資料庫交互系統服務端的運行環境示意圖。

圖4係資料庫交互系統用戶端的功能模組圖。

圖5係資料庫交互系統服務端的功能模組圖。

圖6係本發明資料庫交互方法的較佳實施方式的流程圖。

圖7係根據用戶輸入的查詢關鍵字查詢得到的資料示意圖。

圖8係對圖7中查詢得到的資料分類後得到的資料示意圖。

圖9係根據圖8中分類後的資料創建的一個SVG圖形示意圖。

2．．．用戶端

20．．．第一顯示設備

22．．．第一輸入設備

23．．．第一儲存器

24．．．資料庫交互系統用戶端

25．．．第一處理器

Claims (14)

1. 一種資料庫交互系統，應用於用戶端，該系統包括：
   第一創建模組，用於在用戶端創建一個腳本文檔，並在該腳本文檔中創建一個資料獲取方法；
   第二創建模組，用於在用戶端創建一個網頁文檔，在該網頁文檔中添加一個庫文檔及該腳本文檔，然後調用該腳本文檔中的資料獲取方法；
   資料獲取模組，用於利用該資料獲取方法將資料獲取參數傳遞給伺服器中的資料庫查詢方法，並獲取該資料庫查詢方法從伺服器的資料庫中查詢得到的資料；
   資料處理模組，用於將資料獲取模組獲取的資料傳遞給該網頁文檔中一個資料容器中；
   所述資料處理模組，還用於創建一個指定圖形文檔，將該指定圖形文檔嵌入該網頁文檔，並利用所述庫文檔將該獲取的資料從該網頁文檔的資料容器導入該指定圖形文檔；及
   圖形顯示模組，用於在該指定圖形文檔中創建繪製指定圖形的元素及接收該獲取的資料的元素，並根據該創建的元素繪製出該指定圖形。
2. 如申請專利範圍第1項所述之資料庫交互系統，其中：
   所述資料處理模組，還用於對該獲取的資料進行分類，並利用所述庫文檔將分類後的資料從該網頁文檔的資料容器中導入該指定圖形文檔；及
   所述圖形顯示模組，還用於在該指定圖形文檔中創建繪製指定圖形的元素及接收該分類後的資料的元素，並根據該創建的元素繪製出該指定圖形。
3. 如申請專利範圍第1項所述之資料庫交互系統，其中，所述指定圖形為可縮放向量圖形。
4. 如申請專利範圍第1項所述之資料庫交互系統，其中，所述第二創建模組調用該腳本文檔中的資料獲取方法包括：
   在該網頁文檔的載入事件中調用該腳本文檔中的資料獲取方法。
5. 如申請專利範圍第1項所述之資料庫交互系統，其中，該資料容器為該網頁文檔的隱藏層。
6. 如申請專利範圍第1項所述之資料庫交互系統，其中，所述圖形顯示模組根據該創建的元素繪製出該指定圖形包括：
   在該指定圖形文檔中運用級聯樣式表CSS樣式，根據該創建的元素繪製出該指定圖形，最後將該指定圖形顯示在用戶端的顯示設備。
7. 一種資料庫交互系統，應用於伺服器，該系統包括：
   第三創建模組，用於在伺服器中創建一個服務程式，並在該服務程式中創建一個資料庫查詢方法；
   資料查詢模組，用於當該資料庫查詢方法接收到用戶端傳送的資料獲取參數後，調用該資料庫查詢方法，獲取從資料庫中查詢得到的資料；及
   資料返回模組，用於將查詢得到的資料返回給用戶端，以便用戶端根據該查詢得到的資料繪制出一個指定圖形。
8. 一種資料庫交互方法，應用於用戶端，該方法包括：
   第一創建步驟，在用戶端創建一個腳本文檔，並在該腳本文檔中創建一個資料獲取方法；
   第二創建步驟，在用戶端創建一個網頁文檔，在該網頁文檔中添加一個庫文檔及該腳本文檔，然後調用該腳本文檔中的資料獲取方法；
   資料獲取步驟，利用該資料獲取方法將資料獲取參數傳遞給伺服器中的資料庫查詢方法，並獲取該資料庫查詢方法從伺服器的資料庫中查詢得到的資料；
   資料處理步驟一，將資料獲取步驟獲取的資料傳遞給該網頁文檔中一個資料容器中；
   資料處理步驟二，創建一個指定圖形文檔，將該指定圖形文檔嵌入該網頁文檔，並利用所述庫文檔將該獲取的資料從該網頁文檔的資料容器導入該指定圖形文檔；及
   圖形顯示步驟，在該指定圖形文檔中創建繪製指定圖形的元素及接收該獲取的資料的元素，並根據該創建的元素繪製出該指定圖形。
9. 如申請專利範圍第8項所述之資料庫交互方法，其中：
   所述資料處理步驟一還包括，對該獲取的資料進行分類；
   所述資料處理步驟二還包括，利用所述庫文檔將分類後的資料從該網頁文檔的資料容器中導入該指定圖形文檔；及
   所述圖形顯示步驟還包括，在該指定圖形文檔中創建繪製指定圖形的元素及接收該分類後的資料的元素，並根據該創建的元素繪製出該指定圖形。
10. 如申請專利範圍第8項所述之資料庫交互方法，其中，所述指定圖形為可縮放向量圖形。
11. 如申請專利範圍第8項所述之資料庫交互方法，其中，所述第二創建步驟包括：
    在該網頁文檔的載入事件中調用該腳本文檔中的資料獲取方法。
12. 如申請專利範圍第8項所述之資料庫交互方法，其中，該資料容器為該網頁文檔的隱藏層。
13. 如申請專利範圍第8項所述之資料庫交互方法，其中，所述圖形顯示步驟包括：
    在該指定圖形文檔中運用級聯樣式表CSS樣式，根據該創建的元素繪製出該指定圖形，最後將該指定圖形顯示在用戶端的顯示設備。
14. 一種資料庫交互方法，應用於伺服器，該方法包括：
    第三創建步驟，在伺服器中創建一個服務程式，並在該服務程式中創建一個資料庫查詢方法；
    資料查詢步驟，當該資料庫查詢方法接收到用戶端傳送的資料獲取參數後，調用該資料庫查詢方法，獲取從資料庫中查詢得到的資料；及
    資料返回步驟，用於將查詢得到的資料返回給用戶端，以便用戶端根據該查詢得到的資料繪制出一個指定圖形。