Fully use d3.js in environments without DOM, such as Cloudflare Workers or Vercel Functions

• Extensible and simple API.
• Support for asynchronous operations
• Utilities like sanitizing the HTML or outputting the base64 from generated svg
• Tests covering most of the functionality

d3-no-dom's peerDependencies are jsdom and d3. These ones are not bundled into this package itself for extensibility purposes - d3-no-dom is just a wrapper around these libraries' functionality

npm i d3-no-dom d3 jsdom
# or
yarn add d3-no-dom d3 jsdom
# or
pnpm add d3-no-dom d3 jsdom 

1. At first, you must supply the own peers instances to the d3-no-dom

import * as d3 from "d3"
import { JSDOM } from "jsdom"

// ...

const { render } = prepareSvgServerSideRenderer({
  jsdomInstance: JSDOM,
  d3Instance: d3
});

2. Next, use the render function. It provides everything you need in order to fully use d3.js on the server side along with virtual DOM

const result = render(async ({ d3Selection, svgNode, currentDom }) => {
//      ↑                            ↑        ↑          ↑            
//      │          d3 selected       │        │          │
//      │          object to work on ╯        │          ╰ whole DOM  
//      │                                underlying
//      ╰ rendered svg's           svg DOM node to work on
//   source, as HTML or base64   
})

3. (Optionally) adjust your configuration or prepareSvgRenderer's options or the render function's options directly in order to e.g. disable sanitizing the HTML or control the return value (whether it should be HTML or base64 - where second is specifically useful with usage with satori)

The MIT License. All contributions are welcome!