# @canvasjs/stockcharts

> CanvasJS JavaScript StockCharts - Official

Latest version **1.17.3** (published 2026-09-15) · SEE LICENSE IN <LICENSE> license · 0 weekly downloads

## Install

```sh
npm install @canvasjs/stockcharts
pnpm add @canvasjs/stockcharts
yarn add @canvasjs/stockcharts
bun add @canvasjs/stockcharts
```

## Health

**Score 55/100 (C)** — status: active.

Positive: no vulnerabilities; recently updated; high maintenance score.

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

## Facts

| | |
|---|---|
| Version | 1.17.3 |
| Published | 2026-09-15 |
| First published | 2023-05-15 |
| Weekly downloads | 0 |
| License | SEE LICENSE IN <LICENSE> |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 664.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | fenopix |
| Maintainers | canvasjs |
| Keywords | javascript, stockcharts, financial chart, javascript stockcharts, javascript stockchart library, html5 stockcharts, js stockcharts, stock chart, high performance stock charts, canvasjs |

## Links

- npm: https://www.npmjs.com/package/@canvasjs/stockcharts
- Homepage: https://canvasjs.com/
- npm.io page: https://npm.io/package/@canvasjs/stockcharts

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 1.17.3 (latest) — 2026-09-15
- 1.16.0-beta.1 (beta) — 2026-06-08
- 1.17.2 — 2026-09-07
- 1.17.1 — 2026-08-31
- 1.17.0 — 2026-08-24
- 1.16.9 — 2026-08-17
- 1.16.8 — 2026-08-10
- 1.16.7 — 2026-08-03
- 1.16.6 — 2026-07-27
- 1.16.5 — 2026-07-20
- 1.16.4 — 2026-07-13
- 1.16.3 — 2026-07-06
- 1.16.2 — 2026-06-29
- 1.16.1 — 2026-06-22
- 1.16.0 — 2026-06-15
- … 152 more at https://npm.io/package/@canvasjs/stockcharts/versions

## README

<div align="center">
	<a href="https://www.npmjs.com/~canvasjs" target="_blank">
		<img src="https://canvasjs.com/wp-content/uploads/images/logo/canvasjs-logo-240x100.png" alt="CanvasJS"/>
	</a>
</div>

