今天要為大家推薦一套超酷炫的，用于構(gòu)建神經(jīng)網(wǎng)絡(luò) 3D 可視化應(yīng)用的框架——TensorSpace。

有什么用途？

大家可以使用類 Keras 風(fēng)格的 TensorSpace API，輕松創(chuàng)建可視化網(wǎng)絡(luò)、加載神經(jīng)網(wǎng)絡(luò)模型并在瀏覽器中基于已加載的模型進(jìn)行 3D 可交互呈現(xiàn)。 TensorSpace 可以使您更直觀地觀察神經(jīng)網(wǎng)絡(luò)模型，并了解該模型是如何通過(guò)中間層 tensor 的運(yùn)算來(lái)得出最終結(jié)果的。 TensorSpace 支持 3D 可視化經(jīng)過(guò)適當(dāng)預(yù)處理之后的 TensorFlow、Keras、TensorFlow.js 模型。

圖1：使用TensorSpace 創(chuàng)建交互式 LeNet 模型

▌TensorSpace 使用場(chǎng)景

TensorSpace 基于 TensorFlow.js、Three.js 和 Tween.js 開(kāi)發(fā)，用于對(duì)神經(jīng)網(wǎng)絡(luò)進(jìn)行3D可視化呈現(xiàn)。通過(guò)使用 TensorSpace，不僅僅能展示神經(jīng)網(wǎng)絡(luò)的結(jié)構(gòu)，還可以呈現(xiàn)網(wǎng)絡(luò)的內(nèi)部特征提取、中間層的數(shù)據(jù)交互以及最終的結(jié)果預(yù)測(cè)等一系列過(guò)程。

通過(guò)使用 TensorSpace，可以幫助您更直觀地觀察并理解基于 TensorFlow、Keras 或者 TensorFlow.js 開(kāi)發(fā)的神經(jīng)網(wǎng)絡(luò)模型。 TensorSpace 降低了前端開(kāi)發(fā)者進(jìn)行深度學(xué)習(xí)相關(guān)應(yīng)用開(kāi)發(fā)的門檻。 我們期待看到更多基于 TensorSpace 開(kāi)發(fā)的3D可視化應(yīng)用。

交互：使用類 Keras 的API，在瀏覽器中構(gòu)建可交互的 3D 可視化模型。

直觀：觀察并展示模型中間層預(yù)測(cè)數(shù)據(jù)，直觀演示模型推測(cè)過(guò)程。

集成：支持使用 TensorFlow、Keras 以及 TensorFlow.js 訓(xùn)練的模型。

▌使用方法

安裝

第一步: 下載 TensorSpace.js

我們提供了三種下載 TensorSpace.js 的方法，它們分別是 npm、yarn 以及 來(lái)自官方網(wǎng)站。

途徑 1: NPM

途徑 2: Yarn

途徑 3:官方網(wǎng)站下載

https://tensorspace.org/index_zh.html#download

第二步: 安裝依賴庫(kù)

請(qǐng)?jiān)谑褂?TensorSapce.js 之前，引入TensorFlow.js、Three.js、Tween.js和TrackballControl.js至所需要的 html 文件中，并置于 TensorSpace.js 的引用之前。

第三步: 安裝 TensorSpace.js

將 TensorSpace.js 引入 html 文件中：

▌模型預(yù)處理

為了獲得神經(jīng)網(wǎng)絡(luò)中間層的運(yùn)算結(jié)果，我們需要對(duì)已有的模型進(jìn)行模型預(yù)處理?；诓煌?a target="_blank">機(jī)器學(xué)習(xí)庫(kù)，我們提供了TensorFlow 模型預(yù)處理教程、Keras 模型預(yù)處理教程以及TensorFlow.js 模型預(yù)處理教程。

▌使用

在成功安裝完成 TensorSpace 并完成神經(jīng)網(wǎng)絡(luò)模型預(yù)處理之后，我們可以來(lái)創(chuàng)建一個(gè) 3D TensorSpace 模型。

為了簡(jiǎn)化步驟，請(qǐng)隨意使用我們?cè)贖elloWorld路徑下所提供的資源。我們將會(huì)用到適配 TensorSpace 的預(yù)處理模型以及樣例輸入數(shù)據(jù)（“5”）作為使用樣例來(lái)進(jìn)行說(shuō)明。所有的源碼都可以在helloworld.html文件中找到。

首先，我們需要新建一個(gè) TensorSpace 模型實(shí)例：

然后，基于 LeNet 網(wǎng)絡(luò)的結(jié)構(gòu)：輸入層 + 2 X (Conv2D層 & Maxpooling層) + 3 X (Dense層)，我們可以搭建其模型結(jié)構(gòu)：

最后，我們需要載入經(jīng)過(guò)預(yù)處理的 TensorSpace 適配模型并使用init()方法來(lái)創(chuàng)建模型對(duì)象：

我們可以在瀏覽器中看到以下模型：

圖2- 所創(chuàng)建的 LeNet 模型 (無(wú)輸入數(shù)據(jù)）

我們可以使用我們已經(jīng)提取好的手寫“5”作為模型的輸入：

我們?cè)谶@里將預(yù)測(cè)方法放入init()的回調(diào)函數(shù)中以確保預(yù)測(cè)在初始化完成之后進(jìn)行(在線演示)。

在線演示地址：

https://tensorspace.org/html/helloworld.html

可以在下面的地址的 CodePen 中試一下這個(gè)例子。

https://codepen.io/syt123450/pen/YRwZGg

圖3：LeNet 模型判別輸入“5”

▌樣例展示

LeNet

AlexNet

Yolov2-tiny

ResNet-5

Vgg16

ACGAN

MobileNetv1