Table tooltip example

Example of table tooltip created with TnT Tooltip

<!DOCTYPE html>

<body>
    <div id="container" style="padding:30px; position:relative" ></div>
    <script>
    var t = function (data) {
        var obj = {};
        obj.header = data.name;
        obj.rows = [];
        obj.rows.push({
            "label" : "First section",
            "value" : ""
        });
        obj.rows.push({
            "label" : "type",
            "value" : data.type
        });
        obj.rows.push({
            "label" : "Second section",
            "value" : ""
        });
        obj.rows.push({
            "label" : "field1",
            "value" : "value1"
        });
        obj.rows.push({
            "label" : "field2",
            "value" : "value2"
        })
        tooltip.table()
            .width(180)
            .call (this, obj);
    };

d3.select("#container")
        .append("svg")
        .attr("width", 300)
        .attr("height", 300)
        .append("circle")
        .datum({name:"this is me", type:"this is my type"})
        .attr("cx", 150)
        .attr("cy", 150)
        .attr("r", 50)
        .attr("fill", "red")
        .on("click", t);
    </script>
</body>

Modified http://d3js.org/d3.v5.min.js to a secure url

Modified http://tntvis.github.io/tnt.tooltip/build/tnt.tooltip.min.js to a secure url

https://d3js.org/d3.v5.min.js

https://tntvis.github.io/tnt.tooltip/build/tnt.tooltip.min.js