Vuetify 2. I am trying to make a Sparkline with a very long x-axis, so I want it to have a horizontal scrollbar (otherwise the labels are unreadable). I also want it to be inside a Sheet (so that I can eventually overlay other lines).

Normally to force a horizontal scrollbar I would have something with a large width inside a DIV with “overflow-x: auto”. But when I make the Sheet or Sparkline width large, the height of the chart increases as well, as if it has a built-in size ratio. Also the line becomes much thicker.

Any ideas please? Thanks.

https://codepen.io/hobbeschild/pen/QWRgeKv

Try playing with the Sheet or Sparkline width in this codepen.
I am trying to get a very wide chart that remains a short height.

<div id="app">
  <v-app id="inspire">
    <div style="overflow-x: auto;">
      <v-sheet width="1000">
        <v-sparkline
          :value="value"
          line-width="1"
        ></v-sparkline>
        </v-sheet>
    </div>
  </v-app>
</div>

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: () => ({
    value: [0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0, 0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0, 0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0, 0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0],
  }),
})