本發(fā)明涉及地理信息系統(tǒng)，具體涉及一種基于高德地圖api的便捷式地圖圖例組件及其圖層加載方法。

背景技術(shù)：

1、地圖圖例組件是地圖制作中不可或缺的一部分，它用于解釋地圖上的符號和顏色所代表的內(nèi)容，其通常位于地圖的一角或一側(cè)，通過符號示例及其說明文字來表示地圖要素的含義，圖例的設(shè)計需要考慮符號的完備性和一致性，以確保圖例能夠準(zhǔn)確地反映地圖上的信息，能夠為用戶提供了更好的信息理解和交互體驗，是地圖上不可或缺的一種重要工具；

2、目前，圖例組件在使用時，圖例組件靈活度較低，用戶與圖例組件之間缺乏良好的交互感，用戶難以簡單、直觀的使用圖例組件，體驗往往不佳；

3、因此，發(fā)明一種基于高德地圖api的便捷式地圖圖例組件及其圖層加載方法來解決上述問題很有必要。

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

1、本發(fā)明的目的是提供一種基于高德地圖api的便捷式地圖圖例組件及其圖層加載方法，通過設(shè)計有靈活的配置單元，且具有豐富的圖層類型選擇、高效的點線數(shù)據(jù)展示、靈活的圖層管理、事件回調(diào)機制，以及數(shù)據(jù)處理單元、圖例顯示單元、配置單元和圖層交互單元的協(xié)同工作，從而使得該地圖圖例組件的靈活度更高，用戶可以清楚的知曉地圖圖例組件中各元素的含義，并對各個元素進(jìn)行操作，使得用戶與圖例組件之間的交互感大大提高，從而優(yōu)化了用戶的使用體驗，信息傳達(dá)效率高；進(jìn)一步的，圖層加載方法通過配置和初始化地圖圖例組件，進(jìn)一步的提高了用戶的使用體驗，交互方式簡單直觀，而采用了模塊化和結(jié)構(gòu)化的設(shè)計，使得地圖圖例組件的配置和更新變得更加容易，無需對整體代碼進(jìn)行大規(guī)模修改即可完成配置，使用簡單方便，以解決技術(shù)中的上述不足之處。

2、為了實現(xiàn)上述目的，本發(fā)明提供如下技術(shù)方案：一種基于高德地圖api的便捷式地圖圖例組件包括：

3、配置單元，有初始化默認(rèn)配置，用于接收使用者傳入的參數(shù)進(jìn)行融合給其他單元使用；

4、圖例顯示單元，用于展示地圖圖例組件的圖例模塊；

5、圖層類型單元，用于將地圖圖層的類型進(jìn)行分類定義；

6、圖層交互單元，用于將不同的圖層類型對地圖圖例組件的交互進(jìn)行統(tǒng)一封裝處理；

7、數(shù)據(jù)處理單元，用于獲取圖例數(shù)據(jù)、存儲圖例數(shù)據(jù)、以及處理圖例數(shù)據(jù)；

8、圖例交互單元，用于控制地圖圖例組件的狀態(tài)；

9、事件交互單元，用于將地圖圖例組件中需要和使用者發(fā)生交互關(guān)聯(lián)的操作，進(jìn)行一個事件回調(diào)。

10、前述的基于高德地圖api的便捷式地圖圖例組件，所述其他單元包括圖例顯示單元、圖例交互單元、地圖圖層類型單元、地圖圖層交互單元、數(shù)據(jù)處理單元、以及事件交互單元。

11、前述的基于高德地圖api的便捷式地圖圖例組件，所述圖例模塊包括如下元素：

12、a、圖形符號，用于接收圖片地址展示出圖形符號；

13、其中，通過配置單元接收2個圖片地址后，規(guī)定第1個為圖例關(guān)閉狀態(tài)，第2個為圖例開啟狀態(tài)，不接收圖片時，則不顯示圖形符號；

14、且圖形符號默認(rèn)寬度設(shè)置為頁面寬度的2.5%，默認(rèn)高度設(shè)置為頁面高度的2.5%，并能通過配置單元自行設(shè)置寬高；

15、b、加載中符號，具體以四個圓點勻速旋轉(zhuǎn)代表為加載中狀態(tài)，默認(rèn)隱藏；

16、c、內(nèi)容標(biāo)簽，默認(rèn)為空，使用者可傳入內(nèi)容擴(kuò)展圖例顯示單元信息；

17、d、圖例名稱，默認(rèn)為隱藏，顯示內(nèi)容為配置單元的標(biāo)題信息。

