📢 #1 Visual Studio Code Data Preview 🈸
Tags: showdev, vscode, data, preview
Published: 2019-11-08 11:55:43

---
title: 📢 #1 Visual Studio Code Data Preview 🈸
published: true
description: vscode dev tool for viewing 🔎 slicing 🔪 dicing 🎲 & charting 📊 data
tags: #showdev #vscode #data #preview
---

[Data Preview 🈸](https://marketplace.visualstudio.com/items?itemName=RandomFractalsInc.vscode-data-preview) extension for importing 📤 viewing 🔎 slicing 🔪 dicing 🎲  charting 📊 & exporting 📥 **large** JSON array/config, YAML, Apache Arrow, Avro & Excel data files with [Perspective](https://perspective.finos.org/) - streaming data analytics WebAssembly library.

Data Preview 🈸 example using `dark` UI theme with `d3fc` Charts 📊 Data View `config`, viewing [superstore](https://github.com/finos/perspective/blob/master/examples/simple/superstore.arrow)`.arrow` data file :)

![Data Preview Dark](https://github.com/RandomFractals/vscode-data-preview/blob/master/images/vscode-data-preview-dark.png?raw=true 
"Data Preview Dark")

Data Preview 🈸 is capable of loading a few 10+MB's large data files with 100+K records & an extensive list of [supported Data Formats](https://github.com/RandomFractals/vscode-data-preview#supported-json-config-binary--excel-data-file-formats) you'll be hard-pressed to find on [VSCode marketplace](https://marketplace.visualstudio.com/search?term=data&target=VSCode&category=All%20categories&sortBy=Relevance) in one extension. 

# 🈸 Features

- Preview `.json` `.arrow` `.avro` `.yml` `.csv/.tsv` & `.xlsx/.xlsb` data files in a Data Grid w/Sorting & Filtering
- Grid Data Summary display w/Aggregate Functions, Row & Column Pivots (a.k.a. `Group By` & `Split By`)
- Basic Charts 📊 creation w/Aggregate Functions, Row & Column Pivots
- Pluggable Charting 📊 libraries for bult-in Charts: [d3fc](https://d3fc.io/) || [highcharts](https://www.highcharts.com/demo)
- Persistent Data Preview Settings (View, Sort, Filter, Pivots, etc.) for restore of open Data View panels on VSCode Reload
- Mulptiple Spreadsheets Data Preview for `Excel` data files
- Markdown tables data preview for `.md` documentation files
- Data `.schema.json` generation for Arrow & Avro Data Schema Text Previews in JSON format 
- Binary Data files `.json` generation for Arrow, Avro & `Excel` formats for Text Data Preview
- Property Grid display for `.json` `.config` `.env` `.properties` `.ini` & `.yml` configuration files
- Open Data Preview on Side option for slim data || config files
- Quick Launch new Data Preview input box for data files in open workspace
- Save Filtered Data Grid || Chart 📊 Data in `.arrow` `.csv` `.json(s)` `.yml` & `.properties` formats
- Save & Load Data View `.config` options
- Dark & Light Data Preview 🈸 Panel Themes

# 🔗 Github Repo

https://github.com/RandomFractals/vscode-data-preview

🌟 that github repo if you like this approach for data preview in vscode.

# 📥 Installation

Install [Data Preview](https://marketplace.visualstudio.com/items?itemName=RandomFractalsInc.vscode-data-preview) 🈸 via vscode Extensions tab (`Ctrl+Shift+X`) by searching for `data` || via [VSCode marketplace search results](https://marketplace.visualstudio.com/search?term=data&target=VSCode&category=All%20categories&sortBy=Relevance). 

It's the 1st extension on that list when you search for `data` 😉

# 👀 other [#dataPixy](https://twitter.com/search?q=%23dataPixy&src=typed_query) 🧚‍♂️ [#dataViz](https://marketplace.visualstudio.com/search?term=dataViz&target=VSCode&category=All%20categories&sortBy=Relevance) 📈 📊 devTools

https://marketplace.visualstudio.com/publishers/RandomFractalsInc

# & more info here: 

{% twitter 1178344438885687297 %}

# + just for fun :)

{% twitter 1192831391421075457 %}

# also 👀 posts [#2](https://dev.to/tarasnovak/visual-studio-code-vega-viewer-5gi6), [#3](https://dev.to/tarasnovak/3-charts-in-vscode-5gk8), & [#4](https://dev.to/tarasnovak/4-vscode-extension-stats-tool-46i8) in these #dataPixy 🧚‍♂️ #data/#charts, #maps & #graphs #devTools in #vscode mini series:

{% link https://dev.to/tarasnovak/visual-studio-code-vega-viewer-5gi6 %}

{% link https://dev.to/tarasnovak/3-charts-in-vscode-5gk8 %}

{% link https://dev.to/tarasnovak/4-vscode-extension-stats-tool-46i8 %}

Cheers! :)