✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
📊 Dash 2.0 is Arriving. Register here.

🎉 Announcing Plotly.js 2.0!

I’m very pleased to announce that yesterday we released version 2.0 of Plotly.js: the core Javascript library that renders all Plotly plots! This release has been more than 5 months in the making (not counting the 5 years of development before that) and I want to specifically praise and thank Mojtaba Samimi (aka @archmoj) for doing essentially all of the implementation and maintenance work on this release – and indeed almost every release in the past year – with design/QA/review support from the rest of our team. :trophy:

Our commitment to semantic versioning requires us to make this release a major version bump because we are making some backwards-incompatible changes to older and deprecated features (see below), but we see this as a low-risk maintenance release and we expect that the vast majority of users should plan to upgrade without fearing significant issues, including Javascript developers who embed Plotly.js directly in their apps or websites, as well as data scientists using Plotly.js via Plotly.py in a notebook environment, and of course Dash app developers!

We encourage all interested developers to read the changelog carefully to find out about every change and bugfix, but here is a summary of the important changes along with some commentary.

:warning: What is getting changed or removed?

We take stability and backwards-compatibility very seriously, so although in principle a new major version could introduce numerous breaking changes, we are bumping the major version number in Plotly.js only because we are removing the following functionality, which we feel is very seldom-used, has long been deprecated and/or has long been un/underdocumented. We are making these changes today so as to be able to continue maintaining the library without needing to invest in upkeep of legacy/unused functionality.

We are dropping:

  • Support for Internet Explorer 9 and 10: our support for these browsers has been poor and degrading for months, and we’re officially ruling out supporting them at all starting now. For reference, Microsoft stopped supporting IE 10 more than 5 years ago.
  • The contourgl trace type: this trace type is not currently in the main bundle, and this removal will only impact users of the gl2d custom bundle. This trace has many problems and is easily replaced by using the non-WebGL-powered contour trace.
  • The area trace type: this trace type has been marked as deprecated and un/under-documented for years; the barpolar trace types should be used instead.
  • The legacy polar r and t attributes of the otherwise-cartesian scatter and bar traces: these attributes have been marked as deprecated and un/under-documented for years; the scatterpolar and barpolar trace types should be used instead.
  • The Plotly.plot() function: this function has been deprecated/under-documented for years, in favour of Plotly.react() or a combination of Plotly.newPlot()/Plotly.restyle()/Plotly.relayout()
  • The Plotly.d3 object: this object currently mirrors all of version 3 of the D3 library. Version 4 of D3 came out over 4 years ago (the current latest version is 6.5!) and the state of Javascript packaging has evolved such that it’s now much easier for Javascript developers to “bring their own” version of d3 to their app rather than rely on the one provided by Plotly.js.

Beyond the removals above, we have made the following changes:

  • We are marking the heatmapgl and pointcloud trace types as “deprecated”, and recommending that folks use the heatmap/image or scattergl trace types instead. These will be removed in a future major version, such as Plotly.js 3.0. If you are using these, please reach out and tell us why and how, so we can take your needs into consideration as we move forward!
  • We are marking the transforms set of attributes in all traces as “deprecated” and recommending that folks use a dedicated data-processing library to compute aggregations.
  • The -latest.min.js CDN bundle will no longer be updated (it will stay pinned to 1.58.4) and there will not be an equivalent for v2. We recommend that folks using Plotly.js explicitly manage the version of the library that they are using.
  • We are no longer providing a build of MathJax in our dist folder and are recommending that folks bring their own MathJax. We are testing with version 2.7.5 and are not yet compatible with version 3.
  • We have changed a few of the user-visible defaults such as setting the default layout.hovermode to closest from x and we have removed by default the spikeline/hovermode buttons from the modebar (although they can be added back in if you like). We have also streamlined the behaviour of our hoverlabels to make them more intuitive and consistent.
  • By popular demand, we have removed the Aa text from legends when using text with lines or markers in scatter traces :slight_smile:
  • textposition for bar traces now defaults to auto so if you want to use text without it appearing on the figure, you’ll need to explicitly set textposition="none"

