vzi

維茲

vzi是 viz 的精神繼承者

vzi命令列（現在）使用 deno 實現，渲染需要 Chrome DevTools 協定。 vzi僅針對 Mac 進行了測試，儘管它應該可以在 Linux 上正常工作（只需告訴它 Chrome 二進位檔案的路徑）。

關於

我們中的許多人已經使用命令列數十年了。命令列介面的成功與Unix管道的想法密切相關。管道使我們能夠根據我們正在操作的輸入資料的需求動態組合複雜的函數。為此，shell 是人類迄今為止發明的用於指令機器的最高頻寬輸入機制。

然而，我們沒有好的方法將資料傳輸到我們花費大量時間的另一個高度動態的環境：瀏覽器。 vzi的目標是彌補這一差距，因此我們可以將基於網路的合成作為我們珍視的數據管道的一部分。

在終端中查看數據時，我們通常沒有很好的方法來解釋它，但透過一些輕微的轉換，我們的眼睛能夠理解深層的模式。給定包含緯度和經度座標的資料來源，探索該資料的自然方法是使用地圖。您可以透過將資料透過管道傳遞給vzi來做到這一點，例如：

 $ your data source | vzi -m scatter -d 'y=lat($[0])' -d 'x=lng($[1])' -d c=2

以下是使用上述指令產生的狀態螢幕截圖，其中資料行的格式為latitude longitude language ：

vzi在任何給定時間產生的實際報告狀態是一個完整且成熟的網頁，比靜態圖像豐富得多。如果您選擇，可以儲存最終（或中間）報告狀態，或者您可能只是希望在瀏覽器內暫時與其交互，而忽略輸出。無論哪種方式， vzi都使數據分析會議變得更加有趣和高效。

另一種內建的視覺化類型是儲存bucket模組。以下是該命令產生的報告的螢幕截圖：

 $ bin/gen-yxz | vzi -m hist -d c=2

模組可以互相重複使用程式碼。上面的命令實際上相當於以下命令：

 $ bin/gen-yxz | vzi -m bucket -d c=2 -d orderBy=freq

scatter和bucket模組相當通用，可以在許多情況下發揮巨大作用。然而，編寫其他管道模組很容易，而且這樣做實際上是一個非常有趣的練習。

安裝

首先，安裝 Chrome Canary。這不是嚴格要求的，但它是目前使用vzi 的最佳和最簡單的方法。

您可以使用 deno 全域安裝命令列工具：

 deno install -A -f https://raw.githubusercontent.com/jflatow/vzi/master/bin/vzi

對於開發人員來說，更好的方法是克隆儲存庫並安裝它：

 $ git clone https://github.com/jflatow/vzi.git
$ cd vzi && make install

快速測試是否有效：

 $ vzi

它應該在瀏覽器中打開一個視窗。如果沒有，您可能需要使用-b選項來告訴vzi瀏覽器可執行路徑在哪裡。有關選項的完整清單： vzi -h 。

如果 Canary 已經啟動而沒有打開遠端偵錯端口，則當vzi請求新頁面（即/json/new ）時，您可能會收到錯誤訊息。在這種情況下，只需退出 Chrome 並讓vzi按其想要的方式啟動它，或者在連接埠開啟的情況下自行重新開啟它。 vzi使用的預設連接埠是9222 ，但您可以使用-p選項指定它。

在瀏覽器視窗仍然開啟的情況下，您可以在向瀏覽器開啟的標準輸入管道上鍵入訊息：

 > hello, world!

確保在末尾輸入換行符，以便該行完整。返回開啟的瀏覽器窗口，您應該在文件正文中看到您的訊息。輸入任意多行，每一行都會更新文件。完成後，使用^D關閉管道。

如果您已經複製了vzi repo 目錄，您可以從其中嘗試以下操作：

 $ bin/gen-yxz | vzi -m scatter -d c=2

用法

預設情況下， vzi將在stdout上產生單一最終報告文件。由vzi （透過Chrome ）執行的管道定義了收到新事件時瀏覽器狀態會發生什麼。

有三種方法告訴vzi如何執行它的管道：

1. 將包含處理程序的檔案名稱作為參數傳遞
2. 使用-c, --cli選項直接傳遞腳本
3. 使用-m, --module選項傳遞內建模組的名稱

 $ cat events | vzi pipe.js
$ cat events | vzi -c '...'
$ cat events | vzi -m module

如果給予-K, --keep-alive選項， vzi將不會嘗試關閉瀏覽器。 -OK可以一起使用以實現安靜的互動式會話。

如果給出-O, --no-output選項，輸出將被停用。如果給出-o, --output選項， vzi將在每批事件之後將其報告狀態寫入輸出路徑。透過這種方式，人們可以觀察輸出檔案的變化，以便觀察管道的最新狀態（例如，當無頭運行時）。如果-o和-O均未指定，則僅將最終狀態寫入stdout 。

 $ cat events | vzi pipe.js -O
$ cat events | vzi pipe.js -o report.html
$ cat events | vzi pipe.js > report.html

也可以使用-p, --port選項來控制vzi用來呈現事件的機制。如果給定，則假定該連接埠使用 DevTools 有線協定（例如啟用了遠端偵錯的瀏覽器）。如果未給予-p選項， vzi將建立自己的瀏覽器進行渲染。

 $ cat events | vzi pipe.js
$ cat events | vzi pipe.js -p PORT
$ cat events | vzi pipe.js -p PORT > report.html

可以給-H, --headless選項來強制vzi創建無頭瀏覽器。這需要一個能夠無頭運行的瀏覽器（注意：撰寫本文時的Chrome Canary ）。

 $ cat events | vzi pipe.js -H

無頭運行被認為是相當高級的操作模式，儘管它效果很好。一般來說，瀏覽器有兩種操作模式：附加模式和分離模式。當你獨立運行時（預設情況下，如果不是無頭的話），事情會更容易、更順利地開始。尤其是當你沒有無頭跑步時，因為你可以清楚地看到發生了什麼。在附加模式下，中斷最終會殺死瀏覽器，因此除非您發送正確的 EOF，否則您將不會獲得輸出報告。如果沒有 headless，這仍然沒問題，因為您仍然可以在瀏覽器中看到產生的輸出。但是，當您在附加的無頭模式下運行時，您通常不希望透過管道傳輸無限流。這是因為如果沒有 EOF，您將無法正常終止進程，因此您既不會看到輸出，也不會得到報告。

如果不了解該工具的工作原理，一些可用選項可能會令人困惑。整體設定複雜但簡單。一旦了解了 DevTools 的實現，就會開啟一個頁面，並透過 Chrome 偵錯協定之上的一層發送事件。在此上下文中，執行使用者定義的管道處理程序函數。

管道

vzi提供了兩個關鍵介面。一是如何產生輸出報告的規格。另一個是使用者定義函數運行的環境以及使用的回調。我們將在此環境中執行的使用者定義邏輯稱為管道。該管道處理其內部運行的Unix管道的可視化邏輯。

管道介面目前在index.js 中定義。最好的例子是內建模組，這裡按複雜性順序列出：

• 迴音
• 速度
• 桌子
• 歷史
• 桶
• 分散
• 桑基

範例

假設您已經克隆了存儲庫，那麼您可以嘗試以下一些其他快速示例：

 bin/gen-yxz | vzi -m scatter -d y='log($[0])' -d ys='exp(_)'
bin/gen-line | vzi -m hist -d v=1 -d k='second((new Date - 0) / 1000, 3)'