JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var dps = [];
var selected = -1;
var chart = new CanvasJS.Chart("chartContainer", {   
	theme: "dark1",
  title: {
    text: "Chart with Draggable StripLines",
    fontColor: "#ADAD10"
  },
  backgroundColor: "#000",
  axisX: [{
  	lineDashType: "dot",
    stripLines: [{
      value: 7,
      lineDashType: "dash",
      color: "#ADAD10",
    },{
      value: 23,
      lineDashType: "dash",
      color: "#ADAD10",
    }],
    
  }],
  axisY: {
  	gridDashType: "dot",
    lineDashType: "dot"
  },
  data: [{
    type: "line",
    color: "#ADAD10",
    dataPoints: dps
  }]
});

var xVal = 0;
var yVal = 100; 
var dataLength = 30; 

var updateChart = function (count) {

	count = count || 1;

	for (var j = 0; j < count; j++) {
		yVal = yVal +  Math.round(5 + Math.random() *(-5-5));
		dps.push({
			x: xVal,
			y: yVal
		});
		xVal++;
	}

	chart.render();
};

updateChart(dataLength);

$(".canvasjs-chart-canvas").last().on("mousedown", function(e) {
  // Get the selected stripLine & change the cursor
  var parentOffset = $(this).parent().offset();
  var relX = e.pageX - parentOffset.left;
  var relY = e.pageY - parentOffset.top;
  var snapDistance = 10;

  for(var i = 0; i < chart.options.axisX[0].stripLines.length; i++) {
    if(relX > chart.axisX[0].stripLines[i].get("bounds").x1 - snapDistance && relX < chart.axisX[0].stripLines[i].get("bounds").x2 + snapDistance && relY > chart.axisX[0].stripLines[i].get("bounds").y1 && relY < chart.axisX[0].stripLines[i].get("bounds").y2) {
      selected = i;
      $(this).css("cursor","pointer");
    }
  }
});

$(".canvasjs-chart-canvas").last().on("mousemove", function(e) {
  // Move the selected stripLine
  if(selected !== -1) {
    var parentOffset = $(this).parent().offset();
    var relX = e.pageX - parentOffset.left;
    chart.options.axisX[0].stripLines[selected].value = chart.axisX[0].convertPixelToValue(relX);
    chart.render();
  }
});

$(".canvasjs-chart-canvas").last().on("mouseup", function(e) {
  // Clear Selection...