Coder Social home page Coder Social logo

randomfractals / unfolded-map-renderer Goto Github PK

View Code? Open in Web Editor NEW
2.0 3.0 0.0 4.18 MB

Unfolded Map πŸ—ΊοΈ Notebook πŸ““ Renderer for VSCode.

Home Page: https://github.com/RandomFractals/unfolded-map-renderer

License: Apache License 2.0

Jupyter Notebook 3.61% TypeScript 47.95% CSS 45.40% JavaScript 3.03%
map data view notebook unfolded geo vscode renderer cell output

unfolded-map-renderer's Introduction

unfolded-map-renderer

Apache-2.0 License https://ko-fi.com/dataPixy



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

Features

  • 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.

Contributions

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.

Backers

support me on ko-fi.com

unfolded-map-renderer's People

Contributors

randomfractals avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar  avatar

unfolded-map-renderer's Issues

Please add extension settings in order to add default "Color Based On" value

Is it possible to add vscode extension settings?

In particular there could be map style/theme selection (exactly like Geo Data Viewer has it)
plus I would really appreciate a possiblity to have default FillColor -> Color Based On
option selectable on extension setting rather than for each execution.

Moreover, is it possible to FillColor from a particular property that stores color ?
In that case Color Scale is not needed.

For example I have geojson created for www.geojson.io, which expect the color to be in "fill" property,
it would be awesome to have the possibility.

image

If my suggestions are possible I will be a very happy to become monthly ko-fi supporter.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.