🏠 back to Observable

Best library to plot many circles with different radii and axis

I’m want to plot a bunch of circles with radius and add an x-y axis to it. (It is for some simulation of biological cells.)

Now, there are many nice plotting libraries which give good axis and styling, but they all seem to lack a function to plot circles where the radius is given in physical units and not in pixels?
(I feel kind of stupid for asking here, probably I just missed something.)

I tried Vega, VegaLite, Plotly; They seem support circles just as shapes (for example https://plotly.com/javascript/shapes/#circle) or as scatter plots were the sizes is not directly controllable.
In the end, I want to draw an animation, with many circles, so

For the scene, I’m happy to use just canvas, but when using canvas, but I don’t want to draw the whole axis myself.

hi @SteffenPL

You’re probably looking into the amazing d3 modules designed for such application

d3-scale

d3-axis

and a chart template

1 Like

Thanks for the hints, yes, D3 will certainly be powerful enough to do these things. I must admit that I was hoping for a non-D3 solution since D3 is quite low-level. (Thinks like axis-equal etc need much more code than a simple scatter(x,y,r, axis_equal=true))