(已解決)原生JS+CSS-該怎麼寫出互動台灣地圖?

js css javascript css教學

Oo_花之舞__oO 2022-06-15 17:16:16 ‧ 1798 瀏覽

我想要做的是:
在網頁中放上一個台灣地圖以不同縣市分區為標準
效果是當游標靠近會顯示:"這是台北" "這是台南"

個人的幾種作法思考
1.用SVG來畫圖不同縣市不同tag JS部分就監聽event來處理
2.一張完整圖用canvas或img丟圖然後監聽游標位置當位置符合在台北->顯示在台北
3.其他

想知道若要完成我的需求以上哪一種作法比較好或者應該有更好的想法?
以及
是否會牽扯到某種演算法或方法能夠幫助完成的?

Felix iT邦研究生 2 級 ‧ 2022-06-16 05:32:13 檢舉

不用監聽吧，我記得 HTML 就有 map 可以使用。

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

camabula

iT邦新手 3 級 ‧ 2022-06-16 14:46:07

最佳解答

在網頁中放上一個台灣地圖以不同縣市分區為標準
效果是當游標靠近會顯示:"這是台北" "這是台南"

Oo_花之舞__oO iT邦新手 1 級 ‧ 2022-06-18 04:08:13 檢舉

大大好牛逼雖然還不知道怎麼畫圖不過先跪了Orz

Samuel

iT邦好手 1 級 ‧ 2022-06-16 07:48:19

可以嘗試站在巨人的肩膀上就好

使用leafletjs來做分店經緯度資訊可視化處裡
https://coolmandiary.blogspot.com/2022/03/leafletjs.html

leafletjs有提供API polygon的可以做多邊形的繪製
geoJson要先準備
https://www.oxxostudio.tw/articles/201803/google-maps-15-geojson-taiwan.html

Oo_花之舞__oO iT邦新手 1 級 ‧ 2022-06-18 04:07:42 檢舉

感謝提供資訊!

登入發表回應

立即登入回答