2023年1月1日 星期日

露天購買 TypeC 傳輸充電線與手機架

因為之前買的磁吸線接觸不理想, 常變成慢速充電甚至不過電, 所以打算直接用手機本身的 Type C, 但手邊的 Type C 陸續被二哥與水某拿去用了, 只好重新買. 賣家要 299 才免運, 看到賣場有一個汽車手機架就順便買了湊一湊 :





免運並領了 19 元折扣碼, 實付 346 元. 

年底至今已瞎拚好多東西了, 好爽. 


2023-01-05 補充 :

今日取貨測試 Type C 可以順利連上手機傳送資料. 
 

好站 : 資料科學工作者的學習路徑

今天在 Youtube 看到張維元老師的資料科學教學影片, 非常值得一看 : 






Good Bye 2022, Welcome 2023

今天是 2023 年元旦, 我以前是元旦寶寶, 昨晚特地在 11:50 開電視看公視轉播台北 101 煙火秀, 覺得真是好看. 蔣萬安上台致詞簡單大方, 希望新的一年他真的能兌現政治支票. 其實, 我們的新年願望也是一張支票, 能否兌現就看自己的努力了. 

回顧過去一年, 在學習研究方面雖然努力進取, 但進度仍未達理想 (資料科學 Pandas 未完成), 雖說取乎上得乎中乃正常現象, 但願今年更加自律追求卓越. 2023 學習重心如下 : 
  • 傳統機器學習
  • 深度學習深化 
  • 自然語言處理 (RNN, LSTM, Trasformer, GPT-3)
  • PyTorch 
  • MicroPython 物聯網 (ESP32-CAM/樹莓派 Pico W) 
  • Flask/Django 後端網頁
  • Ubuntu 架站
  • LineBot 
檢視去年願望, 大概只有資料科學較有進度 (完成 Matplotlib, Numpy, 只差 Pandas 尚未學完).  Python 金融資訊系統根本沒動 (等自架網站完成才能做), 物聯網專案中的 No.1 網路時鐘材料已備齊就缺時間. 深度學習看完幾本書也實作, 但總覺得不夠熟練. 新的一年想回頭看傳統機器學習與學學 PyTorch. 

2022 的上半年主要投入資料科學與深度學習, 尤其 5/18 因菁菁確診我開始居家上班到 10/13 日, 期間參加了許多線上的內訓課程收穫滿滿. 另外下半年周末投入獨立型太陽能系統安裝建置, 斷斷續續忙了四個月才完成, 雖然沒列入物聯網專案, 但監控與擷取發電用電資料也要用到物聯網甚至機器學習. 總之, 雖然學習未達標, 但還是進步不少. 

光世代升速至 300M/100M

週五中華電信打電話通知說鄉下老家的光世代要升速為下行 300M, 上行 100M, 我說年中 (五月初) 才剛從 35M 升到 60M, 怎麼又要升速, 他說因為設備換新, 現在輪到我們村裡, 若調試 OK 就可升速, 我問可以不升嗎? 他說這樣可能資料傳遞優先順序會被排擠.

這聽起來似乎不升不行了, 既然如此那就拿來架站唄, 反正我租了 10 年的英國 Hostinger 明年底到期不再續租了, 那就用鄉下老家的光世代自己架站好了, 畢竟我做各種實驗與物聯網專案都需要一台能自己控制的網站伺服器. 

2022年12月31日 星期六

露天購買 Tuya 智慧插座 3 個

11 月中於蝦皮買了 5 個 Tuya 智慧插座, 已經用在太陽能儲能系統 4 個LED 燈負載, 目前剩下一個準備用在高雄陽台植栽自動定時澆水用, 之後可能還會用到, 所以在露天又買了三個 : 





今天是年底與月底, 露天免運券還有很多張, 還抽到 50 元抵用券, 實付 487 元, 平均一個 163 元.
 

露天購買 RS485 to TTL 模組等零件一批

