JSFiddle - React, Tailwind, and code Playground

HTML

<div id="canvas"></div>

JavaScript

var paper = Raphael("canvas", 600, 600); 
var line = this.paper.path('M10 10 L50 50');

var start = function () {
      this.odx = 0;
      this.ody = 0;
},
move = function (dx, dy) {
      this.translate(dx - this.odx, dy - this.ody);
      this.odx = dx;
      this.ody = dy;
},
up = function () {};

line.drag(move, start, up);

line.mouseover(function(e) {
    line.attr('stroke', 'red');
});

line.mouseout(function(e) {
  line.attr('stroke', 'black');
});