Plotly.js is a standalone Javascript data visualization library, and it also powers the Python and R modules named plotly in those respective ecosystems (referred to as Plotly.py and Plotly.R).
Plotly.js can be used to produce dozens of chart types and visualizations, including statistical charts, 3D graphs, scientific charts, SVG and tile maps, financial charts and more.
Contact us for Plotly.js consulting, dashboard development, application integration, and feature additions.
Table of contents
- Load as a node module
- Load via script tag
- Bundles
- Alternative ways to load and build plotly.js
- Documentation
- Bugs and feature requests
- Contributing
- Notable contributors
- Copyright and license
- Community
Load as a node module
Install a ready-to-use distributed bundle
npm i --save plotly.js-dist-minand use import or require in node.js
// ES6 module
import Plotly from 'plotly.js-dist-min'
// CommonJS
var Plotly = require('plotly.js-dist-min')You may also consider using plotly.js-dist if you prefer using an unminified package.
Load via script tag
The script HTML element
In the examples below
Plotlyobject is added to the window scope byscript. ThenewPlotmethod is then used to draw an interactive figure as described bydataandlayoutinto the desireddivhere namedgd. As demonstrated in the example above basic knowledge ofhtmland JSON syntax is enough to get started i.e. with/without JavaScript! To learn and build more with plotly.js please visit plotly.js documentation.
<head> <script src="https://cdn.plot.ly/plotly-2.8.0.min.js"></script> </head> <body> <div id="gd"></div> <script> Plotly.newPlot("gd", /* JSON object */ { "data": [{ "y": [1, 2, 3] }], "layout": { "width": 600, "height": 400} }) </script> </body>
