Transferring Hierarchical Edge Bundling Fork to an Independent Page

Community Help
1

At my Hierarchical Edge Bundling fork, @logic-based, I was able to create the beginning of the chart I want. Are we supposed to be able to transfer the code to an independent HTML file? I know we can download the code, but is it permissible to build a distinct html file with it?
If so, I’m stuck trying to render the final image.
Part of my independent fork also involves embedding the data within the file, so that it can be transferred to others like a tool of analysis.
I can’t figure out what I’m missing, though I know I’m close. I have the data structured, but I think the problem is that “g” is not defined by the time the code gets to const node=svg.append(“g”)

excerpt:

{const node = svg.append(“g”)

  .attr("font-family", "sans-serif")

  .attr("font-size", 10)

.selectAll("g")

.data(root.leaves())

.join("g")

.attr("transform", d => `rotate(${d.x * 180 / Math.PI - 90}) translate(${d.y},0)`)

.append("text")

  .attr("dy", "0.31em")

  .attr("x", d => d.x < Math.PI ? 6 : -6)

  .attr("text-anchor", d => d.x < Math.PI ? "start" : "end")

  .attr("transform", d => d.x >= Math.PI ? "rotate(180)" : null)

  .text(d => d.data.name)

  .each(function(d) { d.text = this; })

  .on("mouseover", overed)

  .on("mouseout", outed)

  .call(text => text.append("title").text(d => `${id(d)}

    ${d.outgoing.length} outgoing

    ${d.incoming.length} incoming`))

    console.log("node", node);}
2

No, the idea is to embed your code into your HTML file. You can rearrange and style the cells that are imported anyway you like so that the final product looks how you want. You might want to use the handy embed code generator, if you want to embed several cells.

I’m not sure exactly what you’re trying to achieve but there are tools to make data available as input to your Javascript program. Perhaps a textarea or File Upload would be approprirate.

1 Like
3

Thank you @mcmcclur! Clearly I’m new to this world and appreciate you taking the time to share the most basic of information. The links you’ve provided shall help me get to the next stage.

Peace and good tidings.

1 Like