Skip to content

etienneschalk/scientific-data-viewer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

Scientific Data Viewer - VSCode Extension

Scientific Data Viewer Icon

An extension to explore the metadata of scientific data files within your IDE, including NetCDF, Zarr, HDF5, GRIB, GeoTIFF and JPEG-2000.

Current Version: v0.5.0 โ€ข Release Notes

Available on: VSCode Marketplace โ€ข Open VSX Registry

Getting Started

๐Ÿš€ Features

  • Multi-format Support:
Format File Extension
NetCDF .nc, .netcdf, .nc4, .cdf
Zarr .zarr
HDF5 .h5, .hdf5
GRIB .grib, .grib2, .grb
GeoTIFF .tif, .tiff, .geotiff
JPEG-2000 .jp2, .jpeg2000
  • Python Integration: Automatic Python environment detection and management
  • File Tree Integration: Right-click on supported files in the explorer to open them
  • Custom Editors: Direct file opening with dedicated editors
  • Interactive Data Explorer: Browse file structure, dimensions, variables, and attributes
  • Browse Variable Information: View variable dimension names, data types, shapes, and memory usage
  • Basic Data Visualization: Create plots and visualizations directly in VSCode (experimental, best effort)
  • Enhanced GeoTIFF Support: Multi-band GeoTIFF files automatically convert bands to separate variables for improved readability and plotting
  • HTML Report Export: Export complete data viewer content as self-contained HTML reports for sharing and documentation
  • Command Palette Integration: Multiple commands for data viewer operations
  • Status Bar Integration: Shows current Python interpreter status
  • Human-readable File Sizes: Display file and variable sizes in appropriate units (B, kB, MB, GB, TB)
  • Easy Settings Access: Ctrl+Shift+P โžœ Scientific Data Viewer: Show Settings
  • Error Handling: Robust error handling with user-friendly messages
  • Experimental Features: Configurable experimental features with clear warnings

๐Ÿ“ธ Screenshot Gallery

Data Visualization and Plotting

Light theme TIF file plot

Light theme: GeoTIFF data visualization with plotting capabilities

Dark theme TIF file plot

Dark theme: GeoTIFF data visualization with plotting capabilities

Light theme TIF file plot opened

Light theme: GeoTIFF plot in opened/expanded state

Data Structure Exploration

Light theme NetCDF xarray representation

Light theme: NetCDF file with xarray HTML and text representation

Light theme Zarr tree view

Light theme: Zarr dataset tree view with variable focus

๐Ÿ“ฆ Installation

  1. Install from VSCode Marketplace:

    • Open VSCode
    • Go to Extensions view (Ctrl+Shift+X)
    • Search for "Scientific Data Viewer"
    • Click Install
  2. Install required Python dependencies: (prompted by extension)

    pip install xarray matplotlib
  3. Install optional Python dependencies: (prompted by extension)

    pip install netCDF4 h5py rioxarray cfgrib zarr
  4. Open a supported file ๐ŸŽ‰

โš™๏ธ Prerequisites

Before using this extension, you need either Python 3.13 or uv installed on your system.


With Python 3.13:

The extension will prompt you to install the following packages if they are not available:

  1. Required Python packages:
    • xarray
    • matplotlib
  2. Optional Python packages:
    • netCDF4
    • h5py
    • rioxarray
    • cfgrib
    • zarr

Note: Former Python versions may work, but it is not guaranteed nor supported.


With uv, the extension will create and manage its own python environment, indluding the Python version 3.13. The environment wil be stored in the extension dedicated storage, provided by VSCode or Cursor.

๐ŸŽฏ Usage

๐Ÿ Configuring Python Environment