:hammer_and_wrench: Improvements to packaging and distribution

Since this is mostly a maintenance/cleanup release for us, intended to allow us to move faster in the future, this particular version intentionally does not include many new features, and the ones that are included will be announced in a separate post once the documentation is live.

The one major improvement to the library we have made is that a number of our partial bundles now no longer use function constructors, and therefore do not trigger the corresponding unsafe-eval Content Security Policy error. The bundles that are now function-constructor safe are: basic , cartesian , finance , geo , and mapbox. We are committing to making this a permanent change. We have also added a new partial bundle called strict, which contains the maximal subset of the library that works without using function constructors, and as we are able to refactor the rest of the functionality of Plotly.js to avoid using function constructors we will expand this partial bundle. This security-related work was generously sponsored by Equinor, and we sincerely thank them for their vision and support. :heart:

We have also added a new and easy-to-use mechanism for generating your own custom partial bundles, for cases when the distributed partial bundles don’t quite meet your needs.

Finally, we are pleased that you can now import Plotly.js using ES6 import.

We’ve upgraded our README to try to cover as many installation/loading/building scenarios as we could to guide folks through starting to use Plotly.js. Please check it out as you consider upgrading!

:snake: What about Plotly.py?

Since the plotly.graph_objects module in Plotly.py is automatically generated from Plotly.js, the removals of trace types and attributes listed above force us to change the major version number in Plotly.py as well, to 5.0. We have more information about this upcoming release, including a release candidate for 5.0 available which is built on top of Plotly.js 2.0 if you want to try it out and give us feedback.

:dancer: What about Dash?

Dash depends on Plotly.js via the dcc.Graph component from dash_core_components, although we don’t consider the portions of the Plotly.js schema that were deprecated before Dash was released to be part of the public Dash API. An upcoming minor version of dash_core_components will be upgraded to use Plotly.js 2.0, meaning Dash users will get the new version of Plotly.js via a routine upgrade of the dash package, which depends on dash_core_components.

You can control the exact version of Plotly.js which dcc.Graph loads by placing a specific Plotly.js/version bundle into your Dash app assets directory, meaning that you can try using v2 in your apps right now, or you can control exactly when you upgrade. The same approach allows you to choose a specific partial bundle to use, for example if your app uses only a subset of Plotly.js features, or if your organization policies require to use the new strict bundle to avoid Content Security Policy warnings. We have also added a new and easy-to-use mechanism for generating your own custom partial bundles, for cases when the distributed partial bundles don’t quite meet your needs.

:arrow_right: What now?

We’ve done a lot of testing of the new version in various environments, but the Plotly ecosystem is pretty broad and the web can be a messy place, so we may have broken something in error. Please report issues on GitHub if you encounter them and we’ll try to be responsive with patch versions! In the meantime, we’re right back to work on 2.1 with a new trace type in the pipeline (icicle!) and some other long-requested features.

9 Likes

Congrats! :tada: :tada: :tada:

Big ups to @archmoj !!

5 Likes

Really appreciate the thorough post and big congrats to the Plotly team! The notes are all a bit too low-level for me to relate, but I can understand that this is a great plus. Onwards and upwards!

One thing did stick out to me. Care to share more on what changed with hoverlabels here:

We aligned the behaviour of hovermode='x' and hovermode='x unified' and standardized which points end up getting hovered on when you have a mix of scatter and bar traces, for example, to ensure that you can never get into a situation where you get, say, a scatter point at x=1 being hovered on at the same time as a bar that spans from x=1.5-2.5 when there is also a bar spanning x=0.5-1.5, say. That sort of thing :slight_smile:

Congratulations for this big milestone! And thank you for the continuous improvements (in particular to @archmoj).

I’ve been using plotly.js in several projects for a few years and has always been a tool I could trust. Currently I’m using RC1 in odslocal.pt (direct link: ODSlocal). I didn’t have any problem upgrading from v1 and will now upgrade to the final v2.

Thanks again.

1 Like