一種基于flex多層次布局的方法
【專利摘要】本發(fā)明公開了一種基于flex多層次布局的方法，該方法通過設(shè)置flex圖表的頂層，創(chuàng)建新的圖層用于顯示flex信息，然后設(shè)置flex頂層和子圖層的關(guān)系，設(shè)置父級圖層和子級圖層的關(guān)系，雙擊進(jìn)入下一圖層或者返回上一圖層，顯示flex圖表信息。通過多層次布局，可以在同一個flex頁面顯示不同的flex圖表信息，通過雙擊不同位置的圖標(biāo)，可以進(jìn)入flex的下一層頁面，也可以返回flex的上一層頁面，無需跳轉(zhuǎn)到新的頁面顯示，方便用戶查看flex圖表信息。
【專利說明】—種基于f I ex多層次布局的方法

【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及互聯(lián)網(wǎng)【技術(shù)領(lǐng)域】，尤其涉及一種基于flex多層次布局的方法。

【背景技術(shù)】
[0002]報表就是用表格、圖表等格式來動態(tài)顯示數(shù)據(jù)，報表的主要特點是數(shù)據(jù)動態(tài)化，格式多樣化，并且實現(xiàn)報表數(shù)據(jù)和報表格式的完全分離，用戶可以只修改數(shù)據(jù)，或者只修改格式。利用報表可以很直觀、明了的查看數(shù)據(jù)信息，常見的報表格式有柱狀圖、餅形圖、曲線圖等。因為報表查看數(shù)據(jù)的直觀性，所以現(xiàn)在很多網(wǎng)站和應(yīng)用系統(tǒng)都有用到報表，但是有些報表是對瀏覽器和操作系統(tǒng)是有要求的，有些報表只能在windows操作系統(tǒng)下運行，無法做到跨平臺運行；有些報表只能在IE瀏覽器運行，并不能很好的兼容其它瀏覽器，而flex圖表卻可以跨平臺和跨瀏覽器運行。大部分報表工具在同一層次只能顯示一個報表，或者不能對報表進(jìn)行操作，而flex圖表可以做到這一點，通過flex多層次布局，可以在同一層次顯示多種flex報表，還可以對報表進(jìn)行操作。


【發(fā)明內(nèi)容】

[0003]本發(fā)明的目的是為了克服現(xiàn)有技術(shù)的缺陷，提供一種基于flex多層次布局的方法，包括:
[0004]S1.設(shè)置flex圖表的頂層；
[0005]s2.創(chuàng)建新的圖層用于顯示flex信息；
[0006]s3.設(shè)置flex頂層和子圖層的關(guān)系；
[0007]s4.設(shè)置父級圖層和子級圖層的關(guān)系；
[0008]s5.雙擊進(jìn)入下一圖層或者返回上一圖層；
[0009]s6.顯示flex圖表信息。
[0010]本發(fā)明技術(shù)方案帶來的有益效果:
[0011]本發(fā)明技術(shù)方案通過利用flex的多層次布局解決同一個flex頁面顯示多種類型flex圖表信息的問題。通過雙擊操作，可以進(jìn)入上一圖層或者進(jìn)入子圖層，這樣就可以在同一個flex容器顯示多張flex圖表，在多張flex報表之間進(jìn)行切換，可以很方便的查看圖表數(shù)據(jù)，還可以通過雙擊操作彈出一個查詢列表，顯示圖表的詳細(xì)信息。通過多層次布局將多張flex圖表集合在一起并在同一個功能模塊顯不,而不是一個功能模塊顯不一張flex圖表，加深了用戶體驗。

【專利附圖】

【附圖說明】
[0012]為了更清楚地說明本發(fā)明實施例或現(xiàn)有技術(shù)中的技術(shù)方案，下面將對實施例或現(xiàn)有技術(shù)描述中所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本發(fā)明的一些實施例，對于本領(lǐng)域普通技術(shù)人員來講，在不付出創(chuàng)造性勞動的前提下，還可以根據(jù)這些附圖獲得其它的附圖。
[0013]圖1是本發(fā)明的方法流程圖。