因為要擷取太陽充電控制器的 RS485 通訊埠資料, 今天上露天購買 RS485 to TTL 模組, RJ45 壓線鉗等零組件工具一批 :





萊爾富免運共 369 元. 

關於 RS485 模組前幾天有做過市調, 參考 :


市圖還書 5 本 (Ubuntu 2.0 等)

因明天元旦圖書館放假, 今天先去還了如下 5 本書 : 
No.1 被預約須還, 其他四本無人預約都當場續借回來, 最近要抽時間看一看還回去. Ubuntu 的書要再預約回借, 過年後要把鄉下的固定網址挪給 Linux 主機架站, 王進德寫的這本言簡意賅不囉嗦, 是本好書.

2022年12月30日 星期五

jQuery UI 學習筆記 (十七) : 用下拉式選單做倒數日數計數器

今天是 2022 年最後一個上班日, 單位裡有兩位老同事 65 歲屆齡退休, 看到人家明年就可以睡到自然醒, 令我好生羨慕. 我要到 2031 年 6 月 30 才退, 還有 8 年半左右, 我到 GitHub 個人網站查看上回寫的退休倒數計日程式, 精確來說是 8 年又 183 天, 參考 : 


其實還有很多倒數計日的應用時機, 例如會考, 學測, ... 甚至是預期的平均壽命都可以. 因為很久沒寫 jQueryUI 了, 一時技癢就拿這個來練習一下吧! 將我的退休倒時記日器一般化, 可以選定截止日期, 計算離那個日期還有幾年幾天. 

最直覺的方式是用下拉式選單 SelectMenu, 年月日都設一個, 然後監聽 onchange 事件, 任何一個選擇器改變就立即進行倒數計算. 關於 SelectMenu 用法參考 :


如下面範例 1 所示 : 


測試 1 : 用 jQueryUI 的 SelectMenu 選取年月日以計算倒數日數 [看原始碼]

