Export an Image

Learn how to export images as bitmaps and SVGs from D3 pages.

At some point, you will want to take your lovingly crafted D3 graphical masterpiece and put it in a (close your eyes if you’re squeamish) PowerPoint presentation, Word document, or export it for sharing in some other way.

There could be many reasons for wanting to do this and some may be more complicated than I will be willing to explore. But for the occasional conversion of images, I have found what I regard as a fairly easy process.

Before we begin our exporting odyssey, let’s cover a little bit of housekeeping and describe the difference between a vector graphic (in this case, specifically Scalable Vector Graphics) and a bitmap. Please skip ahead if you’re comfortable with the terms.

Bitmaps

A bitmap (or raster) image is one that is composed of lots of discrete individual dots (let’s call them pixels), which when joined together (and zoomed out a bit) give the impression of an image. If we use the force layout example we developed and look at a screenshot (and it’s important to remember that this is a screenshot) of the image, we see a picture that looks fairly benign.

Get hands-on with 1400+ tech skills courses.