JSFiddle - React, Tailwind, and code Playground

CSS

.node {
            fill: #000;
            font-family: sans-serif;
            font-size: 12px;
            color: white;
        }

        .link {
            stroke: #999;
            stroke-width: 5px;
        }

        .text {
            font-family: "sans-serif";
            font-size: 15px;
            fill: white;
        }

JavaScript

(function () {

            var data =
            [
                { name: "Cost" },
                { name: "Scope" },
                { name: "Time" }
            ];

            var dataLinks = [
                { source: 0, target: 1 },
                { source: 1, target: 2 },
                { source: 2, target: 0 }
            ];

            var width = 960,
                height = 500;

            var force = d3.layout.force()
                .size([960, 500])
                .nodes(data)
                .links(dataLinks)
                .linkDistance(220)
                .charge(-20)
                .on("tick", tick);

            var svg = d3.select("body").append("svg")
                .attr("width", width)
                .attr("height", height);


            var links =
                svg.selectAll(".link")
                    .data(dataLinks)
                    .enter().append("line")
                    .attr("class", "link");

            var nodes =
                svg.selectAll(".node")
                    .data(data)
                    .enter().append("circle")
                    .attr("class", "node")
                    .attr("r", 40)
                    .call(force.drag);

            var text =
                svg.selectAll(".text")
                    .data(data)
                    .enter()
                    .append("text").attr("class", "text")
                    .text(function (d) { return d.name; });

            force.start();

            function tick() {
                links.attr("x1", function (d) { return d.source.x; })
                    .attr("y1", function (d) { return d.source.y; })
                    .attr("x2", function (d) { return d.target.x; })
                    .attr("y2", function (d) { return d.target.y; });

                nodes.attr("cx", function (d) { return d.x; })
                    .attr("cy", function (d) { return d.y; });

                text.attr("x", function (d) { return d.x - 15; })
 ...