Hướng dẫn dùng plotly JavaScript

NPM

You can install Plotly.js from NPM via npm install plotly.js-dist or yarn install plotly.js-dist

plotly.js CDN

You can also use the ultrafast plotly.js CDN link. This CDN is graciously provided by the incredible team at Fastly.

Download

Download the minified plotly.js source code and dependencies.

Include the downloaded scripts before the end of the tag in your HTML document:

Download plotly.js

Start plotting!

In your HTML document, create an empty DIV to draw the graph in:

Now you can make interactive plotly.js charts using Plotly.newPlot().

Now you can pass Plotly.newPlot() either the ID of the DIV ("tester") or the DIV DOM element (TESTER).

Webpack user?

For plotly.js to build with Webpack you will need to install + and add it to your webpack.config.json. This adds Browserify transform compatibility to Webpack which is necessary for some plotly.js dependencies.

A repo that demonstrates how to build plotly.js with Webpack can be found here. In short add ify-loader to the module section in your webpack.config.js:

  ...
      module: {
          rules: [
              {
                  test: /\.js$/,
                  loader: 'ify-loader'
              }
          ]
      },
  ...
          

Hello World Example