一種3d柱狀圖的繪制方法及裝置的制造方法
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及圖形處理技術(shù)領(lǐng)域，特別涉及一種3D柱狀圖的繪制方法及裝置。
【背景技術(shù)】
[0002]柱狀圖(Histogram)，也稱條圖(英文:bargraph)、長條圖(英文:barchart)、條狀圖，是一種以長方形的長度為變量的表達(dá)圖形的統(tǒng)計報告圖，由一系列高度不等的縱向條紋表示數(shù)據(jù)分布的情況，用來比較兩個或以上的價值(不同時間或者不同條件)，只有一個變量，通常利用于較小的數(shù)據(jù)集分析。柱狀圖亦可橫向排列，或用多維方式表達(dá)。
[0003]目前，對于柱狀圖的繪制及瀏覽多集中于二維空間，缺少三維立體，使用戶無法直觀地理解圖形所表達(dá)的內(nèi)涵，且對圖形的移動較為固定，無法實現(xiàn)旋轉(zhuǎn)等功能。
【發(fā)明內(nèi)容】
[0004]為了解決現(xiàn)有技術(shù)的問題，本發(fā)明實施例提供了一種3D柱狀圖的繪制方法及裝置。所述技術(shù)方案如下:
[0005]第一方面，提供了一種3D柱狀圖的繪制方法，所述方法包括:
[0006]監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)；
[0007]依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度；
[0008]以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。
[0009]其中，所述監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)具體包括:
[0010]當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)；
[0011]監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。
[0012]可選地，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。
[0013]可選地，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。
[0014]可選地，所述方法支持javascript中直接調(diào)用顯示。
[0015]另一方面，提供了一種3D柱狀圖的繪制裝置，所述裝置包括:
[0016]數(shù)據(jù)獲取模塊，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)；
[0017]位置獲取模塊，用于依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度；
[0018]數(shù)據(jù)計算模塊，用于以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。
[0019]其中，所述數(shù)據(jù)獲取模塊具體包括:
[0020]起始點(diǎn)獲取單元，用于當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)；
[0021]終點(diǎn)獲取單元，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。
[0022]可選地，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。
[0023]可選地，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。
[0024]可選地，所述裝置支持javascript中直接調(diào)用顯示。
[0025]本發(fā)明實施例提供的技術(shù)方案帶來的有益效果是:
[0026]通過鼠標(biāo)拖拽移動使得圖形角度應(yīng)該變化時，則清空圖形區(qū)域，按正確的角度重繪圖形，以實現(xiàn)動畫效果，用戶可以擺脫傳統(tǒng)平面的瀏覽方式，不但圖形造型立體逼真，使用方便，用戶只需要操作鼠標(biāo)，即可任意角度觀察圖形。
【附圖說明】
[0027]為了更清楚地說明本發(fā)明實施例中的技術(shù)方案，下面將對實施例描述中所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本發(fā)明的一些實施例，對于本領(lǐng)域普通技術(shù)人員來講，在不付出創(chuàng)造性勞動的前提下，還可以根據(jù)這些附圖獲得其他的附圖。
[0028]圖1是本發(fā)明實施例提供的3D柱狀圖的繪制方法流程圖；
[0029]圖2是本發(fā)明實施例提供的3D柱狀圖的繪制裝置的結(jié)構(gòu)示意圖。
【具體實施方式】
[0030]為使本發(fā)明的目的、技術(shù)方案和優(yōu)點(diǎn)更加清楚，下面將結(jié)合附圖對本發(fā)明實施方式作進(jìn)一步地詳細(xì)描述。
[0031]圖1是本發(fā)明實施例提供的一種3D柱狀圖的繪制方法的流程圖。參見圖1，所述方法包括:
[0032]101、監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)；
[0033]102、依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度；
[0034]103、以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。
[0035]其中，所述監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)具體包括:
[0036]當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)；
[0037]監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。
[0038]可選地，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。
[0039]可選地，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。
[0040]可選地，所述方法支持javascript中直接調(diào)用顯示。
[0041]調(diào)用時支持以下參數(shù):
[0042]width:圖表區(qū)域?qū)挾龋?br>[0043]height:圖表區(qū)域高度；
[0044]xLabel、y Lab el:x軸、y軸標(biāo)簽，支持參數(shù)格式化顯示，如{year}年；
[0045]legendLabel:圖例標(biāo)簽；
[0046]clickEvent:柱體點(diǎn)擊事件，傳入一個回調(diào)函數(shù)，在柱體點(diǎn)擊時，軟件將回調(diào)此參數(shù)，并傳入被點(diǎn)擊的柱體數(shù)據(jù)；
[0047]datasource:數(shù)據(jù)源；
[0048]columnColors:柱體顏色，傳入一個顏色數(shù)組，按z軸排列依次使用數(shù)組中的顏色渲染柱體；
[0049]tip:鼠標(biāo)滑過柱體時顯示的提示信息，信息內(nèi)容支持html標(biāo)簽格式化，如:
[0050]年份{year}<br/> 數(shù)量{count}。
[0051]本發(fā)明實施例提供的方法，通過鼠標(biāo)拖拽移動使得圖形角度應(yīng)該變化時，則清空圖形區(qū)域，按正確的角度重繪圖形，以實現(xiàn)動畫效果，用戶可以擺脫傳統(tǒng)平面的瀏覽方式，不但圖形造型立體逼真，使用方便，用戶只需要操作鼠標(biāo)，即可任意角度觀察圖形。
[0052]圖2是本發(fā)明實施例提供的一種3D柱狀圖的繪制裝置的結(jié)構(gòu)示意圖。參加圖2，所述裝置包括:
[0053]數(shù)據(jù)獲取模塊21，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)；
[0054]位置獲取模塊22，用于依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度；
[0055]數(shù)據(jù)計算模塊23，用于以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。
[0056]其中，所述數(shù)據(jù)獲取模塊具體包括:
[0057]起始點(diǎn)獲取單元，用于當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)；
[0058]終點(diǎn)獲取單元，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。
[0059]可選地，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。
[0060]可選地，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。
[0061]可選地，所述裝置支持javascript中直接調(diào)用顯示。
[0062]調(diào)用時支持以下參數(shù):
[0063]width:圖表區(qū)域?qū)挾龋?br>[0064]height:圖表區(qū)域高度；
[0065]xLabel、yLabel:x軸、y軸標(biāo)簽，支持參數(shù)格式化顯示，如{year}年；
[0066]legendLabel:圖例標(biāo)簽；
[0067]clickEvent:柱體點(diǎn)擊事件，傳入一個回調(diào)函數(shù)，在柱體點(diǎn)擊時，軟件將回調(diào)此參數(shù)，并傳入被點(diǎn)擊的柱體數(shù)據(jù)；
[0068]datasource:數(shù)據(jù)源；
[0069]columnColors:柱體顏色，傳入一個顏色數(shù)組，按z軸排列依次使用數(shù)組中的顏色渲染柱體；
[0070]tip:鼠標(biāo)滑過柱體時顯示的提示信息，信息內(nèi)容支持html標(biāo)簽格式化，如:
[0071]年份{year}<br/> 數(shù)量{count}。
[0072]本發(fā)明實施例提供的裝置，通過鼠標(biāo)拖拽移動使得圖形角度應(yīng)該變化時，則清空圖形區(qū)域，按正確的角度重繪圖形，以實現(xiàn)動畫效果，用戶可以擺脫傳統(tǒng)平面的瀏覽方式，不但圖形造型立體逼真，使用方便，用戶只需要操作鼠標(biāo)，即可任意角度觀察圖形。
[0073]本領(lǐng)域普通技術(shù)人員可以理解實現(xiàn)上述實施例的全部或部分步驟可以通過硬件來完成，也可以通過程序來指令相關(guān)的硬件完成，所述的程序可以存儲于一種計算機(jī)可讀存儲介質(zhì)中，上述提到的存儲介質(zhì)可以是只讀存儲器，磁盤或光盤等。
[0074]以上所述僅為本發(fā)明的較佳實施例，并不用以限制本發(fā)明，凡在本發(fā)明的精神和原則之內(nèi)，所作的任何修改、等同替換、改進(jìn)等，均應(yīng)包含在本發(fā)明的保護(hù)范圍之內(nèi)。
【主權(quán)項】
1.一種3D柱狀圖的繪制方法，其特征在于，所述方法包括: 監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)； 依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度； 以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。2.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)具體包括: 當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)； 監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。3.根據(jù)權(quán)利要求1或2所述的方法，其特征在于，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。4.根據(jù)權(quán)利要求2所述的方法，其特征在于，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。5.根據(jù)權(quán)利要求1所述的方法，其特征在于，所述方法支持javascript中直接調(diào)用顯不ο6.一種3D柱狀圖的繪制裝置，其特征在于，所述裝置包括: 數(shù)據(jù)獲取模塊，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)； 位置獲取模塊，用于依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度； 數(shù)據(jù)計算模塊，用于以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。7.根據(jù)權(quán)利要求5所述的裝置，其特征在于，所述數(shù)據(jù)獲取模塊具體包括: 起始點(diǎn)獲取單元，用于當(dāng)監(jiān)聽到鼠標(biāo)點(diǎn)擊屏幕時，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)； 終點(diǎn)獲取單元，用于監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)終點(diǎn)坐標(biāo)。8.根據(jù)權(quán)利要求5或6所述的裝置，其特征在于，所述拖拽路徑包括:x、y、z三個軸均支持0-90度范圍內(nèi)的任意拖拽。9.根據(jù)權(quán)利要求5所述的裝置，其特征在于，所述鼠標(biāo)點(diǎn)擊屏幕時還包括:獲取被點(diǎn)擊的圖形數(shù)據(jù)。10.根據(jù)權(quán)利要求5所述的裝置，其特征在于，所述裝置支持javascript中直接調(diào)用顯不ο
【專利摘要】本發(fā)明公開了一種3D柱狀圖的繪制方法及裝置，所述方法包括監(jiān)聽鼠標(biāo)拖拽路徑，獲取鼠標(biāo)起始點(diǎn)坐標(biāo)和鼠標(biāo)終點(diǎn)坐標(biāo)；依據(jù)所述起始點(diǎn)坐標(biāo)與所述終點(diǎn)坐標(biāo)，獲取鼠標(biāo)移動的距離和角度；以所述距離為半徑，計算3D柱狀圖旋轉(zhuǎn)方向和角度。本發(fā)明通過鼠標(biāo)拖拽移動使得圖形角度應(yīng)該變化時，則清空圖形區(qū)域，按正確的角度重繪圖形，以實現(xiàn)動畫效果，用戶可以擺脫傳統(tǒng)平面的瀏覽方式，不但圖形造型立體逼真，使用方便，用戶只需要操作鼠標(biāo)，即可任意角度觀察圖形。
【IPC分類】G06T19/00
【公開號】CN105279796
【申請?zhí)枴緾N201510654101
【發(fā)明人】張寶泉
【申請人】蘇州工業(yè)園區(qū)凌志軟件股份有限公司
【公開日】2016年1月27日
【申請日】2015年10月10日