d3.namespaces
d3.namespace("svg:text")
d3.create("svg") // equivalent to svg:svg
d3.create("svg:svg") // more explicitly
d3.create("svg:g") // an SVG G element
d3.create("g") // an HTML G (unknown) element
alphabet = [..."ABCDEFGHIJKLMNOPQRSTUVWXYZ"]
svg1 = {
const svg = d3
.create("svg")
.attr("viewBox", [0, 0, width, 33])
.attr("font-family", "sans-serif")
.attr("font-size", 10)
.style("display", "block");
// svg
// .selectAll("text")
// .data(alphabet)
// .join("text")
// .attr("x", (d, i) => i * 17)
// .attr("y", 17)
// .attr("dy", "0.35em")
// .text((d) => d);
return svg;
}
svg1.node()
chart1_svg.selectAll("text")
chart1_svg.selectAll("text").data(alphabet)
chart1_svg.selectAll("text").data(alphabet).join("text")
chart1_svg
.selectAll("text")
.data(alphabet)
.join("text")
.attr("x", (d, i) => i * 17)
chart1_svg._groups[0][0]
selection = require("https://cdn.jsdelivr.net/npm/d3-selection@3.0.0/dist/d3-selection.js")
d3 = require("https://cdn.jsdelivr.net/npm/d3@7.6.1/dist/d3.js")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
