# react-circos

> react wrapper for circosJS

Latest version **1.0.0** (published 2018-07-14) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-circos
pnpm add react-circos
yarn add react-circos
bun add react-circos
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2018-07-14 |
| First published | 2018-07-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Nicolas Girault |
| Maintainers | nicgirault |

## Links

- npm: https://www.npmjs.com/package/react-circos
- Repository: https://github.com/plotly/react-circosJS
- Homepage: https://github.com/plotly/react-circosJS#readme
- Issues: https://github.com/plotly/react-circosJS/issues
- npm.io page: https://npm.io/package/react-circos

## Dependencies (2)

- [circos](https://npm.io/package/circos.md) ^2.1.0
- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2

## Recent versions

- 1.0.0 (latest) — 2018-07-14

## README

# react-circos

A React wrapper for CircosJS

## Usage

```bash
yarn add react-circos
```

```javascript
import React from 'react';
import Circos, { HEATMAP } from 'react-circos';
import layout from 'examples/fixtures/months.json';
import heatmap from 'examples/fixtures/heatmap.json';

const size = 800;

const HeatmapTest = () => (
  <Circos
    size={800}
    layout={layout}
    config={{
      innerRadius: size / 2 - 80,
      outerRadius: size / 2 - 30,
      ticks: {
        display: false,
      },
      labels: {
        position: 'center',
        display: true,
        size: 14,
        color: '#000',
        radialOffset: 15,
      },
    }}
    tracks={[{
      type: HEATMAP,
      data: heatmap,
      config: {
        innerRadius: 0.8,
        outerRadius: 0.98,
        logScale: false,
        color: 'YlOrRd',
      },
    }]}
  />
);

```

More examples [here](https://github.com/plotly/react-circosJS/tree/master/examples).
The config and data of each track should follow the specification of [circosJS](https://github.com/nicgirault/circosJS)

## Contribute

Useful commands & tips:

```bash
yarn test --watch
yarn build --watch
```

Read about [yarn link](https://yarnpkg.com/lang/en/docs/cli/link/)

---
_Source: https://npm.io/package/react-circos · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._