Giraffe

A React-based visualization library powering the data visualizations in the InfluxDB 2.0 UI.

Features

There are plenty of terrific visualization libraries in the JavaScript ecosystem. Giraffe aims to distinguish itself with several features:

• Support for the Flux language
• Easy reactivity and extensibility via React
• Support for mapping groupings of columns to a single visual aesthetic
• A high-level Grammar of Graphics–style API that can specify a wide variety of visualizations with a few simple concepts
• A columnar interface for input data that enables efficient interoperability with Web Workers and Apache Arrow
• Self-contained configurations in the style of Vega-Lite

Demos

See the visualizations in action using Storybook.

Sample Code

See a listing of sample projects that render different types of visualizations.

Getting Started

Installation

Install Giraffe with your package manager:

yarn add @influxdata/giraffe

or

npm install @influxdata/giraffe

Example

See the Quick Start Guide for an example.

Development

To contribute to Giraffe, see the contributing guide.

Looking for details on the configuration? See the configuration guide.