Bringing Matplotlib to the Browser

Quick Start Guide

«  mpld3   ::   Contents   ::   Installing mpld3  »

Quick Start Guide

The mpld3 package is extremely easy to use: you can simply take any script generating a matplotlib plot, run it through one of mpld3’s convenience routines, and embed the result in a web page.

The current release of mpld3 can be installed with pip:

pip install mpld3

Then you can make an interactive plot like so:

import matplotlib.pyplot as plt, mpld3
plt.plot([3,1,4,1,5], 'ks-', mec='w', mew=5, ms=20)

For more information on installation, see Installing mpld3. For more examples of mpld3 in action, see the Example Gallery.

Next, we’ll give a quick overview of the basic mpld3 functions you should know about.

General Functions

These are the general functions used to convert matplotlib graphics into HTML and D3js. See some examples of these being used in the Example Gallery.


This is the core routine which takes a figure and constructs a string of HTML and JavaScript which can be embedded in any webpage.


This routine converts a matplotlib image to a JSON-serializable dictionary, which can be loaded into an appropriate HTML page and rendered via the mpld3 JavaScript library. Note that custom plugins which are not built into mpld3 will not be part of the JSON serialization.


This function is mpld3’s equivalent of matplotlib’s function. It will convert the current figure to HTML using fig_to_d3(), start a local webserver which serves this HTML, and (if the operating system allows it) automatically open this page in the web browser.

IPython Notebook Functions

These are functions which enable the use of mpld3 within the IPython notebook. See some examples of these being used in the Notebook Examples.


This function displays a single mpld3 figure inline within the IPython notebook. It is useful if you want to use the standard static figure display hook through the notebook, but override it in a few cases. If you want every matplotlib figure to be displayed via mpld3, use the enable_notebook() function, described below.


This function will adjust the IPython notebook display properties so that mpld3 will be used to display every figure, without having to call display() each time. This is useful if you want every figure to be automatically embedded in the notebook as an interactive JavaScript figure. This function should be called after setting %matplotlib inline mode within the notebook: see the IPython documentation for details.


This function undoes the changes made by enable_notebook(), so that the normal matplotlib backend is used instead.

Saving Figures to File

Figures can be saved to file either in a stand-alone HTML format, or in a JSON format. mpld3 supplies the following convenience routines for this purpose:


Save a figure to a stand-alone HTML file.


Save the JSON representation of the figure to a file. Note that custom plugins which are not built into mpld3 will not be part of the JSON serialization.


The mpld3 plugin framework allows nearly endless possibilities for adding interactive behavior to matplotlib plots rendered in d3. The package includes several built-in plugins, which add zooming, panning, and other interactive behaviors to plots. Several examples of these plugins can be seen in the Example Gallery. For some examples of built-in plugins, see linked_brush, scatter_tooltip and html_tooltips. For some examples of defining custom plugin behavior, see random_walk and custom_plugin. More information on using and creating plugins can be found in the Plugins documentation.

«  mpld3   ::   Contents   ::   Installing mpld3  »