The extension supports multiple ways to configure your Python environment:

  1. Python Extension Integration (Default behaviour):

  2. Extension Virtual Environment (Semi-Standalone):

    • Opt-in setting:
      • Press Ctrl+Shift+P (open command palette)
      • Type "Scientific Data Viewer: Show Settings"
      • Check "Scientific Data Viewer > Python > Use Extension Own Environment"
    • uv Required:
      • Consult the documentation: uv installation
      • If uv is installed and found: The extension creates its own isolated environment once the setting enabled, including Python 3.13 installation
      • If uv is not available, falls back to Python extension default behavior
    • Manage Extension Environment:
      • Press Ctrl+Shift+P (open command palette)
      • Type "Scientific Data Viewer: Manage Extension Virtual Environment"
      • Choose a command: create, update, delete, view information
    • Benefits of this approach:
      • Python 3.13: Uses uv to install and use Python 3.13 for optimal performance
      • Self-Contained: Works without external Python environment setup
      • Isolated: Won't interfere with your other projects
      • Storage: Stored in VSCode's extension storage space

๐Ÿ“‚ Opening Data Files

  1. Click on file from File Explorer:

    • Click on any supported file in the File Explorer
    • File opens directly in the Scientific Data Viewer
    • Command "View: Split Editor" is supported
  2. Drag and drop from File Explorer

    • Drag and drop any supported file (or folder)
    • File (or folder) opens directly in the Scientific Data Viewer
      • Multiple files (or folders) can be opened at once if they are selected
    • Command "View: Split Editor" is supported
  3. Context menu from File Explorer:

    • Right-click on any supported file (or folder)
    • Select "Open Scientific Data Viewer" for single file or folder
    • Select "Open Scientific Data Viewer for Selection" to open multiple selected multiple files or folders
    • Command "View: Split Editor" is NOT supported
  4. From command palette:

    • Press Ctrl+Shift+P
    • Type "Open Scientific Data Viewer" (or "Open Scientific Data Viewer (Folder)")
    • Select a file (or folder) from the file picker
      • Multiple files (or folders) can be opened at once if they are selected
    • Command "View: Split Editor" is NOT supported

Note: the only current way to get access to the split editor for Zarr folders is drag and drop.

๐Ÿ”ฌ Exploring Data

You can explore the data via the editor itself, or via the Data Structure tree view displayed on the VSCode's left pane.

The data viewer editor shows:

  • File Information: Path, size, format, and basic metadata
  • Xarray HTML and Text Representations: Users that are used to xarray will be happy to see the well-known views. Uses DataTree or Dataset representation, depending on the file format.
  • Xarray HTML and Text Representations (for each group): Relevant for multi-group datasets. Nested groups are flattened (using a sorted DataTree.to_dict()). Dataset representations are always used for groups.
  • Global Plot Controls (:warning: EXPERIMENTAL): Use at your own risk. It will trigger plotting operations for all available variables. It is not optimized at all, and usage is not really recommended.
  • Groups: The extension's data representation proposal. The view is inspired by the xarray HTML representation, with additional plotting controls. Feature parity is not reached yet as no sample data is currently displayed.
    • Dimensions: Dataset dimensions and their sizes
    • Coordinates: All coordinates with their types, shapes, dimension names, and memory usage. Attributes can be revealed when clicking on a coordinate..
    • Variables: All data variables with their types, shapes, dimension names, and memory usage. Attributes can be revealed when clicking on a variable.
      • Plot Controls (:warning: EXPERIMENTAL): "Create Plot" button for a variable, that tries the best effort to produce a plot of the variable using matplotlib. Currently, only an "auto" (best effort) plot mode is supported.
    • Attributes: Show group's attributes.

๐ŸŽฎ Available Commands

Access these commands via the Command Palette (Ctrl+Shift+P):

Command Description
Scientific Data Viewer: Open Scientific Data Viewer Opens the Scientific Data Viewer for a file
Scientific Data Viewer: Open Scientific Data Viewer (folder) Opens the Scientific Data Viewer for a folder (eg for Zarr)
Scientific Data Viewer: Refresh Python Environment Refreshes the Python environment used by the extension
Scientific Data Viewer: Show Extension Logs Opens the extension's log output for debugging
Scientific Data Viewer: Show Settings Opens the extension settings
Scientific Data Viewer: Open Developer Tools Opens the developer tools for the webview
Scientific Data Viewer: Manage Extension Virtual Environment View status and manage the extension environment (create, update, delete, info)
Scientific Data Viewer: Export Webview Content Export the active Scientific Data Viewer as a self-contained HTML report
Scientific Data Viewer: Toggle Dev Mode Quickly enable/disable dev mode without navigating settings

