【VSCode】データを可視化するプラグイン「SandDance/Excel Viewer/RainbowCSV」の紹介

スポンサーリンク
VisualStudioCodeの便利プラグイン DevTools

Visual Studio Code(以降VSCode)をお使いになられたことはありますでしょうか。

非常に多機能でありながらもオープンソースなコードエディタとして、快適なプログラミング環境を提供してくれます。

例えば、VSCodeの主な機能として

VSCodeのエディタとしての機能
  • シンタックスハイライト
  • InteliSense
  • デバッグ機能
  • 拡張機能を使ってカスタマイズ

などといったことができるようになります。

これらの中でも特に秀逸なのは拡張機能(プラグイン)です

拡張機能を使ってユーザの嗜好にあったカスタムツールに仕上げることができることが他のコードエディタにはないVSCodeの最大の特徴ともいえるでしょう。

そこで今回の記事ではコードエディタという本来の機能から少し異なる使い方、データ分析や可視化」といったデータサイエンスに役立つプラグイン(拡張機能)の紹介します。

きっと単なるなるコードエディタの枠に収まることのないVSCodeの魅力を再発見することができるはずですよ。

スポンサーリンク

1. プラグインの導入方法

VSCodeでのプラグインの導入手順は次のとおりです。

拡張機能アイコンを選択する( Ctrl+Shift+X )()し、Marketplaceの検索窓で拡張したいプラグインを検索します()。

検索にヒットした候補一覧が表示されるので目当ての物を探します。()そして、右側のウィンドウで詳細を確認したらインストールを押下し有効にすることでプラグインを導入することができるようになります。

VScodeの拡張機能の使い方
図1. 拡張機能の導入手順

Marketplaceで導入することができるプラグイン一覧は次の公式サイトを参照してください。有料版のものもありますが、無料で使えるプラグインも多くあります。

Visual Studio Code Marketplace: 公式サイト

https://marketplace.visualstudio.com/vscode
スポンサーリンク

2. データサイエンス向け便利プラグイン

Python_基本文法_内包表記

データサイエンスでは、表計算ソフト、BI(ビジネスインテリジェンス)ツール、JupyterNotebook環境などさまざまツールを使いこなす必要がありまが、それをサポートしてくれる便利プラグイン(拡張機能)を紹介します。

2.1 Rainbow CSV

機械学習などで使うデータセットはCSVファイルやTSVファイル形式で作られているケースが多分にあると思います。

これらはカンマ(,)やタブなどで区切られたデータが羅列されるだけなので (例えば図3左の例のように)位置ずれがあったり、何個目の属性を示すデータなのか分からなくなることがあります。(特に属性数(カラム数)が多いデータがそうです。)

この「Rainbow CSV」を導入すると、属性項目ごとに自動で色分けしてくれてかつ、データにマウスをかざすと属性情報も表示してくれます。(図3右)

公式サイトは次のURLですので詳細を確認してください。

Rainbow CSV:公式サイト

https://marketplace.visualstudio.com/items?itemName=mechatroner.rainbow-csv
VScodeの拡張機能_Rainbow CSVのロゴ
図2. Rainbow CSV
VScodeの拡張機能_Rainbow CSVの使用例
図3. Rainbow CSVの機能紹介(左:適用前 右:適用後)

Rainbow CSVはプラグインを有効設定にするだけで全てのcsvファイルに適応されます。

2.2 Excel Viewer

Rainbow CSVに続きCSVファイル関連のプラグインです。「Excel Viewerを適用することで無味乾燥に見えるデータの並びなCSVファイルの中身をExcelのように表示してくれるようになります。

公式サイトは次のURLですので詳細を確認してください。

Excel Viewer:公式サイト

https://marketplace.visualstudio.com/items?itemName=GrapeCity.gc-excelviewer
VScodeの拡張機能_Excel Viewerのロゴ
図4. Excel Viewer

使い方はまず、対象のデータ選択して 右クリック して()、Open Preview( Ctrl+Shift+V )を選択します。()無効にしたい場合はもう一度同じ操作をすることで元に戻ります。

VScodeの拡張機能_Excel Viewerの使い方1
図5. Excel Viewer有効無効の切替

また、Excelのような表示スタイルや列でのフィルタリング抽出や検索をすることができるようになります。(,)