<!doctype html>
<html>
  <head>
    <meta http-equiv="cache-control" content="no-cache">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="https://code.jquery.com/ui/1.12.1/themes/hot-sneaks/jquery-ui.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script> 
    <style>
      body {
        font-family: 微軟正黑體, Arial, Helvetica, sans-serif;
        font-size:12px;
        }
    </style>
  </head>
  <body>
    <div style="padding: 2px; margin: 3px;">
      <h3>倒數日數計算</h3>
      <p><b>請選擇截止日期 :</b></p>
      <select id="year">
        <option value="2023">2023 年</option>
        <option value="2024">2024 年</option>
        <option value="2025">2025 年</option>
        <option value="2026">2026 年</option>
        <option value="2027">2027 年</option>
        <option value="2028">2028 年</option>
        <option value="2029">2029 年</option>
        <option value="2030">2030 年</option>
        <option value="2031">2031 年</option>
        <option value="2032">2032 年</option>
        <option value="2033">2033 年</option>
        <option value="2034">2034 年</option>
        <option value="2035">2035 年</option>
        <option value="2036">2036 年</option>
        <option value="2037">2037 年</option>
        <option value="2038">2038 年</option>
        <option value="2039">2039 年</option>
        <option value="2040">2040 年</option>
        <option value="2041">2041 年</option>
        <option value="2042">2042 年</option>
        <option value="2043">2043 年</option>
        <option value="2044">2044 年</option>
        <option value="2045">2045 年</option>
        <option value="2046">2046 年</option>
        <option value="2047">2047 年</option>
        <option value="2048">2048 年</option>
        <option value="2049">2049 年</option>
        <option value="2050">2050 年</option>
      </select>
      <select id="month">
        <option value="Jan">1 月</option>
        <option value="Feb">2 月</option>
        <option value="Mar">3 月</option>
        <option value="Apr">4 月</option>
        <option value="May">5 月</option>
        <option value="Jun">6 月</option>
        <option value="Jul">7 月</option>
        <option value="Aug">8 月</option>
        <option value="Sep">9 月</option>
        <option value="Oct">10 月</option>
        <option value="Nov">11 月</option>
        <option value="Dec">12 月</option>
      </select>
      <select id="date">
        <option value="1">1 日</option>
        <option value="2">2 日</option>
        <option value="3">3 日</option>
        <option value="4">4 日</option>
        <option value="5">5 日</option>
        <option value="6">6 日</option>
        <option value="7">7 日</option>
        <option value="8">8 日</option>
        <option value="9">9 日</option>
        <option value="10">10 日</option>
        <option value="11">11 日</option>
        <option value="12">12 日</option>
        <option value="13">13 日</option>
        <option value="14">14 日</option>
        <option value="15">15 日</option>
        <option value="16">16 日</option>
        <option value="17">17 日</option>
        <option value="18">18 日</option>
        <option value="19">19 日</option>
        <option value="20">20 日</option>
        <option value="21">21 日</option>
        <option value="22">22 日</option>
        <option value="23">23 日</option>
        <option value="24">24 日</option>
        <option value="25">25 日</option>
        <option value="26">26 日</option>
        <option value="27">27 日</option>
        <option value="28">28 日</option>
        <option value="29">29 日</option>
        <option value="30">30 日</option>
        <option value="31">31 日</option>
      </select>
    </div>
    <div class="ui-state-highlight ui-corner-all" style="padding: 5px; margin: 5px; width:290px;">
      <span class="ui-icon ui-icon-info"></span>
      <span id="msg" style="font-weight: bold; "></span>
    </div>
    <input type='hidden' id='year_val' value='2023'>
    <input type='hidden' id='month_val' value='1'>
    <input type='hidden' id='date_val' value='1'>
    <script> 
      $(function(){
        function calculate(){
          var the_end=$("#month_val").val() + ' ' + 
                      $("#date_val").val() +  ', ' + 
                      $("#year_val").val();
          var t=Date.parse(the_end)-new Date().getTime();
          var total_days=Math.floor(t / (1000 * 60 * 60 * 24));
          var years=Math.floor(total_days / 365);
          var days=total_days % 365;
          var msg="離截止日期還有 " + years + " 年 " + days + " 天 (共 " + 
                  total_days + " 天)";
          $("#msg").text(msg);        
          }
        $("#year").selectmenu({width: 120});
        $("#month").selectmenu({width: 80});
        $("#date").selectmenu({width: 90});
        $('#year').on('selectmenuchange', function() {
          $("#year_val").val($(this).val());
          calculate();
          });
        $('#month').on('selectmenuchange', function() {
          $("#month_val").val($(this).val());
          calculate();
          });
        $('#date').on('selectmenuchange', function() {
          $("#date_val").val($(this).val());
          calculate();
          });
        calculate();   //初次仔入網頁時顯示初始值
        });
    </script>
  </body>
</html>

此例網頁中設置了三個隱藏元件 (type=hidden 的 input 元素), 分別用來儲存三個 SelectMenu 元件所選定之值, 每一個下拉式選單都有綁定 onchange 事件, 只要選項被改變就會更新相對應之隱藏元件之值, 這部分邏輯被寫成 calculate() 函式來處理. 下拉式選單的初始值就是第一個選項 (2023-01-01) 之值. 注意, SelectMenu 元件的寬度無法用 style 屬性設定 (無效), 必須在初始化時傳入 {width: } 物件來設定. 結果如下 : 




哈哈, 這正是我的退休倒數日數. 

下面改用 HTML5 的 Date 表單元件來選取截止日期, 用法參考下面這篇的範例 4 :


Date 元件可綁定 onchange 事件, 以便選定日期後觸發事件處理函式, 參考 :




