score:0

Accepted answer

Your code has 2 errors:

  1. Class is missing for the node elements. Fix it by:
const node = svg.selectAll(".node")
  .data(json.nodes)
  .enter()
  .append("g")
  .classed("node", true)
  .call(force.drag);
  1. You cannot create a <div> under <g>. You can append a <text>:
node.append('rect')
  .attr('x', -50)
  .attr('y', -30)
  .attr('width', 100)
  .attr('height', 60)
  .style('fill', 'blue');

node.append('text')
  .classed('ui ...', true)
  .text('NODE')
  .attr('alignment-baseline', 'middle')
  .attr('text-anchor', 'middle')
  .style('fill', 'white');

... or insert a <div> under a <foreignObject>;


Related Query

More Query from same tag