D3v4 & Canvas 工作坊 - D3 + Canvas 繪製動態路線圖

前言HTML 5 的 Canvas 是許多人做動畫、做遊戲常常會用到的工具,此外,如果是進行資料視覺化,在繪製大量的圖形與動畫時,Canvas 可以為你的 performance 帶來很大的改善,從 D3.js 實戰 - Canvas 把我的視覺化變「快」了! 中最後的範例就可以看得出來差異。 總之,身為前端工程師的我卻沒有實作做過 Canvas 相關應用,在羞愧之餘也得奮發向上扳回劣勢才可以,所以決定把上次用 d3 與 svg 繪製的

Read More...

一起用 JavaScript 來複習經典排序法吧!

前言最近剛好上到 CS50 Week3,這一週的主題是:Algorithms,裡面介紹到了幾種經典的排序法,像是選擇排序、泡沫排序、插入排序以及合併排序。 我覺得身為一個軟體工程師,大概一輩子都脫離不了排序了,畢竟這是經典演算法之一嘛!與其每次要面試之前都凌亂的準備,不如現在就整理出一篇,紀錄一下各個排序法的心得,幫自己做個統整。 因此,這一篇將利用 JavaScript 來實作各個經典排序演算法。 這次實做的排序法都會是由小到大排序,

Read More...

Python Web Flask 實戰開發教學 - SQLAlchemy 與 ORM

前言Web 開發涉及層面很廣,包含了前後端開發、資料庫優化、平行處理、負載平衡、高可用性、資訊安全、雲端伺服器部屬等議題,本系列文章將透過介紹 Python Web Flask 實戰開發來學習現代化網站開發的方方面面。上一篇我們完成了環境建置,這一單元我們將進入 MVC 架構的 Models 部分並學習如何使用 SQLAlchemy 建立和資料庫互動的 ORM 機制。 什麼是 MVC?MVC 模式(Model–view–cont

Read More...

深入學習 lsd-slam - 5

前言上次跟大家簡介了 Eigen 這個可以用來做線性代數運算的 open source library,讓大家有動手實作、開始玩到東西的感覺。今天要延續動手實作的精神,跟大家介紹一下該怎麼把幾張 RGB-D 影像拼接成 point cloud,接下來就讓我們一起玩玩吧! 參考資料來源這次的 data(包含 RGB 影像跟 Depth Map) 等等都是來自於 slambook 的 ch5,有這些資料真的超讚的,不然自己光要產生這些資料就

Read More...

從零開始學資料科學:Numpy 基礎入門

前言本系列文章將透過系統介紹資料科學(Data Science)相關的知識,透過 Python 帶領讀者從零開始進入資料科學的世界。這邊我們將介紹 Numpy 這個強大的 Python 函式庫。 什麼是 Numpy?Numpy 是 Python 的一個重要模組(Python 是一個高階語言也是一種膠水語言,可以透過整合其他低階語言同時擁有效能和高效率的開發),主要用於資料處理上。Numpy 底層以 C 和 Fortran 語言實作,所

Read More...

D3v4 工作坊 - React + D3 繪製 svg 動態路線地圖

前言以前在做一些跟地圖有關的應用時,第一個出現在腦海的不外乎是 Google Map 和 OpenStreetMap,然後搭配 Leaflet 與 Mapbox 等工具來對 map tile 做各種加工渲染,然而到了工作上需要時就會發現這些工具在不付費、遵守授權的狀況下,就出現了各種限制,像是需要自己架設 tile server 來轉換 OpenStreetMap 的圖資,或是 request 的次數限制等等。 想了想發現最好的替代方案

Read More...

DOM 的事件傳遞機制:捕獲與冒泡

前言(補充:感謝 othree 前輩的指點,指出這其實是在講 DOM 裡面事件傳遞的順序,因此把標題以及內文修正,原標題為:JavaScript 的事件傳遞機制:捕獲與冒泡) 今天為大家帶來的內容是 DOM 裡面的事件傳遞機制,而與這些事件相關的程式碼,相信大家應該不太陌生,就是addEventListener, preventDefault跟stopPropagation。 簡單來說,就是事件在 DOM 裡面傳遞的順序,以及你可以對這

Read More...

深入學習 LSD-SLAM - 4

前言上次講了一些基本的理論介紹,但我們現在是希望學會如何實際寫程式讓機器人動起來,只有純數學的觀念跟機器人好像沒什麼關係,所以這次希望可以開始銜接到一個常用的工具 - Eigen。讓大家有動手實作、開始玩到東西的感覺。 為什麼要會 Eigen?首先,Eigen 是一個 C++ 的 open source library,提供了許多線性代數運算相關的函式。 然後,我們這一系列是要介紹 LSD-SLAM,所以當然是因為 LSD-SLAM 也

Read More...

Sass/SCSS 簡明入門教學

Sass/SCSS 簡介 Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.

Read More...

一起來用十分鐘略懂自駕車吧!GoGoGo!

[ 前言 ]

小弟我並沒有自駕車領域的工作經驗,以下只是#我的觀察啦。希望讀者能藉此略懂自駕車,有錯的地方歡迎指正。

此文章的架構為 Why-What-How 的三大段落:

  • Why - 為什麼自駕車很重要呢
  • What - 什麼是自駕車
  • How - 自駕車是如何運作的

那麼開始吧,GoGoGo!

Read More...