18、前述的基于高德地圖api的便捷式地圖圖例組件，所述圖層類型單元包括點類圖層、線類圖層、其他圖層；

19、其中，點類圖層包括：海量點圖層、標(biāo)記點圖層、海量點標(biāo)記圖層、標(biāo)注類圖層、以及點聚合圖層，

20、所述點類圖層基本表現(xiàn)形式為n個所述圖形符號在地圖上按照空間地理數(shù)據(jù)展示位置信息；

21、線類圖層包括：海量線圖層、折線圖層；

22、所述線類圖層基本表現(xiàn)形式為n條折線在地圖上按照空間地理數(shù)據(jù)展示位置信息；

23、其他圖層包括：熱力圖圖層和圖片圖層；

24、其中，點類圖層、線類圖層、其他圖層均可創(chuàng)建或銷毀。

25、前述的基于高德地圖api的便捷式地圖圖例組件，所述圖層交互單元，將不同的圖層類型對地圖圖例組件的交互進(jìn)行統(tǒng)一封裝處理，具體包括：

26、k1、采用地圖通用的方法定義圖層的創(chuàng)建、銷毀、隱藏、以及顯示；

27、k2、點類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)移入移出操作；

28、k3、點類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)點擊操作；

29、k4、線類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)移入移出操作；

30、k5、線類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)點擊操作。

31、前述的基于高德地圖api的便捷式地圖圖例組件，在k1中，采用地圖通用的方法定義圖層的創(chuàng)建、銷毀、隱藏、以及顯示，具體如下：

32、創(chuàng)建圖層方法：根據(jù)不同的圖層類型，通過對應(yīng)的高德js?api方法傳入數(shù)據(jù)在地圖上創(chuàng)建對應(yīng)的圖層，進(jìn)行數(shù)據(jù)可視化的顯示；

33、銷毀圖層方法：根據(jù)不同的圖層類型，通過對應(yīng)的高德js?api方法將地圖上對應(yīng)的已創(chuàng)建的圖層銷毀；

34、隱藏圖層方法：根據(jù)不同的圖層類型，通過對應(yīng)的高德js?api方法將地圖上對應(yīng)的已創(chuàng)建且顯示的圖層進(jìn)行隱藏操作；

35、顯示圖層方法：根據(jù)不同的圖層類型，通過對應(yīng)的高德js?api方法將地圖上對應(yīng)的已創(chuàng)建且隱藏的圖層進(jìn)行顯示操作；

36、在k2中，點類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)移入移出操作，具體如下：

37、鼠標(biāo)在圖層的某個點位上移入時，獲取點位數(shù)據(jù)的描述信息，若有，在點位上方展示描述文本，反之無響應(yīng)；

38、鼠標(biāo)在圖層的某個點位上移出時，隱藏已顯示的描述文本；

39、鼠標(biāo)在圖層的某個點位上移入時，獲取點位數(shù)據(jù)的選中狀態(tài)圖形符號；若有，在點位疊加一個已選中狀態(tài)的圖形符號，表示為該點位被選中，反之無響應(yīng)；

40、鼠標(biāo)在圖層的某個點位上移出時，該點位有選中效果時，去除選中效果；

41、同時觸發(fā)事件交互單元的圖層操作回調(diào)事件；

42、在k3中，點類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)點擊操作，具體如下：

43、鼠標(biāo)在圖層的某個點位上點擊時，獲取點位數(shù)據(jù)的選中狀態(tài)圖形符號；若有，在點位疊加一個已選中狀態(tài)的圖形符號，表示為該點位被選中，反之無響應(yīng)；

44、同時觸發(fā)事件交互單元的圖層操作回調(diào)事件；

45、在k4中，線類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)移入移出操作，具體如下：

46、鼠標(biāo)在圖層的某段折線上移入時，獲取折線數(shù)據(jù)的描述信息，若有，在折線上方展示描述文本，反之無響應(yīng)；

47、鼠標(biāo)在圖層的某段折線上移出時，隱藏已顯示的描述文本；

48、鼠標(biāo)在圖層的某段折線上移入時，獲取折線數(shù)據(jù)的選中狀態(tài)配置，將該折線根據(jù)選擇配置項改變折線樣式，表示該線段為選中狀態(tài)的線段，表示為該折線被選中；

49、鼠標(biāo)在圖層的某段折線上移出時，該折線有選中效果時，去除選中效果，恢復(fù)成默認(rèn)效果；

50、同時事件交互單元的圖層操作回調(diào)事件；

51、在k5中，線類圖層在地圖上的可視化顯示后，響應(yīng)鼠標(biāo)點擊操作，具體為：同時觸發(fā)事件交互單元的圖層操作回調(diào)事件。

