implot icon indicating copy to clipboard operation
implot copied to clipboard

[Feature] Plot polygon

Open ssteinbach opened this issue 5 months ago • 3 comments

Hi, love this library, thank you for all the great work. I'm trying to use the fill features to add some shading within plotted shapes and noticing that the fill doesn't seem to be as precise for the concave shapes I'm drawing.

See this image:

Image

The red line should be the boundary of the shape, and I was hoping to fill within the boundary. You can see that the fill is spilling out from the shape to make it more square (and it seems to be a different opacity).

Currently I'm drawing the outline as a clockwise loop. The fill is drawn using plotShaded with the exact same clockwise loop of points.

I was wondering if this is user error or a known issue or if there were any work arounds here? I could tesselate this shape by hand,

Thanks again!

Edit, also just noticed that the fill on the top doesn't line up either:

Image

ssteinbach avatar Jul 30 '25 19:07 ssteinbach

Here is a small set of points to reproduce the problem:

// as x/y pairs
const points = &[_][2]f32{
    .{ 0.0,  0.0 },
    .{ 1.0, -0.1 },
    .{ 0.5, -0.5 },
    .{ 1.0, -0.9 },
    .{ 0.0, -1.0 },
    .{ 0.0,  0.0 },
};

// broken up by component
const xs = [_]f32{
    0.0,
    1.0,
    0.5,
    1.0,
    0.0,
    0.0,
};
const ys = [_]f32{
     0.0,
    -0.1,
    -0.5,
    -0.9,
    -1.0,
     0.0,
};

That produces this graph:

Image

ssteinbach avatar Aug 01 '25 18:08 ssteinbach

Hi @ssteinbach, as far as I know, the PlotShaded can't handle concave shapes yet. Here's the description of the PlotShaded:

// Plots a shaded (filled) region between two lines, or a line and a horizontal reference. Set yref to +/-INFINITY for infinite fill extents.

If you really want to use PlotShaded, the best I can think now is to split your shape into convex shapes, and for each convex shape, define a "top line" and a "bottom line" (at each index they have the same X value, but different Y values). Then you could use the method below:

IMPLOT_TMP void PlotShaded(const char* label_id, const T* xs, const T* ys1, const T* ys2, int count, ImPlotShadedFlags flags=0, int offset=0, int stride=sizeof(T));

Alternatively, an easier way to do this would be to split your concave shape into triangles and draw it as an ImGui (check CustomRendering demo)

Obs: I would love to support something like ImGui::PlotPolygon 👀 I can see it being very useful to plot arbitrary filled shapes.

brenocq avatar Dec 01 '25 08:12 brenocq

I use tencent's earcut library to solve this problem in other imgui apps, maybe that's an option here.

meshula avatar Dec 02 '25 07:12 meshula