# CanvasJS JavaScript StockCharts - Official
CanvasJS StockCharts provides you with a powerful [JavaScript StockChart](https://canvasjs.com/javascript-stockcharts/) library for creating advanced financial charts for your web pages & applications. StockCharts work well with all the popular Technologies & Frameworks like React, Angular, jQuery, PHP, etc.

![JavaScript Interactive StockCharts](https://canvasjs.com/wp-content/uploads/images/npm/stockchart-interactivity.gif)

<br/>

### Browser Support

| ![Chrome](https://canvasjs.com/wp-content/uploads/images/browser-icons/chrome.png)<br/>Chrome | ![Edge](https://canvasjs.com/wp-content/uploads/images/browser-icons/edge.png)<br/>Edge | ![Firefox](https://canvasjs.com/wp-content/uploads/images/browser-icons/firefox.png)<br/>Firefox | ![Safari](https://canvasjs.com/wp-content/uploads/images/browser-icons/safari.png)<br/>Safari | ![IE](https://canvasjs.com/wp-content/uploads/images/browser-icons/ie9-11.png)<br/>IE9+ |  ![IE8](https://canvasjs.com/wp-content/uploads/images/browser-icons/ie8.png)<br/>IE8 |
|:------:|:-------:|:------:|:-----:|:----:|:----:|
| 4+ ✔ | 12+ ✔ | 3.6+ ✔ | 4+ ✔ | 9+ ✔ | 8 ✔ |

<br/>

## Important Links
- [Official Website](https://canvasjs.com/)
- [JavaScript StockCharts Demo](https://canvasjs.com/javascript-stockcharts/)
- [Download CanvasJS](https://canvasjs.com/download-html5-charting-graphing-library/)
- [StockChart Documentation](https://canvasjs.com/docs/stockcharts/basics-of-creating-html5-stockchart/)
- [StockChart Support Forum](https://canvasjs.com/forums/forum/stockchart-support/)

<br/>

## Installing CanvasJS JavaScript Stock Charts
There are multiple ways to install CanvasJS StockChart to your web-app. You can directly add script-tag to include CanvasJS StockCharts from our [CDN or download it from official site](https://canvasjs.com/download-html5-charting-graphing-library/) or install it from [NPM registry](https://npmjs.org/package/@canvasjs/stockcharts). Please refer [documentation page](https://canvasjs.com/docs/stockcharts/basics-of-creating-html5-stockchart/) for more information.

#### Install StockCharts via NPM
```
npm install @canvasjs/stockcharts
```
See [npm documentation](https://docs.npmjs.com/) to know more about npm usage.

#### Using CanvasJS Stock Charts via CDN
You can access CanvasJS StockCharts from our CDN directly.
```
<script src="https://cdn.canvasjs.com/canvasjs.stock.min.js"></script>
```

#### Download from Official Site
You can download the JavaScript stockchart library along with examples from our official [download page](https://canvasjs.com/download-html5-charting-graphing-library/). Save it in your project directory & add it in your application.
```
<script src="canvasjs.stock.min.js"></script>
```

<br/>

## Usage
Once you have installed the package, you can start using CanvasJS StockCharts in your project. CanvasJS StockCharts can be imported using different module formats like AMD, CommonJS, etc.
```
//Load CanvasJS StockCharts
import * as CanvasJS from "@canvasjs/stockcharts";
//var CanvasJS = require("@canvasjs/stockcharts");
```

Define container for the stockchart.
```
<div id="stockChartContainer"></div>
```

Create & Render the stockchart.
```
//Create StockChart
var stockChart = new CanvasJS.StockChart("stockChartContainer", {
	//StockChart Options - Check https://canvasjs.com/docs/stockcharts/stockchart-options/
	title: {
		text: "CanvasJS StockChart"
	},
	charts: [{
		data: [{
			type: "line",
			dataPoints: [
				{ x: new Date("2018-01-01"), y: 71 },
				{ x: new Date("2018-02-01"), y: 55 },
				{ x: new Date("2018-03-01"), y: 50 },
				{ x: new Date("2018-04-01"), y: 65 },
				{ x: new Date("2018-05-01"), y: 95 },
				{ x: new Date("2018-06-01"), y: 68 },
				{ x: new Date("2018-07-01"), y: 28 },
				{ x: new Date("2018-08-01"), y: 34 },
				{ x: new Date("2018-09-01"), y: 14 },
				{ x: new Date("2018-10-01"), y: 71 },
				{ x: new Date("2018-11-01"), y: 55 },
				{ x: new Date("2018-12-01"), y: 50 },
				{ x: new Date("2019-01-01"), y: 34 },
				{ x: new Date("2019-02-01"), y: 50 },
				{ x: new Date("2019-03-01"), y: 50 },
				{ x: new Date("2019-04-01"), y: 95 },
				{ x: new Date("2019-05-01"), y: 68 },
				{ x: new Date("2019-06-01"), y: 28 },
				{ x: new Date("2019-07-01"), y: 34 },
				{ x: new Date("2019-08-01"), y: 65 },
				{ x: new Date("2019-09-01"), y: 55 },
				{ x: new Date("2019-10-01"), y: 71 },
				{ x: new Date("2019-11-01"), y: 55 },
				{ x: new Date("2019-12-01"), y: 50 }
			]
		}]
	}],
	navigator: {
		slider: {
			minimum: new Date("2018-07-01"),
			maximum: new Date("2019-06-30")
		}
	}
});
//Render StockChart
stockChart.render();
```

<br/>

![JavaScript StockChart](https://canvasjs.com/wp-content/uploads/images/npm/javascript-stockchart.jpg)

<br/>

### Related StockChart Packages
* [React StockCharts](https://www.npmjs.com/package/@canvasjs/react-stockcharts)
* [Angular StockCharts](https://www.npmjs.com/package/@canvasjs/angular-stockcharts)
* [Vue StockCharts](https://www.npmjs.com/package/@canvasjs/vue-stockcharts)
* [jQuery StockCharts](https://www.npmjs.com/package/@canvasjs/jquery-stockcharts)

<br/>

## License
Commercial use of CanvasJS StockChart requires a commercial license. Without a commercial license you can use it for evaluation (or demonstrations/testing) purposes. Students, Educational Institutions, Personal Websites using CanvasJS for non-commercial purposes are qualified for the free license. Check out [License Page](https://canvasjs.com/license/) to know more about licenses.

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