52、前述的基于高德地圖api的便捷式地圖圖例組件，所述數(shù)據(jù)處理單元在配置單元里獲取圖例數(shù)據(jù)配置項，進(jìn)行調(diào)用；

53、調(diào)用過程中圖例顯示單元加載中符號顯示，代表地圖圖例組件加載中，調(diào)用完成時，加載中符號隱藏代表圖例數(shù)據(jù)加載結(jié)束；

54、圖例數(shù)據(jù)加載成功后，將圖例數(shù)據(jù)進(jìn)行存儲，根據(jù)配置單元獲取圖例類型調(diào)用圖層交互單元的創(chuàng)建圖層方法，創(chuàng)建出圖層。

55、前述的基于高德地圖api的便捷式地圖圖例組件，所述圖例交互單元在使用時，能夠響應(yīng)鼠標(biāo)移入移出、響應(yīng)鼠標(biāo)點擊操作改變圖形符號的狀態(tài)、響應(yīng)鼠標(biāo)點擊操作；

56、其中，在響應(yīng)鼠標(biāo)移入移出時：

57、若鼠標(biāo)在圖形符號上移入時，能夠控制圖例顯示單元顯示圖例名稱，

58、若鼠標(biāo)在圖形符號上移出時，能夠控制圖例顯示單元使圖例名稱隱藏；

59、在響應(yīng)鼠標(biāo)點擊操作改變圖形符號的狀態(tài)時：

60、若鼠標(biāo)點擊狀態(tài)為關(guān)閉圖形符號時，圖形符號切換為開啟狀態(tài)，

61、若鼠標(biāo)點擊狀態(tài)為開啟圖形符號時，圖形符號切換為關(guān)閉狀態(tài)；

62、在響應(yīng)鼠標(biāo)點擊操作時：

63、當(dāng)鼠標(biāo)點擊狀態(tài)為關(guān)閉圖形符號時，在地圖上進(jìn)行添加圖層可視化操作，具體為：

64、a1、若圖層未創(chuàng)建，則調(diào)用數(shù)據(jù)處理單元獲取圖例數(shù)據(jù)，進(jìn)行數(shù)據(jù)獲取圖層創(chuàng)建；

65、a2、若圖層已創(chuàng)建，調(diào)用顯示圖層方法，將已創(chuàng)建但隱藏的圖層可視化顯示在地圖上；

66、a3、若圖層已創(chuàng)建且配置單元里緩存數(shù)據(jù)配置是開啟時，重新調(diào)用數(shù)據(jù)處理單元獲取圖例數(shù)據(jù)，進(jìn)行數(shù)據(jù)獲取圖層創(chuàng)建；

67、a4、若配置單元里定時器配置為開啟時，根據(jù)配置的定時時間設(shè)置創(chuàng)建一個定時器，在獲取圖例數(shù)據(jù)成功時開始定時，等定時時間到期，重新調(diào)用數(shù)據(jù)處理單元獲取圖例數(shù)據(jù)進(jìn)行圖層數(shù)據(jù)更新創(chuàng)建；

68、鼠標(biāo)點擊狀態(tài)為開啟圖形符號時，此時圖層已創(chuàng)建，在地圖上進(jìn)行移除圖層可視化操作，具體為：

69、b1、若配置單元里緩存圖例數(shù)據(jù)配置是開啟時，調(diào)用隱藏圖層方法，將已創(chuàng)建且顯示的圖層進(jìn)行隱藏；

70、b2、若配置單元里緩存圖例數(shù)據(jù)配置是關(guān)閉時，調(diào)用銷毀圖層方法，將已創(chuàng)建的圖層進(jìn)行銷毀；

71、b3、若配置單元里開啟定時器配置時，進(jìn)行關(guān)閉定時器操作。

72、前述的基于高德地圖api的便捷式地圖圖例組件，所述事件回調(diào)包括圖層點擊回調(diào)事件、數(shù)據(jù)加載回調(diào)事件、以及圖層操作回調(diào)事件；

73、其中，圖層點擊回調(diào)事件具體為：圖例顯示單元被鼠標(biāo)單擊時，會調(diào)用該回調(diào)事件，傳參為當(dāng)前圖例顯示單元開關(guān)的狀態(tài)和地圖圖例組件的配置項；

74、數(shù)據(jù)加載回調(diào)事件具體為：獲取圖例數(shù)據(jù)時，在開始獲取圖例數(shù)據(jù)、圖例數(shù)據(jù)獲取失敗、圖例數(shù)據(jù)獲取結(jié)束三個狀態(tài)時都會調(diào)用該回調(diào)事件，傳參為調(diào)用狀態(tài)和地圖圖例組件的配置項；

