# Plotly.js: JavaScript Charting Library for Scientific and Financial Data

> Plotly.js is a free, MIT-licensed JavaScript visualization library that powers the Python and R Plotly packages, supports dozens of chart types including 3D graphs and geographic maps, and can be loaded via npm or a versioned CDN script tag.

**plotly/plotly.js** — Open-source JavaScript charting library behind Plotly and Dash

- Repository: https://github.com/plotly/plotly.js
- Website: https://plotly.com/javascript/
- Stars: 18,351 · Forks: 2,045
- Language: JavaScript
- License: MIT
- Published: 2026-09-21 · Updated: 2026-09-21 · Language: en
- Canonical page: https://hysenlabs.com/projects/plotly-plotly-js

## What Plotly.js Provides and Who Uses It

Plotly.js is a standalone JavaScript data visualization library that the Plotly organization also uses as the engine for its Python (Plotly.py) and R (Plotly.R) packages. This means that the chart rendering behavior is shared across languages: a chart definition written in Python or R ultimately calls the same JavaScript rendering code that a web developer uses directly.

The library covers a wide range of chart types: statistical charts like box plots and violin plots, 3D scatter and surface plots, geographic maps with SVG or tile layers, financial candlestick charts, scientific contour and heatmap charts, and standard bar, line, and scatter charts. The README describes this as "dozens of chart types," which is accurate based on the plotly.com/javascript documentation.

The main use case is data-heavy applications where the chart type itself carries analytical meaning. An engineer displaying a simple bar chart for a dashboard might reach for a lighter library. An analyst who needs a 3D surface plot or a geographic choropleth needs the types that Plotly.js provides.

## Installing and Loading Plotly.js in Node.js and the Browser

For Node.js or bundled browser applications, install the minified distribution package:

```sh
npm i --save plotly.js-dist-min
```

Then import it in your module:

```js
// ES6 module
import Plotly from 'plotly.js-dist-min'

// CommonJS
var Plotly = require('plotly.js-dist-min')
```

The unminified variant is `plotly.js-dist` for debugging or development use. For direct browser loading via a script tag, reference a specific version:

```html
<head>
    <script src="https://cdn.plot.ly/plotly-4.1.1.min.js" charset="utf-8"></script>
</head>
<body>
    <div id="gd"></div>
    <script>
        Plotly.newPlot("gd", {
            "data": [{ "y": [1, 2, 3] }],
            "layout": { "width": 600, "height": 400}
        })
    </script>
</body>
```

The README is explicit that the `plotly-latest` CDN URLs (such as cdn.plot.ly/plotly-latest.min.js) are frozen at v1.58.5, the last v1 patch, and will not receive further updates. Any deployment relying on the latest tag is stuck at a version that predates the v2 and v3 API changes. For v4.1.1 and later releases, the version number must be specified explicitly in the CDN URL.

## Bundle Options: Official Packages, Partial Bundles, and Custom Builds

Plotly.js distributes several bundle variants. The main `plotly.js` package includes all chart types and is the largest option. The `plotly.js-dist-min` package is the minified version of the full bundle. For applications that only need a subset of chart types, the dist README describes partial official bundles that exclude less common types.

Custom bundles can be built to include only the specific chart types an application uses, reducing the final JavaScript size. The CUSTOM_BUNDLE.md file in the repository documents this process, which involves running the bundler tasks from the source. The package.json scripts show `custom-bundle` as a task: `node tasks/custom_bundle.mjs`. This is not a one-command operation; it requires cloning the repository and running the build toolchain.

The package.json requires Node.js version 22 or higher for running the build tools. The README notes an alternative loading path for applications that need to import from `plotly.js/lib/index.js` directly or load chart type modules individually; those cases are documented in BUILDING.md.

## MathJax Support and Multiple WebGL Charts

Plotly.js supports rendering mathematical expressions in plot titles, axis labels, tick text, and annotations using MathJax. MathJax is not included in the Plotly.js bundle and must be loaded as a separate script. For MathJax v4:

```html
<script src="https://cdn.jsdelivr.net/npm/mathjax@4.1.3/tex-svg.js"></script>
```

For MathJax v3:

```html
<script src="https://cdn.jsdelivr.net/npm/mathjax@3.2.2/es5/tex-svg.js"></script>
```

Any string wrapped in `$..$` signs in a plot property is interpreted as a LaTeX expression and rendered through MathJax's SVG renderer. The README notes that Plotly.js uses the MathJax `svg` renderer specifically and will not interfere with other MathJax renderers on the same page.

For pages with multiple WebGL charts, browsers enforce a limit on the number of simultaneous WebGL contexts per page. The README recommends loading the virtual-webgl polyfill before other scripts to work around this limit for WebGL 1 contexts. The limitation applies only to WebGL 1; the README notes virtual-webgl is not for WebGL 2.

## Plotly.js vs Chart.js: Different Design Goals

