Prophecy Book - 爲 TensorFlowJS 作的 Notebook 小工具

時間 2019-11-08

標籤 prophecy book tensorflowjs notebook 工具简体版

原文原文鏈接

亂了好久終於仍是簽了三方，雖然工資很少仍是算是有結果了。如今在學校上課無所事事，因此想着本身部門是作數據技術的，來作個東西玩AI好了（並不認可本人感染了AI）這個工具目前仍是demo雛型，bug和功能需求，但願你們都能踊躍的提到github上面！javascript

由於要tfjs使用方便，請使用最新Chrome瀏覽器java

Github地址：github.com/mxz96102/pr…react

線上demo地址： pbook.hustfe.com/git

Why and How

實際上在編寫數據相關的代碼時候，一個一體化的東西能很大的提升生產效率，因此在本身能力範圍內編寫一個方便本身玩tfjs的工具。由於以爲其實在py數據處理工具裏面使用的notebook工具真的比較方便，因此這個工具是notebook型的，旨在僅需瀏覽器，實現代碼到數據可視化的鏈路。github

此次由於是本身的項目，因此使用了本身喜歡的mobx+ts+react來寫。（在公司寫了四個月的antd+dva型項目，讓本身呼吸一下喜歡的技術棧吧）json

另外，這次是興起而發，因此沒有作同類工具的調研，因此你們有建議或者更好的工具均可以提出了瀏覽器

主要功能

Prophecy Book 是基於功能塊來進行使用的，因此在一個book裏面你能看到的，都是塊（section），這樣也方便各類的新模塊加入。markdown

文本塊

說到文本就是markdown了，因此pbook採用了markdown來更快的作文本格式的安排。在平時，文本塊是按照編譯之後的樣式展現的。antd

在雙擊之後，markdown就會進入編輯狀態。異步

代碼塊

代碼塊是經過書寫js代碼來進行階段性數據處理的地方，在這裏，我設置了數據當前上下文和全局上下文的概念。

在此，咱們有如下全局變量

function set(name, value) {/*設定數據*/}
function get(name, value) {/*獲取數據*/}
function end() {/*結束當前代碼運行*/}
import tf from '@tensorflow/tfjs'
複製代碼

set和get均是在全局上下文裏操做數據，每個代碼塊是一個單獨的當前上下文。

有end函數是由於，代碼自己若是有異步操做是沒法探知代碼結束這樣的一個時間點的，因此每個代碼塊都有一個end函數來知會代碼執行過程完成

其他的就是正常的js代碼書寫。執行成功後代碼在當前上下文set的數據會被打出log，若是有錯誤，那麼log打出來的是錯誤緣由。

在雙擊代碼塊後，能夠只運行當前塊。

Chart塊

有一堆數據其實也不知道要幹什麼，因此咱們須要更直觀的形式來可視化數據，這裏直接用了g2來進行可視化。目前只推出了冒泡圖，以後會支持更多

Chart塊經過腳原本進行數據轉化。下面這段代碼，展現的如何讓before和after的數據格式化到制定的格式

let before = get('before')
let after = get('after')
let ys = get('ys')
let data = []

before.map((e, i) => data.push({
	x: e, y: ys[i], type: 'before'
}))

after.map((e, i) => data.push({
	x: e, y: ys[i], type: 'after'
}))

set('data', data)
end()
複製代碼