# smartcharts-nxt

> Lightweight, simple and flexible Ultra fast SVG based js chart library for Mobile, Web and App.

Latest version **1.0.0-rc.6** (published 2024-08-28) · MIT license · 0 weekly downloads

## Install

```sh
npm install smartcharts-nxt
pnpm add smartcharts-nxt
yarn add smartcharts-nxt
bun add smartcharts-nxt
```

## Health

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

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0-rc.6 |
| Published | 2024-08-28 |
| First published | 2022-09-10 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 6.3 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Kausik Dey |
| Maintainers | kdologic |
| Keywords | charts, graphs, visualization, data, dataviz, data visualization, svg, responsive, visual |

## Links

- npm: https://www.npmjs.com/package/smartcharts-nxt
- Repository: https://github.com/kdologic/smartChartsNXT
- Homepage: https://www.smartchartsnxt.com
- Issues: https://github.com/kdologic/smartChartsNXT/issues
- npm.io page: https://npm.io/package/smartcharts-nxt

## Alternatives

- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads

## Recent versions

- 1.0.0-rc.6 (latest) — 2024-08-28
- 1.0.0-rc.5 — 2024-04-10
- 1.0.0-rc.4 — 2024-04-10
- 1.0.0-rc.3 — 2023-06-19
- 1.0.0-rc.1 — 2022-09-27
- 1.0.0 — 2022-09-10

## README

# SmartChartsNXT [![Build Status](https://travis-ci.org/kdologic/smartChartsNXT.svg?branch=develop)](https://travis-ci.org/kdologic/smartChartsNXT) [![](https://data.jsdelivr.com/v1/package/npm/smartcharts-nxt/badge)](https://www.jsdelivr.com/package/npm/smartcharts-nxt)
<p align="center">
<img src="https://github.com/kdologic/smartChartsNXT/blob/develop/examples/static/images/sc_logo.png?raw=true" alt="SmartChartsNxt Logo" width="100px" height="100px" />
</p>


A powerful yet simple Javascript chart library, built on top of JavaScript and JSON which unleash the power of SVG to create Smart, Interactive, Responsive, High Performance Charts. 

## Browsers support

| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Opera |
| --------- | --------- | --------- | --------- | --------- |
| Edge | 51+| 56+ | 10+| 43+

## Download and Installation

##### Installing via npm

```bash
npm install smartcharts-nxt --save
```

##### Direct &lt;script&gt; include

```html
<script src="https://cdn.jsdelivr.net/npm/smartcharts-nxt"></script>
```

## Usage

##### CommonJS

```js
 var SmartChartsNXT = require('smartcharts-nxt');
```

##### ESM
```js
import SmartChartsNXT from 'smartcharts-nxt';
```
To create a simple Line Chart with minimal configuration, write as follows : 

```js
SmartChartsNXT.ready()
  .then( () => {
    let lineChart = new SmartChartsNXT.Chart({
      "type": SmartChartsNXT.CHART_TYPE.LINE_CHART,
      "targetElem": "chartContainer",
      "dataSet": {
        "xAxis": {
          "categories": ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
        },
        "series": [{
          "name": "Temperature",
          "data": [2.6,	4.0, 6.4, 9.9, 13.8, 16.9, 18.7, 18.3, 15.4, 10.8 ,6.3, 3.4]
        }]
      }
    });
  });
```
This will render this line chart inside element with id `#chartContainer`.

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