騰訊地圖技術小記(一)

業務背景:

最近使用騰訊地圖做技術支持的功能,具體是在地圖上展現某塊景區的內容,然後爲了填充景區地圖區域的美觀性,使用覆蓋圖的形式,進行美化,但是地層的POI圖標也就是地圖上的超市、景觀、車站等名稱都被掩蓋,也諮詢過騰訊地圖項目組,項目組的回覆是因爲的使用的是騰訊地圖JavaScript組件中的map對象,此map對象用於手機端時,地圖其實是每塊切片組合而成,地圖上的POI無法進行調整他的優先層級,可以理解爲POI的標註只是一張圖片。但是甲方想要標註出來每個景點的名稱,這次就直接使用騰訊地圖JavaScript組件中Label對象,此對象可以在地圖上進行文字標註,標註內容可以是HTML標籤,也可以通過方法來賦予Label對象CSS樣式。
但是會出現一個這樣的問題,景點的名稱上部會有一個景點標識,景點標識跟景點的名稱無法形成居中的效果,這裏我用到了Label的Offset,對label的位置進行了偏移,但是景點名稱大小不一,我們如何去做全適應的居中,一開始我嘗試了多個if,可以實現效果,但是這樣太笨重,如果出現更長的名稱我們就要在代碼中進行修改並調試,這會因爲這個小事添加工作量.

解決方案:

1.限制名稱長度,並且把每個長度下的狀況都考慮到並寫到代碼裏面去
2.使用等比數列的方式,利用公式的方式,來科學的調整文字的位置。
最後我選了第二個方案,因爲確實比較省事,這也是我在開發生涯中第一次使用數學公式來進行解決問題,當然最後成功解決完問題的喜悅與成就感已經寫滿在了臉上。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章