<!doctype html>
<html>
  <head>
    <meta http-equiv="cache-control" content="no-cache">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="https://code.jquery.com/ui/1.12.1/themes/hot-sneaks/jquery-ui.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script>
    <script> 
      function calculate(e){
        alert(e.target.value);
        }
    </script>
    <style>
      body {
        font-family: 微軟正黑體, Arial, Helvetica, sans-serif;
        font-size:12px;
        }
    </style>
  </head>
  <body>
    <div style="padding: 2px; margin: 3px;">
      <h3>倒數日數計算</h3>
      <p><b>請選擇截止日期 :</b></p>
      <input type="date" id="date" onchange="handler(event)"> 
    </div>
    <div class="ui-state-highlight ui-corner-all" style="padding: 5px; margin: 5px; width:290px;">
      <span class="ui-icon ui-icon-info"></span>
      <span id="msg" style="font-weight: bold; "></span>
    </div>
    <script>
      function handler(event){
        var YMD=event.target.value.split("-");   // [2022,12,31]
        var month=['Jan', 'Feb', 'Apr', 'Mar', 'May', 'Jun', 'Jul', 'Aug',
                   'Sep','Oct', 'Nov', 'Dec'];
        var the_end=month[parseInt(YMD[1])-1] + ' ' + YMD[2] +  ', ' + YMD[0];
        var t=Date.parse(the_end)-new Date().getTime();
        var total_days=Math.floor(t / (1000 * 60 * 60 * 24));
        var years=Math.floor(total_days / 365);
        var days=total_days % 365;
        var msg="離截止日期還有 " + years + " 年 " + days + " 天 (共 " + 
                total_days + " 天)";
        $("#msg").text(msg);      
        }
    </script>
  </body>
</html>

此例使用 HTML5 表單元件中的日期選擇器 (type=date 的 input 元件) 來選取截止日期, 注意, 此處所綁定的 onchange 事件, 呼叫端之傳入參數名稱一定要用 event, 亦即必須用 onchange="handler(event)",  用其他參數名稱會出現錯誤 (函式端則不受限, 可用 event 或 e 等等). 由於 Date 元件預設的日期格式為 YYYY-MM-DD, 所以要用 split() 將 Y, M, D 拆開, 其中 M 用陣列對照轉換成英文簡寫, 再與 Y, D 組成例如 'Dec 31, 2022' 的日期格式字串, 結果如下 : 





因為過了 12 點, 所以比上面範例 1 少一天啦. 

有空可以用 jQueryUI 本身的 datepicker 來做, 參考 : 


不小心按到 NumLock 鍵會打不出中文

下午在筆電編輯程式時發現中文打不出來, 明明右下角顯示 "中" 文模式, 但卻都打出英數字, 關掉瀏覽器也一樣. 後來想到該不會是按到甚麼奇怪按鍵吧? 仔細回想, 才想起先前曾要螢幕截圖按 Fn + PrtScr 鍵卻不小心按到 PrtScr 旁邊的 NumLk 鍵, 好像從那時開始中文就打不出來了. 重按一次 NumLk 即恢復正常. 畢竟 NumLk 鍵很少用, 所以記一下, 免得又忘了. 

有時小咪跳上我書桌要跳上鋼琴時就直接踩我鍵盤, 這時誤踩按鍵也會造成不知原因的災情, 所以離開書桌就養成習慣蓋上筆電, 結果筆電上蓋常有貓腳印, 呵呵, 這總比一直打不出中文好. 

露天購買桌球練習器

這兩天老同學峰大師一直在秀剛買的桌球練習器, 雖然我桌球球技很爛 (所以已經很久沒打桌球了), 但覺得拿來運動扭扭身體也不錯, 而且不占空間, 就買來玩玩唄 : 




我選 500 元附兩支球拍的, 含運共 545 元. 

2023-01-04 補充 : 

今日去萊爾富取貨, 內有一個底座, 三條很有彈性的碳纖維條 (短, 中, 長三種長度適合不同身高), 與六顆加工的乒乓球 (已鑽洞可插入塑鋼條). 將碳纖維條底端鎖在底座 (有螺紋) 後, 頂端插入乒乓球孔約 3 公分即可使用.