JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d3js.org/d3.v2.js"></script>
<div id="svg">

</div>

JavaScript

var s; // private alias to settings
    var entityWidth = 130;
    var entityHeight = 65;
    var sceneWidth = 1000;
    var sceneHeight = 600;
    var dropzoneWidth = 650;
    
    function initD3() {
        
        var drag = d3.behavior.drag()
                    .origin(function (d) { return d; })
                    .on("dragstart", dragstarted)
                    .on("drag", dragged)
                    .on("dragend", dragended);

        //Create the responsive svg
        var svg = d3.select("#svg")
                    .append("div")
                    .classed("svg-container", true) //container class to make it responsive
                    .append("svg")
                    //responsive SVG needs these 2 attributes and no width and height attr
                    .attr("preserveAspectRatio", "xMinYMin meet")
                    .attr("viewBox", "0 0 " + sceneWidth + " " + sceneHeight)
                    //class to make it responsive
                    .classed("svg-content-responsive", true);

        //Create the scene
        var line = svg.selectAll("line")
                     .data([{ x1: dropzoneWidth, y1: 0, x2: dropzoneWidth, y2: sceneHeight }])
                     .enter()
                     .append("line")
                     .attr("x1", function (d) { return d.x1; })
                     .attr("x2", function (d) { return d.x2; })
                     .attr("y1", function (d) { return d.y1; })
                     .attr("y2", function (d) { return d.y2; })
                     .attr("stroke", "grey")
                     .attr("stroke-width", 2)
                     .attr("stroke-dasharray", "5,5");
        
        var rects = svg.selectAll("rect")
                      .data([{ class: "dropzone", x: 0, y: 0, width: dropzoneWidth, height: sceneHeight },
                             { class: "startzone", x: dropzoneWidth, y: 0, width: sceneWidth - dropzoneWidth, height: sceneHeight }])
                     .enter()
                 ...