VScodeの拡張機能_Excel Viewerの使い方2
図6. Excel Viewerの使用例(左:適用前 右:適用後)

2.3 SandDance for VSCode

次にマイクロソフトリサーチが提供しているBIツール「SandDance for VSCode」を紹介します。

Webベースで動作するツールでグリッド、カラム、分布、密度など様々な角度でデータ分析をすることができます。3Dで可視化し視点をマウスのドラッグで360°自由な角度からデータ分析ができる優れものです。

公式サイトは次のURLですので詳細を確認してください。

SandDanceの公式サイトの引用

https://www.microsoft.com/en-us/research/project/sanddance/
VScodeの拡張機能_SandDanceのロゴ
図7. SandDance for VSCode

ツールの起動は、対象のデータ選択して クリック して()、View in SandDance を選択することでWebブラウザの別シートにアプリが表示されます。()

VScodeの拡張機能_SandDanceの使い方0
図8. SandDance for VSCodeの起動

それでは、簡単にツールの使い方の概要を説明していきます。(詳細な機能については公式サイトを適宜参照してください。)

2.3.1 Chartタブ

Chartタブ を選択します。

グラフとデータの属性の設定を行います。()

VScodeの拡張機能_SandDanceの使い方1
図9. 国内のとある職種に就く人数を表す散布図
項目設定内容
図の種類の選択 ()Grid / Bar / Scatter / Treemap / Density ・・・
COLUMN MAPPING ()X-axis(X軸の値) / Y-axis(Y軸の値) / Z-axis(Z軸の値) (Zは3D設定時のみ)
Color by ()データ色付け / 比較対象データの選択
CHART OPTIONS ()PointScale(棒の太さなど) / Zgrounded(プロット,四角柱の切替えなど)
ショートカットメニュー ()戻す / スクリーンショット / 進む / 2D / 3D切替 / 表示位置の初期化
表1. Chartタブの設定項目(※内容は一例)

2.3.2 Chart Colorタブ

Chart Colorタブ を選択します。

色や凡例の分類設定を行います。()

VScodeの拡張機能_SandDanceの使い方2
図10. グラデーションの設定
項目設定内容
Scheme/Color reverse ()グラデーションパターンの色(反転)の選択
SColor bin count ()色の凡例数(グラデーションパターン数)
表2. Chart Colorタブの設定項目(※内容は一例)

2.3.3 Databrowseタブ

Databrowseタブ を選択します。

可視化対象の個別データを確認できます。()

VScodeの拡張機能_SandDanceの使い方3
図11. Databrowseタブ

2.3.4 Select by searchタブ

Select by searchタブ を選択します。

目的の値が可視化した図のどの位置にあるかを、属性値、演算子値などを使って細かく条件を設定しデータを検索することができます。(,左)

Snapshotsタブ では作成した図を保存することができます。(右)

VScodeの拡張機能_SandDanceの使い方4
図12. Select by searchタブ
VScodeの拡張機能_SandDanceの使い方5
図13. Snapshotsタブ

2.3.5 chartssettingsタブ

chartssettings タブ を選択します。

軸やスケール・凡例といったその他詳細設定ができます。()

VScodeの拡張機能_SandDanceの使い方6
図14. chartssettingsタブ
項目設定内容
Mark opacity ()図の透明度の設定
Z AXIS OPTIONS ()z軸の属性の調整(対y軸、対基準)
TEXT OPTIONS ()軸ラベルの大きさと角度の調整
CHART CANVAS ()軸と凡例の表示・非表示の設定
表3. chartssettingsタブの設定項目(※内容は一例)
スポンサーリンク

3. まとめ

いかがでしたでしょうか?

今回はVSCodeで導入可能なデータサイエンス向けプラグイン(拡張機能)を紹介しました。csvデータを色分けし、Excel調にして可読性を良くしたり、2D/3Dでグラフィカルな分析VSCode内でコード開発と一貫しておこなえるのは非常に便利だと思います。

たんなるコードエディタの域に収まることのないカスタマイズが本格的に行えるのがVSCodeの魅力です。今回紹介したもの以外にもさまざまなプラグインがありますので、あったらいいなぁと思える追加機能を探してみましょう。

最後までお読みいただきありがとうございました。

タイトルとURLをコピーしました