Unfolded Map ?️ Notebook ? Renderer for VSCode

See Geo Data Viewer ?️ vscode extension for advanced Geo Data Analytics with kepler.gl

Unfolded Map ?️ Renderer

Unfolded Map ?️ Notebook ? Renderer uses Unfolded Map SDK JavaScript library for interactive preview of Geo datasets loaded in VSCode Notebooks ?

Unfolded Map ?️ Notebook ? Renderer


  • View Location data from CSV, XML, JSON, and GeoJSON Notebook ? cell ⌗ data output on the Unfolded Studio map ?️
  • View JSON, CSV, and XML data without Geo Location information in JSON format in a scrollable text container with code pre-wrap for a quick copy/paste to other places:

Unfolded Map ?️ Renderer Text Output

Supported Data Formats

Unfolded Map ?️ Notebook ? Renderer supports loading Location data from the following output formats:

Data Mime Type Location Data Geo Location Processing Description
application/geo+json Point GeoJSON Location Point coordinates are displayed using Unfolded Map ?️ SDK JavaScript library. See our unfoldedMap.js for more info about that setup.
application/json Objects that contain geo location property pairs ending with: latitude/longitude, lat/lng, or lat/lng Flat JSON data objects and arrays are processed by our custom GeoConverter to extract Location information and covert loaded dataset to GeoJSON for display on the map.
text/csv CSV data with column names in the 1st header row and columns ending with: latitude/longitude, lat/lng, or lat/lng CSV data is parsed with d3-dsv JavaScript library and converted to flat JSON data array and then to GeoJSON with our GeoConverter to display locations on the map.
application/xml or text/xml XML data with root node children that contain attributes ending with: latitude/longitude, lat/lng, or lat/lng XML data is parsed with fast-xml-parser to load it into JSON data objects array and then processed with our GeoConverter to display locations on the map. XML data support is very alpha and experimental at this point, and might be removed later.
application/vnd.code.notebook.stdout or text/plain Location data as string in CSV, XML, JSON or GeoJSON data format as described above Text data typically comes from display and console.log() instructions in vscode notebooks. We try to parse text as JSON with JSON.parse(), as CSV with d3-dsv.csvParse(), and as XML with fast-xml-parser. If those parse methods fail, or provided notebook cell text output contains no location data we can extract, we display text output in a custom scrollable text container with code pre-wrap for a quick copy/paste to other places. Otherwise, loaded data is converted to GeoJSON with our GeoConverter for locations display on the map.

?️ Examples

Install and use Data Table ? for Notebooks ? built-in Notebook ? Examples to view Unfolded Map ?️ with provided sample Geo datasets. You can access built-in Data Table ? Notebook ? Examples via Data Table: Notebook Examples command from View -> Command Palette...

Data Table ? Notebook Examples

REST Book Example

  1. Install REST Book ? vscode extension

  2. Load World Cities REST Book ?

  3. Run All cells ⌗

  4. Click on ... in the gutter of GET data output and change it to KeplerGL Map ?️ renderer:

World Cities REST Book ?

Recommended Extensions

Recommended extensions for working with Interactive Notebooks ? data ? charts ? and geo ?️ data formats in VSCode:

Extension Description
REST Book Notebook extension for running REST queries
TypeScript Notebooks TypeScript with Jupyter Notebooks ?
.NET Interactive Notebooks .NET Interactive Jupyter Notebooks ?
Pyolite ? Pyodide ? kernel for JupyterLite Notebooks ?
Observable JS Observable JS compiler with Observable js and md code outline and previews.
JS Notebook ? Inspector ?️ Provides Interactive Preview of Observable JS Notebooks ?, Notebook ? nodes ⎇ & cells ⌗ source code
Data Preivew ? Data Preview ? extension for importing ? viewing ? slicing ? dicing ? charting ? & exporting ? large JSON array/config, YAML, Apache Arrow, Avro & Excel data files
Geo Data Viewer ?️ kepler.gl Geo Data Analytics tool to gen. some snazzy ?️s w/0 Py ? pyWidgets ⚙️ pandas ? or react ⚛️
Vega Viewer ? Provides Interactive Preview of Vega & Vega-Lite maps ?️ & graphs ?
DeltaXML XPath Notebook ? XPath 3.1 Notebook for Visual Studio Code
GeoJSON Snippets Create geospatial objects using GeoJSON snippets
Data Table ? Data Table ? for Notebook ? cell ⌗ data outputs

Dev Log

See #UnfoldedMapRenderer ?️ tag on Twitter for the latest and greatest updates on this vscode extension and what’s in store next.

Dev Build

$ git clone https://github.com/RandomFractals/unfolded-map-renderer
$ cd unfolded-map-renderer
$ npm install
$ npm run compile
$ code .

F5 to launch Unfolded Map ?️ Renderer extension vscode debug session.


unfolded-map-renderer>vsce package

to generate VSIX Unfolded Map ?️ Renderer extension package with vsce from our latest for local dev install in vscode.


Any and all test, code or feedback contributions are welcome.

Open an issue or create a pull request to make this Unfolded Map ?️ Renderer vscode extension work better for all.


support me on ko-fi.com


View Github