https://github.com/kristw/encodable

Configurable grammar for visualization components
https://github.com/kristw/encodable

chart data-visualization grammar library typescript vega-lite

Last synced: 6 days ago
JSON representation

Configurable grammar for visualization components

• Host: GitHub
• URL: https://github.com/kristw/encodable
• Owner: kristw
• License: apache-2.0
• Created: 2019-11-15T19:42:05.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2024-07-23T02:11:37.000Z (9 months ago)
• Last Synced: 2025-04-03T05:02:31.630Z (12 days ago)
• Topics: chart, data-visualization, grammar, library, typescript, vega-lite
• Language: TypeScript
• Homepage: https://encodable.vercel.app
• Size: 4.45 MB
• Stars: 61
• Watchers: 6
• Forks: 6
• Open Issues: 11
• Metadata Files:
  • Readme: README.md
  • License: LICENSE
  • Codeowners: .github/CODEOWNERS

Awesome Lists containing this project

• awesome-viz - encodable - When you have a visualization component, this library helps you defines the visual channels that you can encode data into and provide API similar to vega-lite's grammar for consumers to customize the visual encoding. ([↑](#contents) Declarative)

README

        
# 🎭 encodable

[![Codecov branch](https://img.shields.io/codecov/c/github/kristw/encodable/master.svg?style=flat-square)](https://codecov.io/gh/kristw/encodable/branch/master)

![GitHub Workflow Status](https://img.shields.io/github/workflow/status/kristw/encodable/build-and-test-workflow?style=flat-square)

[![David](https://img.shields.io/david/dev/kristw/encodable.svg?style=flat-square)](https://david-dm.org/kristw/encodable?type=dev)

> **tl;dr.** When you have a visualization component, this library helps you defines the visual

> channels that you can encode data into and provide API similar to `vega-lite`'s grammar for

> consumers to customize the visual encoding.

### Install

```sh

npm install encodable global-box

```

## Documentation

[See documentation and more examples here.](https://encodable.vercel.app/)

## Example

![Preview](https://raw.githubusercontent.com/kristw/encodable/master/images/preview.png)

[![Edit encodable Demo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/encodable-demo-wvhj3?fontsize=14&hidenavigation=1&theme=dark)

[more demo...](https://github.com/kristw/encodable/blob/master/DEMO.md)

### License

Apache-2.0