接觸過Silverlight的朋友們,可能都對DeepZoom這項技術比較熟悉了。
通過DeepZoom所提供的以交互方式查看高分辨率圖像的功能。用戶可以快速放大和縮小圖像,而不會影響應用程序的性能,基于此項技術,使用者能夠將海量圖片資源的統一展示給用戶,并且不損失其質量。
作為微軟替Silverlight準備的高級圖像處理技術之一,在很多場合中都能看到DeepZoom的身影。
比如:http://seadragon.com/ 上,就存在著很多相關應用示例。其直觀縮放效果之佳,堪稱令人嘆為觀止。例如,一張原本模糊不清的自行車廣告,放大到最后,我們甚至能將其上的廣告詞看得一清二楚。
我不得不說,天啊!真是牛X!但Silverlight是如何實現這一切的呢?
原因在于,DeepZoom對于圖像的處理并非一整張一攬子的顯示給用戶,而是將大圖“切”成一系列小圖,再將大圖像分辨率壓縮到一定比例展示出去,只有當用戶點擊某部分請求交互式,才會通過網絡將更高分辨率的“小圖”逐次傳輸到前臺。
也就是說,當文件初始加載時,只有極少量數據會在屏幕上顯示內容,最初加載的都是有損的低分辨率圖像,然后根據用戶的不同選擇, 再分別將更高或更低分辨率的圖像傳遞出來。這也是DeepZoom號稱其提供"模糊到鮮亮"體驗的原因,也是DeepZoom不管圖像有多大都能無縫立即打開圖像而不用等待很長時間加載圖像數據的原因。
但根究其關鍵點來說,也無外乎異步加載,逐次傳遞罷了。比如在Seadragon上,我們隨意打開一個示例就會發現,當我們初次點擊某一圖像時,程序也只是簡單的將其“膨化”,圖像并不清晰,甚至可說非常的模糊。
然后,程序才會根據用戶所點擊區域,將x,y坐標與一個區分縮放程度的數值傳到后臺,再由后臺查詢對應的分解圖,僅將其對應部分傳遞到前臺,達到資源占用的最小化與運行效率的最大化。
所以我們在有時會看到這種情況,就是某一個角落的解析度很高,但整體卻非常模糊。事實上,這是由于DeepZoomObject異步加載后臺圖塊所造成的。
事實上,只要開發者有此意愿,無論是Java抑或Flash中,都可以將其輕易地重現出來。比如鄙人在本周為LGame新添加的一個放大鏡組件,就可以實現近似功能。(當然,此項功能最主要的作用在于組件和精靈的自動縮放,單獨的放大鏡組件只是衍生品……)
比如,筆者在此處內置了機器貓同人《糟糕小叮當》(又名:野比的后宮)作為示例,以紅色圓靶來決定放大的區域。
(程序下載地址(源碼在jar中,內有《糟糕小叮當》1-519……):http://code.google.com/p/loon-simple/downloads/list )
無需用戶關心具體細節,只要你會使用鼠標,組件就會根據你的點擊位置自動放大指定區域圖像到你面前。
當然,目前此部分的Java實現并不完善,只做了前臺的圖像膨化、柔化、銳化。但事實上,由于此時我們已經獲得了該區域的x,y坐標與圖像深度值,只要效仿Silverlight多進行一次后臺查詢與傳圖,那么實際的運行結果也將是高度一致的了。(這部分預計留待LGame-Simple-0.5版增加網絡服務時再提供)
程序下載地址(源碼在jar中,內有《糟糕小叮當》1-519……):http://code.google.com/p/loon-simple/downloads/list
浙公網安備 33010602011771號