在台中東海藝術街的網站首頁加了影像地圖，一種是單純的影像地圖，另一種是可以移動放大縮小的影像地圖，附加自動判斷手持裝置和桌上型電腦的網頁程式語法。

東海藝術街網站首頁：首頁會自動判斷瀏覽設備的種類，進入下面網頁。
東海藝術街影像地圖手機板：用手指放大縮小地圖，圖中有編號的十個文創據點是可以點選的。
東海藝術街影像地圖桌機板：地圖可以用滑鼠滾輪放大縮小，有紅色指標的符號可以點選連結。

為了幫台中東海藝術街做網路宣傳，很久以前就申請了ArtStreet.tw的網址，但是這個網址目前只給了兩位朋友放置部落格（惠君咖啡和主鈴手創坊）。前陣子主鈴畫了東海藝術街的地圖，我就想把這張地圖拿來放在首頁，製作成影像地圖。可是藝術街的範圍很大，瀏覽整張地圖解析度會不夠清楚，把地圖分割成幾個區塊又不夠漂亮。於是我就開始上網去找網頁程式，希望可以做到讓地圖可以移動、然後放大縮小、最後是可以點選目標往其他頁面連結。

最後我找到的程式是：Smooth Zoom Pan – jQuery Image Viewer
這個程式的功能很多，包括：
1.圖片可以移動和放大縮小，可以用滑鼠滾輪和拖曳，也可以在畫面上放按鈕來移動跟放大縮小圖片；
2.可以預設圖片的顯示大小及位置；
3.圖片上可以加標誌與說明文字，標誌與文字可以隨圖片放大縮小，也可以固定大小；
4.網頁上可以增加文字連結，點選文字時，圖片就會移動到特定座標。

以上大致已經可以達到我的需要，幾個小問題是：
1.說明文字上如果放超連結，必須用滑鼠右鍵點，開啟到新頁面才行（可能是CSS內的設定，我不會改囧）；
2.承上，圖片上的標誌則可以加超連結；
3.前面提到的功能1和功能4寫在兩個不同的範例檔案，結合起來時費了一點功夫；
4.對，這是個要錢的程式，但不知道怎麼的，有個地方可以下載…

至於手機版的網頁，我就直接放比較高解析度的影像地圖，反正手機會自動調整大小，而且手指就可以縮放跟移動了。我建議用Coffee Cup Image Mapper這個程式製作影像地圖，要錢的，但是免費的軟體做起來都有點怪怪的…

最後是辨識瀏覽程式是手機、平板或桌上型電腦的程式，原始來源是：Mobiledetect，很好用。