75、圖層操作回調(diào)事件具體為：對于鼠標(biāo)的點擊，移入事件進(jìn)行監(jiān)聽處理，具體為：

76、點類圖層在地圖上撒點后，能夠?qū)蝹€點位進(jìn)行事件的監(jiān)聽回調(diào)，

77、線類圖層在地圖上繪制后，能夠?qū)蝹€折線進(jìn)行事件的監(jiān)聽回調(diào)。

78、一種基于高德地圖api的便捷式地圖圖例組件的圖層加載方法，包括以下步驟：

79、s1、在地圖上配置及初始化圖例，確定地圖圖例組件的配置列表；

80、其中，配置列表包括尺寸、名稱、圖形符號、內(nèi)容樣式，地圖圖層；

81、s2、判斷地圖圖例組件是否打開；

82、其中，若為是，執(zhí)行步驟s4，若為否，不做任何操作；

83、s3、點擊地圖圖例組件控制其開啟地圖圖層或關(guān)閉地圖圖層；

84、其中，若當(dāng)前地圖圖例組件是關(guān)閉狀態(tài)，執(zhí)行步驟s4，若當(dāng)前地圖圖例組件是開啟狀態(tài)，執(zhí)行步驟s6；

85、s4、調(diào)用地圖圖例組件獲取數(shù)據(jù)方法，獲取地圖圖例組件數(shù)據(jù)；

86、s5、根據(jù)地圖圖例組件的地圖圖層類型判斷是否能處理；

87、其中，若為是，根據(jù)地圖圖例組件數(shù)據(jù)創(chuàng)建對應(yīng)類型的地圖圖層，若為否，將地圖圖例組件數(shù)據(jù)返回；

88、s6、在地圖上生成地圖圖層；

89、s7、關(guān)閉地圖圖例組件時，地圖上地圖圖例組件的地圖圖層移除。

90、與現(xiàn)有技術(shù)相比，本發(fā)明的有益效果是：

91、1、本發(fā)明通過設(shè)計有靈活的配置單元，地圖圖例組件在使用中，可以根據(jù)用戶自身需求進(jìn)行調(diào)整，優(yōu)化了用戶的使用體驗，界面簡潔的同時，信息傳達(dá)效率高；

92、2、通過圖例顯示單元加載中符號的顯示與隱藏，為用戶提供了清晰的加載狀態(tài)反饋，避免了用戶因不明確加載狀態(tài)而產(chǎn)生的焦慮或誤解，而鼠標(biāo)移入圖形符號時顯示圖例名稱，移出時隱藏，這種即時反饋機制幫助用戶快速識別和理解地圖上的元素，增強了地圖圖例組件的可讀性和易用性；

93、3、提供了豐富的圖層類型選擇、高效的點線數(shù)據(jù)展示、靈活的圖層管理，從而提升地圖圖例組件的可讀性和交互性的能力，進(jìn)一步的優(yōu)化了用戶的使用效果，且通過圖層交互單元統(tǒng)一封裝處理，使得圖層的管理較為靈活，具有豐富的交互體驗；

94、4、事件回調(diào)機制則支持復(fù)雜圖層數(shù)據(jù)的可視化操作，并根據(jù)當(dāng)前圖例顯示單元的狀態(tài)和地圖圖例組件的配置項進(jìn)行相應(yīng)處理，這種即時反饋機制增強了用戶與地圖之間的交互性，使用戶能夠更直觀地控制地圖圖層的顯示與隱藏，再次用戶體驗；

95、5、通過數(shù)據(jù)處理單元、圖例顯示單元、配置單元和圖層交互單元的協(xié)同工作，使得圖層的處理、加載、創(chuàng)建、配制、優(yōu)化都變得高效直觀，圖層數(shù)據(jù)變得透明、可控，具有高度靈活性，使用者與整個地圖圖例組件的交互更好，操作更為直觀便捷；

96、6、圖層加載方法通過配置和初始化地圖圖例組件，使得用戶能夠直觀地看到地圖圖例，了解地圖上不同圖層所代表的含義，提高了用戶的使用體驗，交互方式簡單直觀，靈活性較高，滿足不同應(yīng)用場景的需求，且通過判斷地圖圖例組件的開關(guān)狀態(tài)，能夠確保圖層加載的準(zhǔn)確性和有效性，采用了模塊化和結(jié)構(gòu)化的設(shè)計，使得地圖圖例組件的配置和更新變得更加容易，無需對整體代碼進(jìn)行大規(guī)模修改即可完成配置，使用簡單方便。