Helper

Useful unities.

cm.pathContext()

Constructs a new path generator like d3-path serializer, expect returns an array of path commands instead of a path string. Useful for charming to render the path generated by d3-shape or d3-geo without parsing it, which is good for performance.

const circle = d3.geoCircle()();
const projection = d3.geoOrthographic().translate([0, 0]).scale(10);
const path = d3.geoPath(projection);

app.append(cm.path, {
  d: () => {
    const context = cm.pathContext();
    path.context(context)(circle);
    return context.toArray();
  },
});

See d3-path for more CanvasPathMethods.

pathContext.toArray()

Returns the array of path commands.

const context = cm.pathContext();
context.moveTo(0, 0);
context.lineTo(10, 0);
context.lineTo(10, 10);
context.closePath();
context.toArray(); // [["M", 0, 0], ["L", 10, 0], ["L", 10, 10], ["Z"]]