專利名稱：一種高密度數據顯示的方法
技術領域：
本發明涉及一種計算機領域技術，具體地說是一種高密度數據顯示的方法。
背景技術：
在實際的軟件開發過程中，經常會碰到如下場景用戶需要顯示的數據量較大，每個頁面要求包含數據超過千條甚至萬條，而且顯示的數據實體、數據類型可能是有差異的。 針對這種情況業界處理的方法多為頁面生成控件，控件內填充數據。這樣便產生問題，頁面響應時間較短時頁面包含的數據量比較少，當數據包含量增加時頁面響應時間較長。
發明內容
本發明的技術任務是提供一種基于像素繪圖的方法，以高密度數據顯示的方式解決數據量大時頁面呈現難的問題的一種高密度數據顯示的方法。本發明的技術任務是按以下方式實現的，利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，產生對比數據信息，在一個瀏覽器頁面內的繪制出海量數據效果，從而達到高密度數據顯示效果；集群內包含機柜、節點，監控數據信息龐大而繁瑣；集群監控視圖的網絡流量和CPU監控的監控項內容的高密度數據顯示方法為在普通瀏覽器頁面監控整個集群運行狀態，實現方式為每個節點為一個小數據塊，每塊占120*50 像素；數據塊顯示的內容為當前節點在半個小時內CPU和網絡流量的數據，數據由左向右依次表示時間的變化；在單個節點的120*50像素區域內能顯示0 540條數據；CPU監控塊中一個時刻用一個像素繪圖表示，其中CPU包括內核利用率、用戶利用率、等待IO利用率、 空閑利用率；一條豎線用不同的顏色標示出對應的利用率；網絡流量則用折線標示變化趨勢。利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，所用到的代碼說明
*繪制線段算法畫線粗細=(小塊長度/當前小塊內數據條數)上取整 *繪制線段算法畫線起點橫坐標=(線段與線段間隔*條數序號)下取整 *繪制線段算法線段與線段間隔=小塊長度/當前小塊內數據條數(浮點型) *繪制線段算法當線段粗細大于一時畫線是以給定坐標為中心畫線，而不是由左向右的寬度畫線
*繪制線段算法當線段粗細大于一時起始點橫坐標應該向右側移動，具體變為線段的粗細值除以2
氺
//設置繪線的粗細int graphicLineWidth = (int) Math, ceil ((double) sigleBloadLength / (double) smalIDataBlockLength)；
float graphicLinetoLineWidth = (float) sigleBloadLength / smalIDataBlockLength；
int xMove = (graphicLineWidth == 1) ？ 0: graphicLineWidth / 2；
g2.setStroke (new BasicStroke (graphicLineWidth))；
*畫線單小塊數據先遍歷同一參數(同一顏色)
for (int ρ=0; ρ < 4; ρ++) {
Il設定畫筆的顏色
g2.setPaint ((Color) colorList. get(ρ))；
Λ
*畫第一組同顏色的線第一組線的起點相對縱向坐標值為ο V
if (P == 0) {
for (int qq = O； qq < smalIDataBlockLength； qq++) { nodeRatioList = nodeTimeList
.get (beforeDataSum + qq)； int line—X = (int) (numlndex
氺 sigleBloadLength + (int) Math .floor(qq
氺 graphicLinetoLineWidth)) + dataX + xMove； g2. drawLine (line—X，dataY，line—X， nodeRatioList· get (p + 1) + dataY)；
// System, out. print ("X 坐標“+line—X)；
}
} else {
for (int qq = O; qq < smalIDataBlockLength； qq++) { nodeRatioList = nodeTimeList
.get (beforeDataSum + qq)； int line—X = (int) (numlndex
氺 sigleBloadLength + (int) Math .floor(qq
氺 graphicLinetoLineWidth)) + dataX + xMove； g2. drawLine(line—X，nodeRatioList.get (ρ)
+ dataY, line_X, nodeRatioList. get(ρ + 1) + dataY)；
}
}利用繪圖形式解決了頁面生成大量數據控件時間過長的問題，同時能夠通過最小繪圖單位一-單像素來表示數據信息。普通頁面顯示數據信息時是通過控件形式加載，這樣對客戶端服務器的資源利用要求較高，而且展示海量信息基本是不能實現的。該發明根據顯示數據的實體與屬性，對比數據的圖形繪制置于相對集中的區域。通過繪制出的圖像變化可以清晰的看出顯示數據信息的走勢，從而達到海量數據高密度展示的目的。本發明的一種高密度數據顯示的方法具有以下優點
1、滿足普通頁面海量數據展示的效果；
2、同時能夠根據不同實體變更數據顯示方式，頁面相應速度快。
具體實施例方式參照具體實施例對本發明的一種高密度數據顯示的方法作以下詳細地說明。實施例
本發明的一種高密度數據顯示的方法，利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，產生對比數據信息，在一個瀏覽器頁面內的繪制出海量數據效果，從而達到高密度數據顯示效果；集群內包含機柜、節點，監控數據信息龐大而繁瑣；集群監控視圖的網絡流量和CPU監控的監控項內容的高密度數據顯示方法為在普通瀏覽器頁面監控整個集群運行狀態，實現方式為每個節點為一個小數據塊，每塊占120*50像素； 數據塊顯示的內容為當前節點在半個小時內CPU和網絡流量的數據，數據由左向右依次表示時間的變化；在單個節點的120*50像素區域內能顯示0 540條數據；CPU監控塊中一個時刻用一個像素繪圖表示，其中CPU包括內核利用率、用戶利用率、等待IO利用率、空閑利用率；一條豎線用不同的顏色標示出對應的利用率；網絡流量則用折線標示變化趨勢。利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，所用到的代碼說明
*繪制線段算法畫線粗細=(小塊長度/當前小塊內數據條數)上取整 *繪制線段算法畫線起點橫坐標=(線段與線段間隔*條數序號)下取整 *繪制線段算法線段與線段間隔=小塊長度/當前小塊內數據條數(浮點型) *繪制線段算法當線段粗細大于一時畫線是以給定坐標為中心畫線，而不是由左向右的寬度畫線
*繪制線段算法當線段粗細大于一時起始點橫坐標應該向右側移動，具體變為線段的粗細值除以2
氺//設置繪線的粗細
int graphicLineWidth = (int) Math, ceil ((double) sigleBloadLength
/ (double) smalIDataBlockLength)； float graphicLinetoLineWidth = (float) sigleBloadLength
/ smalIDataBlockLength； int xMove = (graphicLineWidth == 1) ？ 0: graphicLineWidth / 2； g2.setStroke (new BasicStroke (graphicLineWidth))；
*畫線單小塊數據先遍歷同一參數(同一顏色)
for (int ρ=0; ρ < 4; ρ++) {
Il設定畫筆的顏色
g2.setPaint ((Color) colorList. get(ρ))；
Λ
*畫第一組同顏色的線第一組線的起點相對縱向坐標值為ο V
if (P == 0) {
for (int qq = O； qq < smalIDataBlockLength； qq++) { nodeRatioList = nodeTimeList
.get (beforeDataSum + qq)； int line—X = (int) (numlndex
氺 sigleBloadLength + (int) Math .floor(qq
氺 graphicLinetoLineWidth)) + dataX + xMove； g2. drawLine (line—X，dataY，line—X， nodeRatioList· get (p + 1) + dataY)；
// System, out. print ("X 坐標“+line—X)；
}
} else {
for (int qq = O; qq < smalIDataBlockLength； qq++) { nodeRatioList = nodeTimeList
.get (beforeDataSum + qq)； int line—X = (int) (numlndex
氺 sigleBloadLength + (int) Math .floor(qq
氺 graphicLinetoLineWidth))+ dataX + xMove； g2. drawLine(line_X, nodeRatioList .get (p)
+ dataY, line_X, nodeRatioList. get(p + 1) + dataY)；
}
}本發明的一種高密度數據顯示的方法，特性在一個有限頁面內的繪制出海量數據效果，同時根據不同實體，可以繪制不同樣式的數據信息。說明書內名詞解釋像素圖像的最小的完整采樣。集群將很多服務器集中起來一起進行同一種服務。本發明除說明書所述的技術特征外，均為本專業技術人員的已知技術。
權利要求
1.一種高密度數據顯示的方法，其特征在于利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，產生對比數據信息，在一個瀏覽器頁面內的繪制出海量數據效果，從而達到高密度數據顯示效果；集群監控視圖的網絡流量和CPU監控的監控項內容的高密度數據顯示方法為在普通瀏覽器頁面監控整個集群運行狀態，實現方式為每個節點為一個小數據塊，每塊占120*50像素；數據塊顯示的內容為當前節點在半個小時內 CPU和網絡流量的數據，數據由左向右依次表示時間的變化；在單個節點的120*50像素區域內能顯示0 540條數據；CPU監控塊中一個時刻用一個像素繪圖表示，其中CPU包括內核利用率、用戶利用率、等待IO利用率、空閑利用率；一條豎線用不同的顏色標示出對應的利用率；網絡流量則用折線標示變化趨勢。
2.根據權利要求1所述的一種高密度數據顯示的方法，其特征在于利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，所用到的代碼說明*繪制線段算法畫線粗細=(小塊長度/當前小塊內數據條數)上取整*繪制線段算法畫線起點橫坐標=(線段與線段間隔*條數序號)下取整*繪制線段算法線段與線段間隔=小塊長度/當前小塊內數據條數(浮點型)*繪制線段算法當線段粗細大于一時畫線是以給定坐標為中心畫線，而不是由左向右的寬度畫線*繪制線段算法當線段粗細大于一時起始點橫坐標應該向右側移動，具體變為線段的粗細值除以2氺//設置繪線的粗細int graphicLineWidth = (int) Math, ceil ((double) sigleBloadLength/ (double) smalIDataBlockLength)； float graphicLinetoLineWidth = (float) sigleBloadLength/ smalIDataBlockLength； int xMove = (graphicLineWidth == 1) ？ 0: graphicLineWidth / 2； g2.setStroke (new BasicStroke (graphicLineWidth))；*畫線單小塊數據先遍歷同一參數(同一顏色)for (int ρ=0; ρ < 4; ρ++) {Il設定畫筆的顏色g2.setPaint ((Color) colorList. get(ρ))； *畫第一組同顏色的線第一組線的起點相對縱向坐標值為Oif (P == 0) {for (int qq = O； qq < smalIDataBlockLength； qq++) {nodeRatioList = nodeTimeList.get (beforeDataSum + qq)； int line—X = (int) (numlndex氺 sigleBloadLength + (int) Math .floor(qq氺 graphicLinetoLineWidth)) + dataX + xMove； g2. drawLine (line—X，dataY，line—X， nodeRatioList· get (p + 1) + dataY)；// System, out. print ("X 坐標“+line—X)；}} else {for (int qq = 0; qq < smalIDataBlockLength； qq++) { nodeRatioList = nodeTimeList.get(beforeDataSum + qq)； int line—X = (int) (numlndex氺 sigleBloadLength + (int) Math .floor(qq氺 graphicLinetoLineWidth)) + dataX + xMove； g2.drawLine(line—X， nodeRatioList .get (p)+ dataY, line—X， nodeRatioList· get (p + 1) + dataY)；}}}o
全文摘要
本發明公開了一種高密度數據顯示的方法，屬于計算機領域技術，本發明利用單位像素寬度的畫筆使用不同顏色繪制出代表不同數據的方法畫圖，產生對比數據信息，在一個瀏覽器頁面內的繪制出海量數據效果，從而達到高密度數據顯示效果。本發明的一種高密度數據顯示的方法和現有技術相比，滿足普通頁面海量數據展示的效果；同時能夠根據不同實體變更數據顯示方式，頁面相應速度快。
文檔編號G06F9/44GK102520939SQ201110390799
公開日2012年6月27日 申請日期2011年11月29日 優先權日2011年11月29日
發明者趙文文 申請人:浪潮電子信息產業股份有限公司