Reorganize layout in Posterior Plot

[sarinac]

Tell us about it

The posterior plot example has a lot going on, and it takes a while to figure out where all the numbers (text objects) refer to.

Why it's difficult to read:

• The point estimate is only text instead of a line or marker on the x-axis, so it's hard to tell where exactly the point is on the graph.
• ROPE lower/upper bound numbers are too far away from the shaded region (despite being color coded).
• HDI numbers are a bit better, but could be more obvious. I point this out because the numbers are not horizontally or vertically aligned to the area.
• Reference value should extend across the entire y-axis (instead of stopping before it intersects with HDI).
• With all the text objects in the center, it's a lot of information at once.

Thoughts on implementation

2 proposed options:

Proposed changes:

• Point estimate has a marker on the x-axis. Formatting-wise, if there is a white background then the stroke can also be white to make it stand out.
• ROPE numbers are BELOW the x-axis (this is achieved by moving the spine up to ~10-20% of the plot height instead of leaving it at the bottom). There is a dashed/dotted soft line to vertically align the numbers.
• HDI numbers are right or left aligned (respectively to lower/upper bound) of the shaded area. There are also soft dashed reference lined that show where it starts/ends the HDI along the distribution.
• Reference value line extended to the top of the chart so that it intersects the distribution. Also the text is placed at the top (above the line, so technically the line stops right under the text).
• For left option: text (rope, hdi, point estimate) are horizontally center aligned with the respective measurement. This is so that the text is closer to its object and further from each other.
• For right option: text lives in a "legend-box" at the top. This is achieved by scaling the plot, so that the box takes up ~10% of the plot height.
• Lastly, from a pure design and layering perspective, I recommend from bottom to top: distribution -> HDI -> ROPE -> reference value -> axes -> point estimate -> text
  • The reasoning is that larger objects should go at the bottom.
  • Text should ideally have a thin stroke that's the same color as background so that it stands out if it ever overlaps some line

[OriolAbril]

Thanks, these are great suggestions!

I think we should probably split it in two though. One part is improving the layout of the plot_posterior function, another is working on the examples using plot_posterior in the example gallery. I really like the first layout proposal, however, I think we should generally avoid having all the elements present in the same plot. plot_posterior is a bit of one-stop-shop covering many tasks. When it comes to the example gallery, I would probably have 3-4 examples using plot_posterior with different target tasks.

We could do something like

• Default plot_posterior: only point estimate and hdi. This is already the https://python.arviz.org/en/latest/examples/plot_posterior_combinedims.html one.
• plot_posterior with ROPE. This could be the https://python.arviz.org/en/latest/examples/plot_posterior.html example
• plot_posterior with ref_value
• something else?

The rope and ref_val examples don't even need to have the hdi and point estimate visible, they can be hidden and it is probably a good idea to showcase that too in the example gallery. I am partial to hiding both hdi and point estimate when showing either rope or ref_val, but not very opinionated on this

[canyon289]

Agree, lets split this into the parts Oriol recommended. The new mockups already look way nicer. Id suggest making those changes first, then working on exampel gallery second

[OriolAbril]

I see both as independent tasks, but I would start with the example gallery work. If we do have the example gallery examples updated, we can use them as visual tests when the PR for the mockup changes is ready, we wouldn't need to copy paste the generated images into the PR description (and update them every time we make a new commit to the PR).

I will also be working on refactoring the API starting this September. I am not sure about the rest of ArviZ people, but I won't be able to make the changes to the codebase to follow the mockup layout (and doing them means doing them twice with no re-use of the work between matplotlib and bokeh with the current codebase). I also don't think it would be a good use of @sarinac time to wrangle with the codebase, api and so on to implement this herself. At least not until we have improved layout suggestions and example plots for all arviz functions.