原创 canvas 操作圖像記錄:自適應+提取背景色+灰度處理

目錄繪製圖像,並自適應水平垂直居中繪製圖像自適應水平垂直居中圖像數據的處理圖像灰度處理公式平均值圖像數據繪製到 canvas 上灰度處理方法提取圖像的主題色:平均值法(單色背景)、最多色值法(雙色背景)rgba 二維數組平均值法(單色背景)

原创 前端未來趨勢之原生API:Web Components

聲明:未經允許,不得轉載。 Web Components 現世很久了,所以你可能聽說過,甚至學習過,非常瞭解了。但是沒關係,可以再重溫一下,溫故知新。 瀏覽器原生能力越來越強。 js 曾經的 JQuery,是前端入門必學的技能,是前端項目必

原创 gojs 如何實現虛線(螞蟻線)動畫?

在繪製 dag 圖時,通過節點和來箭頭的連線來表示節點彼此之間的關係。而節點常常又帶有狀態,爲了更好的表示節點之間的流程關係,loading 狀態的節點,與後續節點之間,需要用 動畫着的虛線 表示,表示正在處理中,處理完纔會變成實線。原理

原创 AVA 源碼解讀-規則邏輯

做可視化決策的過程,爲了節省人的工作量及提效,一個好的方案是推薦。 現有的智能可視化推薦系統分爲兩類: 基於規則的 和 基於機器學習的。 前者一般是根據專家經驗或實驗得到的可視化準則; 後者則是直接學習從數據到可視化的模型。 本文是在研

原创 重拾字符編碼

入門python,看到廖雪峯老師把字符編碼講得很透徹,不由得就想分享了,順便整理下js的字符串。廖雪峯老師原文:字符編碼 字符編碼 我們已知字符串也是一種數據類型,但是,字符串比較特殊的是還有一個編碼問題。 1. 字節 因爲計算機只能處

原创 【瞭解】貝塞爾曲線

目錄曲線美原理命名:貝塞爾曲線(Bézier curve)曲線繪製過程數學知識(二階貝塞爾曲線爲例)個人理解瀏覽器中如何繪製csstransition-timing-function:立方貝塞爾曲線(三階貝塞爾曲線)canvas二階貝塞爾曲

原创 如何基於 echarts 實現區間柱狀圖(包括橫向)?

目錄需求借鑑 echarts 的 demo最終實現思路實現效果遇到的問題:代碼映射源碼最後 始終如一 需求 需要利用 echarts 實現區間柱狀圖,效果如下: 效果來源於:g2-柱狀圖 借鑑 echarts 的 demo 柱狀圖-

原创 如何基於 echarts 在柱狀圖或條形圖上實現轉換率?(有想法嗎?)

目錄需求探索一探索二探索三轉換實踐思路1轉換實踐思路2其他思路探索四(揭曉答案)答案篇說明backgroundColor 用法雙柱合一始終在軸的中間百分在變,但是距離軸的距離固定源碼最後 我是沒想法啦(一開始)。其實,好久沒接觸 echa

原创 數據可視化 gojs 實踐關係圖 demo:節點分組

本文是關於如何使用可視化庫 gojs 完成節點分組關係展示的,從零基礎到實現最終效果。希望對使用 gojs 的小夥伴有幫助。 1. 節點分組需求及 demo 展示 需求 能正確展示組的層次,以及節點之間的關係。 單選節點、多選節點

原创 如何用vue-cli3腳手架搭建一個基於ts的基礎腳手架

目錄 準備工作 搭建項目 vue 中 ts 語法 項目代理及 webpack 性能優化 其他 忙裏偷閒,整理了一下關於如何藉助 vue-cli3 搭建 ts + 裝飾器 的腳手架,並如何自定義 webpack 配置,優化。

原创 關於 typeof 的暫時性死區,瞭解一下

將知識轉化爲能力,核心是掌握20%行業核心技能,把學習培養成習慣,持續深耕,用能力解決問題,方能持續成長!那麼基礎好,就是必須條件。 最近看 數據類型,知道數據類型判斷有三種方式,typeof 是其中一種,主要用來判斷基礎類型(8中,s

原创 uniapp 用戶拒絕授權再次調起授權-語音識別、微信地址、附近地址

小程序重構,採用 uniapp 框架。記錄一下踩過的坑。關於用戶拒絕再次調起授權,及如何識別語音識別、微信地址、附近地址的處理。 語音識別 組件 語音識別,小程序只有錄音功能,若要識別錄音文件,常規做法是把錄音文件傳遞給後端,然後由後

原创 關於js的一些被忽視但也很重要的知識點

以爲懂了,實際沒懂。對新知識保持好奇心很有必要,但對原有知識也要更深入瞭解其細節。溫故知新,“新”,應該是自己不懂的,亦或是遺忘了的,亦或是...... 問題1: Object.prototype.toString.call([])的結

原创 【區分】Typescript 中 interface 和 type

在接觸 ts 相關代碼的過程中,總能看到 interface 和 type 的身影。只記得,曾經遇到 type 時不懂查閱過,記得他們很像,相同的功能用哪一個都可以實現。但最近總看到他們,就想深入的瞭解一下他們。 interface:接

原创 JSON.stringify() 的深入理解

目錄 序言 語法 深入理解 序言 最近在看《你所不知道的javascript》[中卷]一書,第一部分是類型和語法。本文是基於這部分的產物。在強制類型轉換->抽象值操作-> toString 部分,其中對工具函數 JSON.str