【具體實施方式】
[0014]下面將結(jié)合本發(fā)明實施例中的附圖，對本發(fā)明實施例中的技術(shù)方案進(jìn)行清楚、完整地描述，顯然，所描述的實施例僅僅是本發(fā)明一部分實施例，而不是全部的實施例。基于本發(fā)明中的實施例，本領(lǐng)域普通技術(shù)人員在沒有作出創(chuàng)造性勞動前提下所獲得的所有其他實施例，都屬于本發(fā)明保護的范圍。
[0015]本發(fā)明的主要創(chuàng)新點在于利用flex的SubNetwork層次切換原理對flex進(jìn)行多層次布局。首先，設(shè)置好flex圖表的頂層，給頂層設(shè)置一個ID以及相關(guān)信息，然后在創(chuàng)建一個新的圖層用于顯示子圖層的信息，將子圖層的父級引用指向頂層，這樣雙擊的時候就會根據(jù)圖層的子級進(jìn)入下一圖層，根據(jù)圖層的父級返回上一個圖層，這樣就可以在同一個容器層顯示多個flex圖表信息，還可以在子圖層創(chuàng)建屬于自己的子圖層，將屬于自己的子圖層的父級引用指向自己，這樣就可以在同一個容器層創(chuàng)建多個子圖層，層層進(jìn)行調(diào)用。當(dāng)觸發(fā)“雙擊”事件時，首先會獲取當(dāng)前圖層的信息，判斷當(dāng)前圖層是屬于哪一個圖層，當(dāng)前圖層的父級圖層是什么，當(dāng)前圖層的子圖層是什么，然后根據(jù)父級圖層返回上一圖層，根據(jù)子級圖層進(jìn)入下一個圖層，如果當(dāng)前圖層沒有父級圖層或子級圖層則不進(jìn)行跳轉(zhuǎn)，留在當(dāng)前圖層，還可以指定雙擊圖標(biāo)時彈出一個窗口顯示當(dāng)前圖標(biāo)的信息，當(dāng)雙擊圖層的空白處時就會返回上一圖層頁面。
[0016]如圖1所示為本發(fā)明的方法流程圖，其具體實現(xiàn)步驟如下:
[0017](I)設(shè)置flex圖表的頂層；
[0018](2)創(chuàng)建新的圖層用于顯示flex信息；
[0019](3)設(shè)置flex頂層和子圖層的關(guān)系；
[0020](4)設(shè)置父級圖層和子級圖層的關(guān)系；
[0021](5)雙擊進(jìn)入下一圖層或者返回上一圖層；
[0022](6)顯示flex圖表信息。
[0023]通過本發(fā)明解決了在同一個flex頁面顯示多種類型flex圖表信息的問題，通過多層次布局，可以在同一個flex頁面顯示不同的flex圖表信息，通過雙擊不同位置的圖標(biāo)，可以進(jìn)入flex的下一層頁面，也可以返回flex的上一層頁面，無需跳轉(zhuǎn)到新的頁面顯示，方便用戶查看flex圖表信息。
[0024]此外，本發(fā)明還可以一個容器顯示一個flex圖層，當(dāng)有多個圖層是就要定義多個容器來顯示，不能對圖層進(jìn)行操作，還需要多個模塊來顯示flex圖表，當(dāng)flex圖表過多時要進(jìn)行過多的頁面跳轉(zhuǎn)，不利于用戶查看數(shù)據(jù)，降低用戶體驗。
[0025]以上對本發(fā)明實施例所提供的一種基于flex多層次布局的方法進(jìn)行了詳細(xì)介紹，本文中應(yīng)用了具體個例對本發(fā)明的原理及實施方式進(jìn)行了闡述，以上實施例的說明只是用于幫助理解本發(fā)明的方法及其核心思想；同時，對于本領(lǐng)域的一般技術(shù)人員，依據(jù)本發(fā)明的思想，在【具體實施方式】及應(yīng)用范圍上均會有改變之處，綜上所述，本說明書內(nèi)容不應(yīng)理解為對本發(fā)明的限制。
【權(quán)利要求】
1.一種基于flex多層次布局的方法,其特征在于,包括: s1.設(shè)置flex圖表的頂層； s2.創(chuàng)建新的圖層用于顯示flex信息； S3.設(shè)置flex頂層和子圖層的關(guān)系； s4.設(shè)置父級圖層和子級圖層的關(guān)系； s5.雙擊進(jìn)入下一圖層或者返回上一圖層； s6.顯示flex圖表信息。
2.根據(jù)權(quán)利要求1所述的方法，其特征在于，還能夠給頂層設(shè)置一個ID及相關(guān)信息。
3.根據(jù)權(quán)利要求1所述的方法，其特征在于，創(chuàng)建新的圖層用于顯示子圖層的信息，將子圖層的父級引用指向頂層，這樣雙擊的時候就會根據(jù)圖層的子級進(jìn)入下一圖層，根據(jù)圖層的父級返回上一個圖層，能夠在同一個容器層顯示多個flex圖表信息。
4.根據(jù)權(quán)利要求3所述的方法，其特征在于，還能夠在子圖層創(chuàng)建屬于自己的子圖層，將屬于自己的子圖層的父級引用指向自己，在同一個容器層創(chuàng)建多個子圖層，層層進(jìn)行調(diào)用。
5.根據(jù)權(quán)利要求1或3或4所述的方法，其特征在于，當(dāng)觸發(fā)“雙擊”事件時，首先會獲取當(dāng)前圖層的信息，判斷當(dāng)前圖層是屬于哪一個圖層，當(dāng)前圖層的父級圖層是什么，當(dāng)前圖層的子圖層是什么，然后根據(jù)父級圖層返回上一圖層，根據(jù)子級圖層進(jìn)入下一個圖層；如果當(dāng)前圖層沒有父級圖層或子級圖層則不進(jìn)行跳轉(zhuǎn)，留在當(dāng)前圖層。
6.根據(jù)權(quán)利要求5所述的方法，其特征在于，還能夠指定雙擊圖標(biāo)時彈出一個窗口顯示當(dāng)前圖標(biāo)的信息，當(dāng)雙擊圖層的空白處時就會返回上一圖層頁面。
7.根據(jù)權(quán)利要求1所述的方法，其特征在于，本發(fā)明還能夠一個容器顯示一個flex圖層，當(dāng)有多個圖層是就要定義多個容器來顯示，不能對圖層進(jìn)行操作，還需要多個模塊來顯示flex圖表，當(dāng)flex圖表過多時要進(jìn)行過多的頁面跳轉(zhuǎn)，但不利于用戶查看數(shù)據(jù)，降低用戶體驗。
【文檔編號】G06F9/44GK104281454SQ201410515376
【公開日】2015年1月14日 申請日期:2014年9月29日 優(yōu)先權(quán)日:2014年9月29日
【發(fā)明者】楊育斌, 古奕奎 申請人:藍(lán)盾信息安全技術(shù)股份有限公司