Hello Charts 為塊編輯器推出原生圖表構建體驗

Luke Carbis 和 Rob Stinson 是 WP Engine 於 2020 年組建的三人 Block Lab 團隊中的兩個，他們在一個新項目上重歸於好。 這一次，拜倫·基特加入了他們的行列。 這三人正在通過一套名為 Hello Charts 的塊來佔據 WordPress 圖表空間。

“有些人在黑色星期五推出交易，”該團隊上週在自 7 月以來的第二條推文中寫道。 “我們正在推出一個完整的產品！”

Carbis 指出，團隊努力創建一個塊編輯器原生插件。 沒有管理屏幕或設置頁面，用戶只需在編輯器中工作。

網站主頁上的營銷材料聲稱，Hello Charts 是“第一個首先構建塊編輯器的圖表插件”。 然而，SB Charts 已經存在了將近一年，而 Chart Block 幾週前就登陸了 WordPress 插件目錄。 支持 CSV 導入的古騰堡 Charts Blocks 於半年前首次發布，但此後一直沒有更新。

聲稱自己是第一，也許是營銷上的失誤。 我立即發現它的唯一原因是我一直在密切關注類似的插件一段時間，希望為塊編輯器找到一個不錯的圖表解決方案。 雖然 Hello Charts 在技術上可能不是第一個登陸的，但它提供了迄今為止最好的用戶體驗。

在大多數情況下，我依賴條形圖和折線圖。 但是，該插件總共提供了五種塊類型：

• 條形圖
• 折線圖
• 餅形圖
• 極地區域圖
• 雷達圖

在輸入數據和自定義輸出時，每一個的工作方式幾乎相同。 有一些特定於每種類型的選項和控件。 此外，用戶可以通過單擊按鈕從一個圖表塊轉換到另一個圖表塊並再次返回，而不會丟失數據。

在熟悉了選項後，我按月構建了三年產品銷售數據圖表。 我從最有意義的條形圖塊開始。 每個塊都有一個“編輯圖表數據”按鈕。 單擊它會在屏幕上打開一個覆蓋層，其工作方式類似於典型的電子表格程序。

用戶可以在每個單元格中使用標籤，添加數據並創建新的數據集或行。 通過單擊省略號按鈕，可以選擇在之前/之後復制數據集或添加新數據集。 對於那些自高中計算機課以來就沒有花很多時間使用電子表格軟件的人來說，這一切都感覺很簡單。

幾分鐘後，我有一個條形圖。 我需要做的就是調整它以使用我的主題顏色。

該插件的自定義選項很豐富，但足夠平衡，不會變得霸道。 我只是想讓它與我的主題設計相匹配，而不需要大驚小怪，而且很快就實現了。

我使用現有數據向編輯器添加了折線圖塊。 我需要做的唯一調整是“曲線”選項。 我希望我的線條看起來筆直而不是波浪狀流動。 我已經在想，在我知道我當時甚至需要它之前，團隊是否已經想到了一切。

為了更好地衡量，我測試了餅圖塊。 這是一種圖表類型，我可能會偶爾使用它。 總的來說，它的表現和其他人一樣好。

我錯過的功能是在屏幕上打印每個餅圖段的數據。 數據可通過懸停或焦點彈出窗口獲得，但訪問者無法一次看到所有細分數據。

誠然，我沒有花太多時間在極地區域圖和雷達圖塊上。 我對它們的體驗在現實世界的場景中是不存在的，所以我對是否有其他人可能想要的功能沒有一個堅實的把握。 我只是對它們進行了測試以確保它們有效。 像集合中的其他塊一樣，我沒有遇到任何問題。

我希望看到一個標題或標題選項集成到插件的塊中。 但是，兩者都可以通過標題或段落塊輕鬆添加。 為了匹配背景，包裹在 Group 塊中會有所幫助，如以下屏幕截圖所示：

其他一些受歡迎的功能是 X 和 Y 軸線的顏色選項以及數據文本以及塊間隙或邊距支持。 圖例間距有些不足，通常與圖表輸出太接近。 它有幾個定位選項，但它需要一些額外的空白，尤其是當它位於頂部或底部時。

總的來說，我找不到太多可抱怨的地方。 Hello Charts 是一個插件，我會推薦給任何需要圖表解決方案的人，該解決方案的工作方式類似於為 WordPress 塊系統構建的圖表解決方案。

採購流程和設置

您可以從當前的免費塊插件中獲得一些好處，但 Hello Charts 非常值得升級價格。 它的價值甚至可能被低估。 如果團隊建立在 CSV 導入中，那將是徹頭徹尾的偷竊。

用戶可以以 4 美元的價格單獨購買五種單獨的塊類型，或者以 16 美元的價格升級以獲得全部。 這些為沒有支持的單個站點提供終身更新。 無限站點和一年的支持有更高的 199 美元等級。

用戶必須安裝一個插件。 每個塊類型都捆綁在插件中。 從技術上講，用戶正在購買一個許可證密鑰來激活每一個。

Carbis 向我提供了折扣代碼，以測試此購買流程的運作方式並提供反饋。 該團隊希望採用不同的方式購買塊。 與其為用戶創建一個全有或全無的交易，他們可以只購買他們實際需要的東西。 “因此，如果您需要條形圖，只需購買條形圖塊，”Carbis 說。 “或者您可以將所有圖表類型作為一個集合。”

我通過採購流程沒有任何問題。 我從條形圖開始，這是我比其他塊更經常需要的塊。 然後，我升級到了整套。

起初我唯一遇到的問題是弄清楚如何激活許可證，因為插件沒有設置頁面。 許可證字段實際上位於插件管理屏幕上。

為每種塊類型設置單獨的許可證的缺點是用戶必須輸入一個密鑰，提交它，等待頁面重新加載，向下滾動到插件，然後使用另一個許可證重新開始。 這個過程非常痛苦，以至於我想放棄測試我不感興趣的圖表類型。但是，我繼續前進，一個又一個地輸入許可證密鑰。

是的，我誇大了一點，但是一次輸入多個許可證密鑰或不等待頁面加載會容易得多。 這恰好是體驗的一部分，沒有達到插件其餘部分設定的標準。