๐Ÿ–ฑ๏ธ Context Menu Commands

Right-click on supported file types in the Explorer to access:

  • Open in Data Viewer - Opens the file in the Scientific Data Viewer

๐Ÿ–ผ๏ธ Export Webview Content

The extension allows you to export complete data viewer content as self-contained HTML reports:

  1. Using the Export Button:

    • Open a scientific data file in the Scientific Data Viewer
    • Click the export button (๐Ÿ–ผ๏ธ) in the header controls
    • Choose a location and filename for the HTML report
    • The report will be generated and you can choose to open it or reveal it in explorer
  2. Using the Command Palette:

    • Press Ctrl+Shift+P (open command palette)
    • Type "Scientific Data Viewer: Export Webview Content"
    • Choose a location and filename for the HTML report

Report Contents:

  • Complete file information (path, size, format, engines)
  • Xarray HTML and text representations
  • Data structure (dimensions, coordinates, variables, attributes)
  • Technical information (Python path, extension configuration, versions)
  • All content is self-contained with embedded CSS and JavaScript
  • Professional layout with copy buttons for easy data extraction

Use Cases:

  • Share data analysis results with colleagues
  • Create documentation for datasets
  • Archive data viewer sessions
  • Generate reports for presentations or publications

โš™๏ธ Settings

The extension can be configured through VSCode settings:

General Settings

  • scientificDataViewer.maxFileSize
    • (type: number, default: 1000000000000)
    • Maximum file size in MB to load
  • scientificDataViewer.defaultView
    • (type: string, default: "default")
    • Default view mode for data display.
  • scientificDataViewer.matplotlibStyle
    • (type: string, default:"" (empty string))
    • Matplotlib plot style for data visualizations. If empty, automatically detects VSCode theme and applies appropriate style (light theme โ†’ default, dark theme โ†’ dark_background). If set, overrides automatic detection. Examples: default, dark_background, seaborn, ggplot, or any valid matplotlib style name.

๐Ÿ Virtual Environment Settings

The extension includes specific settings for virtual environment management:

  • scientificDataViewer.python.overridePythonInterpreter
    • (string, default: "")
    • Override the Python interpreter path (takes precedence over all other options). If set, this will take precedence over the extension's own virtual environment, Python extension's interpreter, and any auto-detected environments.
  • scientificDataViewer.python.useExtensionOwnEnvironment
    • (boolean, default: false)
    • Use the extension's own virtual environment instead of the Python extension's interpreter. When enabled, the extension will create and use its own isolated virtual environment stored in VSCode's extension storage. Requires uv to be installed - if uv is not available, the extension will fall back to using the Python extension's interpreter. The extension will automatically use uv to install Python 3.13 and create the environment with all required packages.

๐Ÿšฉ Feature Flags

The extension includes configuration options that act as feature flags to control specific behaviors:

  • scientificDataViewer.allowMultipleTabsForSameFile
    • (type: boolean, default: false)
    • โš ๏ธ Experimental - Allow opening multiple tabs for the same file. When enabled, each 'Open in Data Viewer' action creates a new tab. When disabled (default), focuses on existing tab if file is already open.
  • scientificDataViewer.devMode
    • (type: boolean, default: false)
    • Enable development mode. When enabled, automatically runs 'Show Extension Logs' and 'Open Developer Tools' commands when a scientific data file is opened. Also reloads the webview script and CSS for faster development feedback loops.
  • scientificDataViewer.convertBandsToVariables
    • (type: boolean, default: true)
    • Convert bands of GeoTIFF rasters to variables for better readability. When enabled, multi-band GeoTIFF files (.tif, .tiff, .geotiff) will have their bands converted to separate variables instead of a single 3D DataArray. This improves plotting capabilities and data structure visualization by treating each band as an individual variable.

