JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.6.0/chart.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-dragdata@2.2.4/dist/chartjs-plugin-dragdata.min.js"></script>
<input id="axis-slider" type="range" min="20" max="1000">Axis Range</input>
<canvas id="chartJSContainer" style="height: 200px; width: 300px;"></canvas>

CSS

html,
    body {
      margin: 0;
      padding: 0;
      height: 100%;
    }

    canvas {
      background-color: #eee;
      position: absolute;
      margin: auto;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
    }

JavaScript

var options = {
      type: 'line',
      data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3],
            borderWidth: 1,
            pointHitRadius: 25
          },
          {
            label: '# of Points',
            data: [7, 11, 5, 8, 3, 7],
            borderWidth: 1,
            pointHitRadius: 25
          }
        ]
      },
      options: {
        scales: {
          y: {
            max: 25,
            min: 0
          }
        },
        responsive: false,
        onHover: function(e) {
          const point = e.chart.getElementsAtEventForMode(e, 'nearest', {
            intersect: true
          }, false)
          if (point.length) e.native.target.style.cursor = 'grab'
          else e.native.target.style.cursor = 'default'
        },
        plugins: {
          dragData: {
            round: 1,
            showTooltip: true,
            onDragStart: function(e) {
              // console.log(e)
            },
            onDrag: function(e, datasetIndex, index, value) {
              e.target.style.cursor = 'grabbing'
              // console.log(e, datasetIndex, index, value)
            },
            onDragEnd: function(e, datasetIndex, index, value) {
              e.target.style.cursor = 'default'
              // console.log(datasetIndex, index, value)
            },
          }
        }
      }
    }

    var ctx = document.getElementById('chartJSContainer').getContext('2d');
    window.test = new Chart(ctx, options);
      
      var slider = document.getElementById("axis-slider")
      
      slider.addEventListener("change", event => {
        const value = event.target.value
        options.options.scales.y.max = Math.round(value)
        window.test.update()
      })