Package Exports

react-native-responsive-linechart-dna
react-native-responsive-linechart-dna/lib/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-responsive-linechart-dna) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-responsive-linechart-dna

npm npm GitHub

Announcing v5

Breaking changes with respect to v4:

New dependency on react-native-gesture-handler

Breaking changes with respect to v3:

Support for data point visualizations
Library supplied tooltip component is renamed from BoxTooltip to just Tooltip
Minor theme changes (box -> shape rename)

Additional features:

Scrollable charts!

View installation docs & examples here

Screenshots

Preview 1 Preview 2 Preview 3 Preview 4 Preview 5

Quick example

import { Chart, VerticalAxis, HorizontalAxis, Line } from 'react-native-responsive-linechart-dna'

<Chart
  style={{ height: 200, width: '100%', backgroundColor: '#eee' }}
  xDomain={{ min: -2, max: 10 }}
  yDomain={{ min: -2, max: 20 }}
  padding={{ left: 20, top: 10, bottom: 10, right: 10 }}
>
  <VerticalAxis tickValues={[0, 4, 8, 12, 16, 20]} />
  <HorizontalAxis tickCount={3} />
  <Line data={data1} smoothing="none" theme={{ stroke: { color: 'red', width: 1 } }} />
  <Line data={data2} smoothing="cubic-spline" theme={{ stroke: { color: 'blue', width: 1 } }} />
</Chart>

const data1 = [
  { x: -2, y: 1 },
  { x: -1, y: 0 },
  { x: 8, y: 13 },
  { x: 9, y: 11.5 },
  { x: 10, y: 12 }
]

const data2 = [
  { x: -2, y: 15 },
  { x: -1, y: 10 },
  { x: 0, y: 12 },
  { x: 1, y: 7 },
  { x: 8, y: 12 },
  { x: 9, y: 13.5 },
  { x: 10, y: 18 }
]

[OLD] Announcing v3

Version 3 is a complete re-write from the ground up with the following exciting features:

Completely written in Typescript
Composable API, every part of the chart is its own component.
Very few dependencies (Total package size is only 62 kilobytes)
New documentation website with extensive examples
Support for smooth/linear line & charts area charts, tooltips and more

Due to the nature of the changes, version 2.2 and below is now no longer supported. You can find the old README here.