๐Ÿ”ง Troubleshooting

โš ๏ธ Common Issues

  1. Python not found:

    • Ensure Python is installed and in your PATH
    • Use the "Python: Select Interpreter" command to manually set the path
    • Consider using the extension's own virtual environment for a self-contained solution
  2. uv not available:

    • Consult the documentation: uv installation
    • Install uv manually: pip install uv or curl -LsSf https://astral.sh/uv/install.sh | sh
    • If uv is not installed, the extension will fall back to using the Python extension's interpreter
  3. Missing packages:

    • Install required packages: pip install xarray matplotlib
    • Install per-format packages: pip install netCDF4 zarr h5py numpy rioxarray
    • Or let the extension install them automatically (prompt when opening a file)
  4. Large files not loading:

    • Increase the maxFileSize setting
    • Consider using data slicing for very large datasets
  5. Permission errors:

    • Ensure the extension has permission to read your data files
    • Check file permissions and VSCode workspace settings

๐Ÿ’ฌ Getting Help

๐Ÿค Contributing

We welcome contributions! Please see our Contributing Guidelines for details.

Development Setup

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Add tests if applicable
  5. Submit a pull request

๐Ÿ› ๏ธ Development

See the Development Guide

๐Ÿ“„ License

This project is licensed under the MIT License - see the LICENSE file for details.

๐Ÿ™ Acknowledgments

๐Ÿ“ Project Structure

Disclaimer: The information below is provided for reference purposes only and may be outdated. Please refer to actual source code for the most current information.

