Whats the proper way of setting the viewbox to Auto

[Emporea]

I am not sure if this is more of a css / html related question.

But the issue I am facing is regarding the size of my plots. I have an irregular amount of data and for example bar plots get automatically bigger the more data I have. But I have to adjust the svg viewport manually so that the additional height doesn't get cropped.

Is there another possibility?

[Fil]

You can control the dimensions of the returned chart by explicitly setting width and height:

Plot.plot({
  width: 500,
  height: 300,
  marks: [...]
})

If this doesn't answer your question, please be more specific and include an example?

[Emporea]

Thanks for your answer. I know about this. But I would like to have the possibility to scale it automatically regarding the amount of data.
Otherwise it gets very small on > 20 drawn bars.

Either I need to be able to set the viewBox to the autogenerated height attrubite of Plot, or I need to calculate the heights beforehand with a (fixed value * amount of bars).
Eitherway I need to be able to set the ViewBox accordingly. How can I set the svg Attribute inside:

document.getElementById("wordcloud").appendChild(
  Plot.plot({
    width: 640,
    height: 400,
    marks: [
      Plot.barX(e.aggregations.wordcloud.buckets, {
        y: "key",
        x: "doc_count",
        stroke: "#432818",
        fill: "#99582A",
        opacity: 0.5,
      }),
    ],
  })
);

PS: Is it recommended to append svg inside a div dynamically or create a static one in html?

[Fil]

Sorry for the belated reply. What Plot.plot returns is a SVG element, and you can use its setAttribute method as you wish; or use d3.select(Plot.plot(…)).attr("viewBox", […]).node() if this is more convenient. See #974 for more details