JSFiddle - React, Tailwind, and code Playground

by gschutz

JavaScript

var data = [
    {name: "asdas", img: "img",  points:[1,2,3]},
    {name: "asdas", img: "img", points: [12,3,5]},
    {name: "asdas", img: "img", points:[1], ig: [{point:[0,12],textbox:[20]}]},
    {name: "asdas", img: "img",  points:[1,2,3]},
    {name: "asdas", img: "img", points: [12,3,5]},
    {name: "asdas", img: "img", points:[1], ig: [{point:[0,12],textbox:[20]}]}
]
var cc = d3.scale.category10().domain(data);

var ct = d3.select("body");
var c = ct.selectAll("div").data(data);
var enter = c.enter();

enter.append("div")
    .style("color", function(d, i) { console.log("xpto"); return cc(i) })
    .html(function(d) { return d.name + " - " + d.img;})
    .on("click", function(d) {console.log(d); } )
.on("mouseover", function(d,i) { console.log("Call Show Viewer by id " + i) })
    .append("ul");

var points = c.selectAll("li").data(function (d) { return d.points; });

points.enter().append("li").html(function (d) { return d });