scientific-data-viewer/
โ”œโ”€โ”€ src/                          # TypeScript source code
โ”‚   โ”œโ”€โ”€ extension.ts              # Main extension entry point and command registration
โ”‚   โ”œโ”€โ”€ dataProcessor.ts          # Python integration and data processing
โ”‚   โ”œโ”€โ”€ dataViewerPanel.ts        # Webview panel for data visualization
โ”‚   โ”œโ”€โ”€ pythonManager.ts          # Advanced Python environment management
โ”‚   โ”œโ”€โ”€ logger.ts                 # Comprehensive logging utilities
โ”‚   โ”œโ”€โ”€ communication/            # Message passing system
โ”‚   โ”‚   โ”œโ”€โ”€ MessageBus.ts         # Message bus for communication
โ”‚   โ”‚   โ””โ”€โ”€ MessageTypes.ts       # Type definitions for messages
โ”‚   โ”œโ”€โ”€ error/                    # Error handling
โ”‚   โ”‚   โ””โ”€โ”€ ErrorBoundary.ts      # Error boundary component
โ”‚   โ”œโ”€โ”€ state/                    # Application state management
โ”‚   โ”‚   โ””โ”€โ”€ AppState.ts           # Global application state
โ”‚   โ”œโ”€โ”€ events/                   # Event handling (empty)
โ”‚   โ””โ”€โ”€ ui/                       # User interface components
โ”‚       โ”œโ”€โ”€ CSSGenerator.ts       # CSS generation utilities
โ”‚       โ”œโ”€โ”€ HTMLGenerator.ts      # HTML generation utilities
โ”‚       โ”œโ”€โ”€ JavaScriptGenerator.ts # JavaScript generation utilities
โ”‚       โ”œโ”€โ”€ UIController.ts       # UI controller logic
โ”‚       โ””โ”€โ”€ webview/              # Webview assets
โ”‚           โ”œโ”€โ”€ styles.css        # Webview styles
โ”‚           โ””โ”€โ”€ webview-script.js # Webview JavaScript
โ”œโ”€โ”€ python/                       # Python scripts for data processing
โ”‚   โ”œโ”€โ”€ get_data_info.py          # Extract file metadata and variable info
โ”‚   โ”œโ”€โ”€ create_sample_data.py     # Generate sample data files
โ”‚   โ””โ”€โ”€ tests.ipynb              # Jupyter notebook for testing
โ”œโ”€โ”€ test/                         # Test files
โ”‚   โ”œโ”€โ”€ runTest.ts               # Test runner
โ”‚   โ””โ”€โ”€ suite/                   # Test suites
โ”œโ”€โ”€ sample-data/                  # Sample data files for testing
โ”‚   โ”œโ”€โ”€ sample_data.nc           # NetCDF sample file
โ”‚   โ”œโ”€โ”€ sample_data.h5           # HDF5 sample file
โ”‚   โ”œโ”€โ”€ sample_data.grib         # GRIB sample file
โ”‚   โ”œโ”€โ”€ sample_data.jp2          # JPEG2000 sample file
โ”‚   โ”œโ”€โ”€ sample_data.tif          # GeoTIFF sample file
โ”‚   โ”œโ”€โ”€ sample_data.zarr/        # Zarr sample datasets
โ”‚   โ”‚   โ”œโ”€โ”€ sample_zarr_arborescence.zarr/
โ”‚   โ”‚   โ”œโ”€โ”€ sample_zarr_inherited_coords.zarr/
โ”‚   โ”‚   โ”œโ”€โ”€ sample_zarr_nested_groups_from_datatree.zarr/
โ”‚   โ”‚   โ”œโ”€โ”€ sample_zarr_nested_groups_from_zarr.zarr/
โ”‚   โ”‚   โ””โ”€โ”€ sample_zarr_single_group_from_dataset.zarr/
โ”‚   โ”œโ”€โ”€ broken_file.*            # Test files for error handling
โ”‚   โ””โ”€โ”€ sdv-plots/               # Generated plot outputs
โ”œโ”€โ”€ docs/                         # Documentation
โ”‚   โ”œโ”€โ”€ ARCHITECTURE_IMPROVEMENTS.md
โ”‚   โ”œโ”€โ”€ DEVELOPMENT.md            # Development guide
โ”‚   โ”œโ”€โ”€ PUBLISHING.md             # Publishing guide
โ”‚   โ”œโ”€โ”€ QUICKSTART.md             # Quick start guide
โ”‚   โ”œโ”€โ”€ TECHNICAL_ARCHITECTURE.md # Technical architecture docs
โ”‚   โ”œโ”€โ”€ test-extension.md         # Extension testing guide
โ”‚   โ””โ”€โ”€ rfc/                      # Request for Comments
โ”‚       โ”œโ”€โ”€ README.md
โ”‚       โ””โ”€โ”€ 001-033-*.md         # RFC documents
โ”œโ”€โ”€ media/                        # Media assets
โ”‚   โ”œโ”€โ”€ icon.png                 # Extension icon
โ”‚   โ”œโ”€โ”€ icon.svg                 # SVG icon
โ”‚   โ”œโ”€โ”€ icon_orig.svg            # Original icon
โ”‚   โ””โ”€โ”€ Screenshot*.png          # Screenshots
โ”œโ”€โ”€ out/                          # Compiled JavaScript output
โ”‚   โ”œโ”€โ”€ src/                     # Compiled TypeScript
โ”‚   โ””โ”€โ”€ test/                    # Compiled tests
โ”œโ”€โ”€ node_modules/                 # Node.js dependencies
โ”œโ”€โ”€ package.json                  # Extension manifest and dependencies
โ”œโ”€โ”€ package-lock.json            # Dependency lock file
โ”œโ”€โ”€ tsconfig.json                # TypeScript configuration
โ”œโ”€โ”€ .eslintrc.json               # ESLint configuration
โ”œโ”€โ”€ language-configuration.json  # Language configuration
โ”œโ”€โ”€ scientific-data-viewer-0.3.0.vsix # Packaged extension
โ”œโ”€โ”€ test-publication-readiness.js # Publication readiness test
โ”œโ”€โ”€ setup.sh                     # Setup script
โ”œโ”€โ”€ README.md                    # Main documentation
โ”œโ”€โ”€ CONTRIBUTING.md              # Contribution guidelines
โ””โ”€โ”€ CHANGELOG.md                 # Version history