由于3月可能要結(jié)束實(shí)習(xí)，所以應(yīng)該不會(huì)有特別固定的主題，另外我會(huì)在月初陸續(xù)補(bǔ)上上個(gè)月的番外篇Projection和TMS，作為介紹性的內(nèi)容對(duì)矢量切片部分進(jìn)行補(bǔ)充，剩下時(shí)間不定期寫一些雜燴。
最近兩天在做一個(gè)地圖上popup浮動(dòng)層的功能，因?yàn)橹耙恢毖赜肙penLayers2中自帶的popup組件，但OL2中實(shí)在是難以控制浮動(dòng)層的樣式，遠(yuǎn)不及直接在地圖上覆蓋div布局來(lái)的快，所以我決定暫時(shí)放棄使用popup，自己編寫一個(gè)浮動(dòng)層。
一 問(wèn)題的來(lái)源
設(shè)計(jì)草圖如下（樣式主要參照了百度地圖的彈出層），主要講這個(gè)彈出層分為了三級(jí)：1）location：地理位置信息和定位；2）images：圖片集；3）indexs：指數(shù)計(jì)算；
那么，這篇題外講的就是在實(shí)現(xiàn)功能的過(guò)程中遇到的一個(gè)小問(wèn)題——圖片的縮略圖，在這里先簡(jiǎn)單介紹一下背景和思路：利用OL2中的popup的被選中觸發(fā)的事件，填充已經(jīng)隱藏在頁(yè)面中的POI彈出層，而數(shù)據(jù)庫(kù)中存儲(chǔ)的是圖片的URL，圖片存儲(chǔ)在服務(wù)器上，在填充POI彈出層的圖片部分時(shí)，直接插入<img>元素，再利用JS部分的功能代碼對(duì)圖片進(jìn)行重定義大小，最終實(shí)現(xiàn)將縮略圖顯示在我們的頁(yè)面上。
PS:其實(shí)這算不上是真正意義上的縮略圖，因?yàn)轫?yè)面在加載的時(shí)候，還是會(huì)加載完整的圖片，只是顯示的時(shí)候是以縮略的形式，并不會(huì)對(duì)頁(yè)面的加載速度有提升，在此只是為了實(shí)現(xiàn)這樣一個(gè)效果。
好了，那么問(wèn)題在哪呢？我們先來(lái)看如何實(shí)現(xiàn)。
延伸閱讀
學(xué)習(xí)是年輕人改變自己的最好方式