iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 9
0
Modern Web

JavaScript 菜鳥研究室系列 第 9

菜鳥日記Day 9-使用判斷式區分標記顏色

  • 分享至 

  • xImage
  •  

目前臺灣的口罩數量非常充沛,大部分藥局都可以買到口罩
但在今年2、3月新冠肺炎爆發之際,許多藥局的口罩被搶購一空
若口罩地圖上所有標記(marker)都是同一種顏色,將難以快速找到口罩貨源。

為此我們可用簡單的if判斷式,將口罩來源供不應求的藥局標記為紅色,
有充足貨源的藥局標記為藍色,藉此省下白跑一趟的時間。

https://ithelp.ithome.com.tw/upload/images/20200922/20130039rKUk3vQpSr.png
判斷式如下:

  1. 在地區判斷式裡,建立口罩數量判斷式,當成人口罩數量等於0時,執行以下動作
  2. 建立一個名為mask的變數
  3. 當口罩數量等於0時,標記顏色為紅色,若不等於0,則標記為藍色
  4. 在標記藥局時,將icon的參數設定為變數mask,藉此套用不同的標記顏色

這樣當成人口罩的數量等於0時,標記就會呈現紅色的狀況
https://ithelp.ithome.com.tw/upload/images/20200922/20130039EtfasjHWxG.png

此外,其實也可以直接把口罩數量為0的藥局隱藏起來,
作法是將標記資訊的段落,放進else括弧裡,並直接省略if括弧裡的內容即可。


上一篇
菜鳥日記Day 8-使用MarkerCluster增加網頁讀取效能
下一篇
菜鳥日記Day 10-用Leaflet版的Geolocation擷取所在地資訊
系列文
JavaScript 菜鳥研究室30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言