Chart.js is the most commonly compared alternative. Chart.js is designed for common chart types: bar, line, pie, doughnut, radar, scatter, bubble, and polar area. It is lightweight, well-documented, and widely used for dashboards and business reports. Chart.js does not provide 3D charts, geographic maps, or the scientific and financial chart types that Plotly.js includes.

Plotly.js's full bundle is significantly larger than Chart.js. For a web application that only needs bar and line charts, Chart.js's smaller footprint is an advantage. For an application that needs contour maps, violin plots, or 3D surface charts, Chart.js cannot substitute.

Chart.js uses a canvas-based renderer; Plotly.js uses SVG for most chart types and WebGL for large-scale scatter plots. SVG charts are accessible, searchable in the DOM, and easy to style with CSS; WebGL charts are faster for dense data sets but less accessible. Both libraries are MIT licensed.

## Limitations: Bundle Size, React Integration, and Version Pinning

The full Plotly.js bundle is large. Applications that care about initial load time need to evaluate whether a partial bundle or a custom build is practical. The CUSTOM_BUNDLE.md process requires local build toolchain setup, which is a non-trivial operational cost for teams that just want to add charts to a project.

For React applications, there is a separate plotly/react-plotly.js wrapper package. The README does not describe this package in detail; the standalone plotly.js-dist-min package works with React through a standard script import or by calling `Plotly.newPlot` and `Plotly.react` from a useEffect hook. The plotly.js package itself is framework-agnostic.

Version pinning is more important for Plotly.js than for many libraries because the CDN URL must include the version number. The current version is 4.1.1, released on 2026-09-14. The major version history includes significant API changes between v1, v2, v3, and v4, so upgrading across major versions requires reviewing the CHANGELOG.md for breaking changes.

The README also notes that the `plotly-latest` CDN URLs stopped updating at v1.58.5. Projects built when that URL still worked and never pinned a version are silently stuck on an old release. Any dependency audit should check that CDN references include an explicit version number in the URL path.

## Maintenance, License, and the Dash Connection

Plotly.js is maintained by Plotly, Inc. The repository's last push was on 2026-09-27, and v4.1.1 was released on 2026-09-14. The package ships its own TypeScript declarations: package.json sets `"types": "./lib/index.d.ts"`, the build scripts generate entry-point types under src/types/generated/, and a schema-typegen-diff-check script fails the build when the generated schema.d.ts drifts from the plot schema. TypeScript projects can therefore import the library with types and without a separate typings package.

The license is MIT, which permits free use for commercial and personal purposes. The README includes a link to Plotly's consulting and OEM offering for teams that need dedicated engineering support or commercial license terms for embedded products.

Plotly.js is the rendering engine behind Dash, Plotly's Python framework for building data applications. Teams using Dash write chart definitions in Python but the charts are rendered by the same Plotly.js library that web developers use directly. This means a chart debugged in the browser with JavaScript will behave identically when the same chart definition is generated by Dash's Python API.

## Conclusion

Plotly.js is the right choice for teams that need scientific, statistical, or financial chart types that simpler libraries do not provide, particularly 3D graphs, geographic maps, or charts that need to work across JavaScript, Python, and R with a consistent API. It is the wrong choice for applications that need a minimal bundle size, since the full bundle is large and custom bundles require a non-trivial build step. Before deploying, choose a specific release version for CDN use rather than the unversioned plotly-latest URL, which was frozen at v1.58.5 and no longer updates. For performance with many WebGL charts on one page, load the virtual-webgl script before Plotly.

## FAQ

### Is Plotly.js free?

Plotly.js is MIT licensed and free to use for personal and commercial purposes. The README links to a consulting offering for teams that need enterprise support, but the library itself has no usage fees.

### What is Plotly.js used for?

Plotly.js is used for building interactive charts and data visualizations in the browser. It covers statistical charts, 3D graphs, geographic maps, financial charts, and scientific visualizations, and also powers the Python and R Plotly packages.

### Is Plotly a Python or JavaScript library?

Plotly.js is a JavaScript library. Plotly.py (Python) and Plotly.R (R) are separate packages that use Plotly.js as their rendering engine, so the same chart types and rendering behavior are available across all three languages.

### How do you install Plotly.js?

For Node.js or bundled applications, run `npm i --save plotly.js-dist-min`. For direct browser loading, include a versioned script tag such as `<script src="https://cdn.plot.ly/plotly-4.1.1.min.js">` with the specific version number, since the unversioned plotly-latest URL is frozen at v1.58.5.

## Sources

- [License: MIT](https://github.com/plotly/plotly.js/blob/main/LICENSE)
- [plotly/plotly.js on GitHub](https://github.com/plotly/plotly.js)
- [Project website](https://plotly.com/javascript/)
- [README](https://github.com/plotly/plotly.js/blob/main/README.md)
- [Releases](https://github.com/plotly/plotly.js/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/plotly-plotly-js
