diff --git a/.npmignore b/.npmignore index 55981ad3e35..ee62c8a2a7b 100644 --- a/.npmignore +++ b/.npmignore @@ -9,3 +9,12 @@ test dist/extras/mathjax circle.yml +docker-compose.yml +bower.json + +.ackrc +.agignore +.eslintignore +.eslintrc + +npm-debug.log diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 9081b3d311b..368a4e8fc53 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -106,9 +106,10 @@ To view the results of a run on CircleCI, download the `build/test_images/` and ### Repo organization - Distributed files are in `dist/` +- CommonJS require-able modules are in `lib/` - Sources files are in `src/`, including the index - Build and repo management scripts are in `tasks/` -- All tasks can be run using [`npm run-srcript`](https://docs.npmjs.com/cli/run-script) +- All tasks can be run using [`npm run-script`](https://docs.npmjs.com/cli/run-script) - Tests are `test/`, they are partitioned into `image` and `jasmine` tests - Test dashboard and image viewer code is in `devtools/` - Non-distributed, built files are in `build/` (most files in here are git-ignored, the css and font built files are exceptions) diff --git a/README.md b/README.md index da6c7a43b04..82b9f9aadc2 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ -[![npm version](https://badge.fury.io/js/plotly.js.svg)](https://badge.fury.io/js/plotly.js) +[![npm version](https://badge.fury.io/js/plotly.js.svg)](https://badge.fury.io/js/plotly.js) [![circle ci](https://circleci.com/gh/plotly/plotly.js.png?&style=shield&circle-token=1f42a03b242bd969756fc3e53ede204af9b507c0)](https://circleci.com/gh/plotly/plotly.js) Built on top of [d3.js](http://d3js.org/) and [stack.gl](http://stack.gl/), @@ -10,6 +10,7 @@ chart types, including 3D charts, statistical graphs, and SVG maps. ## Table of contents * [Quick start options](#quick-start-options) +* [Modules](#modules) * [Bugs and feature requests](#bugs-and-feature-requests) * [Documentation](#documentation) * [Contributing](#contributing) @@ -38,9 +39,46 @@ npm install plotly.js ```html + + + ``` -Read the [Getting started page](https://plot.ly/javascript/getting-started/) for examples. +Read the [Getting started page](https://plot.ly/javascript/getting-started/) for more examples. + +## Modules + +If you would like to reduce the bundle size of plotly.js, you can create a *custom* bundle by using `plotly.js/lib/core`, and loading only the trace types that you need (e.g. `pie` or `choropleth`). The recommended way to do this is by creating a *bundling file*: + +```javascript +// in custom-plotly.js +var plotlyCore = require('plotly.js/lib/core'); + +// Load in the trace types for pie, and choropleth +plotlyCore.register([ + require('plotly.js/lib/pie'), + require('plotly.js/lib/choropleth'); +]); + +module.exports = customPlotly; +``` + +Then elsewhere in your code: + +```javascript +var Plotly = require('./path/to/custom-plotly'); +``` + +**IMPORTANT**: the plotly.js code base contains some non-ascii characters. Therefore, please make sure to set the `chartset` attribute to `"utf-8"` in the script tag that imports your plotly.js bundle. For example: + +```html + +``` + + +#### Webpack Usage with Modules + +Browserify [transforms](https://github.com/substack/browserify-handbook#transforms) are required to build plotly.js, namely, [glslify](https://github.com/stackgl/glslify) to transform WebGL shaders and [cwise](https://github.com/scijs/cwise) to compile component-wise array operations. To make the trace module system work with Webpack, you will need to install [ify-loader](https://github.com/hughsk/ify-loader) and add it to your `webpack.config.json` for your build to correctly bundle plotly.js files. ## Bugs and feature requests diff --git a/lib/bar.js b/lib/bar.js new file mode 100644 index 00000000000..2a8e2b757f5 --- /dev/null +++ b/lib/bar.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/bar'); diff --git a/lib/box.js b/lib/box.js new file mode 100644 index 00000000000..9a64cac7fef --- /dev/null +++ b/lib/box.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/box'); diff --git a/lib/choropleth.js b/lib/choropleth.js new file mode 100644 index 00000000000..11eeb51fe80 --- /dev/null +++ b/lib/choropleth.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/choropleth'); diff --git a/lib/contour.js b/lib/contour.js new file mode 100644 index 00000000000..0994a3f6c00 --- /dev/null +++ b/lib/contour.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/contour'); diff --git a/lib/core.js b/lib/core.js new file mode 100644 index 00000000000..ca083777651 --- /dev/null +++ b/lib/core.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/core'); diff --git a/lib/heatmap.js b/lib/heatmap.js new file mode 100644 index 00000000000..454cb301922 --- /dev/null +++ b/lib/heatmap.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/heatmap'); diff --git a/lib/histogram.js b/lib/histogram.js new file mode 100644 index 00000000000..6ab60e5b8ec --- /dev/null +++ b/lib/histogram.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/histogram'); diff --git a/lib/histogram2d.js b/lib/histogram2d.js new file mode 100644 index 00000000000..87acc3ba825 --- /dev/null +++ b/lib/histogram2d.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/histogram2d'); diff --git a/lib/histogram2dcontour.js b/lib/histogram2dcontour.js new file mode 100644 index 00000000000..683d3679b1b --- /dev/null +++ b/lib/histogram2dcontour.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/histogram2dcontour'); diff --git a/lib/index.js b/lib/index.js new file mode 100644 index 00000000000..8a7548e57a7 --- /dev/null +++ b/lib/index.js @@ -0,0 +1,35 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +'use strict'; + +/* + * This file is browserify'ed into a standalone 'Plotly' object. + */ + +var Core = require('./core'); + +// Load all trace modules +Core.register([ + require('./bar'), + require('./box'), + require('./heatmap'), + require('./histogram'), + require('./histogram2d'), + require('./histogram2dcontour'), + require('./pie'), + require('./contour'), + require('./scatter3d'), + require('./surface'), + require('./mesh3d'), + require('./scattergeo'), + require('./choropleth'), + require('./scattergl') +]); + +module.exports = Core; diff --git a/lib/mesh3d.js b/lib/mesh3d.js new file mode 100644 index 00000000000..e281a26ab26 --- /dev/null +++ b/lib/mesh3d.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/mesh3d'); diff --git a/lib/pie.js b/lib/pie.js new file mode 100644 index 00000000000..8be17550c5e --- /dev/null +++ b/lib/pie.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/pie'); diff --git a/lib/scatter.js b/lib/scatter.js new file mode 100644 index 00000000000..f59c36a07b8 --- /dev/null +++ b/lib/scatter.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/scatter'); diff --git a/lib/scatter3d.js b/lib/scatter3d.js new file mode 100644 index 00000000000..69dd0512774 --- /dev/null +++ b/lib/scatter3d.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/scatter3d'); diff --git a/lib/scattergeo.js b/lib/scattergeo.js new file mode 100644 index 00000000000..491e96851c6 --- /dev/null +++ b/lib/scattergeo.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/scattergeo'); diff --git a/lib/scattergl.js b/lib/scattergl.js new file mode 100644 index 00000000000..9e024c57e62 --- /dev/null +++ b/lib/scattergl.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/scattergl'); diff --git a/lib/surface.js b/lib/surface.js new file mode 100644 index 00000000000..9662d59d93f --- /dev/null +++ b/lib/surface.js @@ -0,0 +1,9 @@ +/** +* Copyright 2012-2016, Plotly, Inc. +* All rights reserved. +* +* This source code is licensed under the MIT license found in the +* LICENSE file in the root directory of this source tree. +*/ + +module.exports = require('../src/traces/surface'); diff --git a/package.json b/package.json index f078f74f983..10443e07d8e 100644 --- a/package.json +++ b/package.json @@ -3,8 +3,8 @@ "version": "1.4.1", "description": "The open source javascript graphing library that powers plotly", "license": "MIT", - "main": "./src/index.js", - "webpack": "./dist/plotly.min.js", + "main": "./lib/index.js", + "webpack": "./dist/plotly.js", "repository": { "type": "git", "url": "https://github.com/plotly/plotly.js.git" diff --git a/src/index.js b/src/core.js similarity index 67% rename from src/index.js rename to src/core.js index 7c32c585055..7737895d51e 100644 --- a/src/index.js +++ b/src/core.js @@ -10,9 +10,6 @@ /* * Export the plotly.js API methods. - * - * This file is browserify'ed into a standalone 'Plotly' object. - * */ var Plotly = require('./plotly'); @@ -32,6 +29,7 @@ exports.addTraces = Plotly.addTraces; exports.deleteTraces = Plotly.deleteTraces; exports.moveTraces = Plotly.moveTraces; exports.setPlotConfig = require('./plot_api/set_plot_config'); +exports.register = Plotly.register; // plot icons exports.Icons = require('../build/ploticon'); @@ -45,20 +43,3 @@ exports.Queue = Plotly.Queue; // export d3 used in the bundle exports.d3 = require('d3'); - -Plotly.register([ - require('./traces/bar'), - require('./traces/box'), - require('./traces/heatmap'), - require('./traces/histogram'), - require('./traces/histogram2d'), - require('./traces/histogram2dcontour'), - require('./traces/pie'), - require('./traces/contour'), - require('./traces/scatter3d'), - require('./traces/surface'), - require('./traces/mesh3d'), - require('./traces/scattergeo'), - require('./traces/choropleth'), - require('./traces/scattergl') -]); diff --git a/tasks/bundle.js b/tasks/bundle.js index a74c38992a9..45de5f03649 100644 --- a/tasks/bundle.js +++ b/tasks/bundle.js @@ -35,7 +35,7 @@ catch(e) { // Browserify plotly.js -browserify(constants.pathToPlotlySrc, { +browserify(constants.pathToPlotlyIndex, { debug: DEV, standalone: 'Plotly', transform: [compressAttributes] @@ -65,7 +65,7 @@ browserify(constants.pathToPlotlyGeoAssetsSrc, { // Browserify the plotly.js with meta -browserify(constants.pathToPlotlySrc, { +browserify(constants.pathToPlotlyIndex, { debug: DEV, standalone: 'Plotly' }) diff --git a/tasks/cibundle.js b/tasks/cibundle.js index 8e1db62885d..11ba2c88187 100644 --- a/tasks/cibundle.js +++ b/tasks/cibundle.js @@ -16,7 +16,7 @@ var constants = require('./util/constants'); // Browserify plotly.js -browserify(constants.pathToPlotlySrc, { +browserify(constants.pathToPlotlyIndex, { standalone: 'Plotly', transform: [compressAttributes] }) diff --git a/tasks/header.js b/tasks/header.js index 1d1566f47e0..96b327946c0 100644 --- a/tasks/header.js +++ b/tasks/header.js @@ -32,8 +32,9 @@ pathsDist.forEach(headerLicense); var licenseSrc = constants.licenseSrc; var licenseStr = licenseSrc.substring(2, licenseSrc.length - 2); - -glob(path.join(constants.pathToSrc, '**/*.js'), function(err, files) { +var srcGlob = path.join(constants.pathToSrc, '**/*.js'); +var libGlob = path.join(constants.pathToLib, '**/*.js'); +glob('{' + srcGlob + ',' + libGlob + '}', function(err, files){ files.forEach(function(file) { fs.readFile(file, 'utf-8', function(err, code) { diff --git a/tasks/preprocess.js b/tasks/preprocess.js index c6819d19019..4f8ddc883a8 100644 --- a/tasks/preprocess.js +++ b/tasks/preprocess.js @@ -31,5 +31,5 @@ fs.copy(constants.pathToTopojsonSrc, constants.pathToTopojsonDist, ); // inject package version into source index files -updateVersion(constants.pathToPlotlySrc); +updateVersion(constants.pathToPlotlyCore); updateVersion(constants.pathToPlotlyGeoAssetsSrc); diff --git a/tasks/util/constants.js b/tasks/util/constants.js index 574f707dbe5..00017cbd006 100644 --- a/tasks/util/constants.js +++ b/tasks/util/constants.js @@ -4,6 +4,7 @@ var pkg = require('../../package.json'); var pathToRoot = path.join(__dirname, '../../'); var pathToSrc = path.join(pathToRoot, 'src/'); +var pathToLib = path.join(pathToRoot, 'lib/'); var pathToImageTest = path.join(pathToRoot, 'test/image'); var pathToDist = path.join(pathToRoot, 'dist/'); var pathToBuild = path.join(pathToRoot, 'build/'); @@ -17,8 +18,10 @@ var year = (new Date()).getFullYear(); module.exports = { pathToRoot: pathToRoot, pathToSrc: pathToSrc, + pathToLib: pathToLib, - pathToPlotlySrc: path.join(pathToSrc, 'index.js'), + pathToPlotlyIndex: path.join(pathToLib, 'index.js'), + pathToPlotlyCore: path.join(pathToSrc, 'core.js'), pathToPlotlyBuild: path.join(pathToBuild, 'plotly.js'), pathToPlotlyDist: path.join(pathToDist, 'plotly.js'), pathToPlotlyDistMin: path.join(pathToDist, 'plotly.min.js'), diff --git a/tasks/util/make_watchified_bundle.js b/tasks/util/make_watchified_bundle.js index d0ed7f3e382..4ec381f9e9a 100644 --- a/tasks/util/make_watchified_bundle.js +++ b/tasks/util/make_watchified_bundle.js @@ -18,7 +18,7 @@ var constants = require('./constants'); * */ module.exports = function makeWatchifiedBundle(onFirstBundleCallback) { - var b = browserify(constants.pathToPlotlySrc, { + var b = browserify(constants.pathToPlotlyIndex, { debug: true, standalone: 'Plotly', transform: [compressAttributes], diff --git a/tasks/util/shortcut_paths.js b/tasks/util/shortcut_paths.js index e293007c337..5670261f9e4 100644 --- a/tasks/util/shortcut_paths.js +++ b/tasks/util/shortcut_paths.js @@ -10,6 +10,7 @@ var constants = require('./constants'); var shortcutsConfig = { '@src': constants.pathToSrc, + '@lib': constants.pathToLib, '@mocks': constants.pathToTestImageMocks }; diff --git a/test/jasmine/tests/click_test.js b/test/jasmine/tests/click_test.js index 50aa73bf636..18c49542b06 100644 --- a/test/jasmine/tests/click_test.js +++ b/test/jasmine/tests/click_test.js @@ -1,4 +1,4 @@ -var Plotly = require('@src/index'); +var Plotly = require('@lib/index'); var Lib = require('@src/lib'); var createGraphDiv = require('../assets/create_graph_div'); diff --git a/test/jasmine/tests/gl_plot_interact_test.js b/test/jasmine/tests/gl_plot_interact_test.js index 97a0e6e8d9d..2f7bf0b04a5 100644 --- a/test/jasmine/tests/gl_plot_interact_test.js +++ b/test/jasmine/tests/gl_plot_interact_test.js @@ -1,6 +1,6 @@ var d3 = require('d3'); -var Plotly = require('@src/index'); +var Plotly = require('@lib/index'); var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div'); diff --git a/test/jasmine/tests/hover_label_test.js b/test/jasmine/tests/hover_label_test.js index 832427d4a11..e01fcdf606f 100644 --- a/test/jasmine/tests/hover_label_test.js +++ b/test/jasmine/tests/hover_label_test.js @@ -1,6 +1,6 @@ var d3 = require('d3'); -var Plotly = require('@src/index'); +var Plotly = require('@lib/index'); var Fx = require('@src/plots/cartesian/graph_interact'); var Lib = require('@src/lib'); diff --git a/test/jasmine/tests/hover_pie_test.js b/test/jasmine/tests/hover_pie_test.js index 03ea75173d3..c0c6baaa50b 100644 --- a/test/jasmine/tests/hover_pie_test.js +++ b/test/jasmine/tests/hover_pie_test.js @@ -1,4 +1,4 @@ -var Plotly = require('@src/index'); +var Plotly = require('@lib/index'); var Lib = require('@src/lib'); var createGraphDiv = require('../assets/create_graph_div'); diff --git a/test/jasmine/tests/plot_api_test.js b/test/jasmine/tests/plot_api_test.js index de3a660ce80..47fc96b4ffe 100644 --- a/test/jasmine/tests/plot_api_test.js +++ b/test/jasmine/tests/plot_api_test.js @@ -1,4 +1,4 @@ -var Plotly = require('@src'); +var Plotly = require('@lib/index'); var PlotlyInternal = require('@src/plotly'); var Plots = require('@src/plots/plots'); var Lib = require('@src/lib'); diff --git a/test/jasmine/tests/plot_interact_test.js b/test/jasmine/tests/plot_interact_test.js index bdf46fafbd7..74327447fee 100644 --- a/test/jasmine/tests/plot_interact_test.js +++ b/test/jasmine/tests/plot_interact_test.js @@ -1,6 +1,6 @@ var d3 = require('d3'); -var Plotly = require('@src/index'); +var Plotly = require('@lib/index'); var createGraphDiv = require('../assets/create_graph_div'); var destroyGraphDiv = require('../assets/destroy_graph_div');