Issue : chart.js graph overlaping text when width is specified

[jpminnovation]

When creating a graph with the chartjs engine and specifying the width of the graph, it the overlap the following text. This behavior does not appear with the c3js and chartist engines.

Here is a part of the document to reproduce the issue :

== An example

=== chart.js

chart::sample-data.csv[line,engine="chartjs",width="1000"]

Here, the text will be covered by the graph.

=== c3.js

chart::sample-data.csv[line,engine="c3js",width="100%"]

Here, the text will *not be covered* by the graph, *as expected*.

The result is :

Result obtained via using :

• asciidoctor 2.0.16
• asciidoctor-chart 1.0.0.alpha.1 (yes, I do know this is an alpha release).

[ggrossetie]

I think the main issue is that Chart.js does not support width and height. The only reasonable thing we can do is ignore the width and height attribute (unless I'm missing something in the documentation?)

Do you agree?

[jpminnovation]

It somehow react to width as it then grows "bigger" (but overlap the next section). If width & height are not documented in chart.js, then OK to ignore both parameters.

[ggrossetie]

Actually, Chart.js does provide some configuration options but the parent container must be relatively positioned: https://www.chartjs.org/docs/3.5.0/configuration/responsive.html

I need to do some tests to make sure that there's no side effect.