Download the script

Download As.

Download As. Enable D3 under Libraries, wait until it is checked, then paste the whole editor.

Goal

Run every block and confirm the chart is visible.

console.log("Use Download As on the toolbar to save the D3 script.");
document.body.innerHTML = '<div id="viz"></div>';
d3.select("#viz").append("svg").attr("width", 200).attr("height", 40).append("text").attr("x", 10).attr("y", 24).text("Nairobi");
document.body.innerHTML = '<div id="viz"></div>';
const data = [{c:"Nairobi",u:21},{c:"Mombasa",u:15},{c:"Kisumu",u:15},{c:"Nakuru",u:18},{c:"Eldoret",u:12}];
const svg = d3.select("#viz").append("svg").attr("width", 480).attr("height", 240);
const x = d3.scaleBand().domain(data.map(d => d.c)).range([40, 460]).padding(0.2);
const y = d3.scaleLinear().domain([0, 25]).range([200, 20]);
svg.selectAll("rect").data(data).join("rect")
  .attr("x", d => x(d.c)).attr("y", d => y(d.u)).attr("width", x.bandwidth()).attr("height", d => 200 - y(d.u)).attr("fill", "#1d4f7a");
svg.append("g").attr("transform", "translate(0,200)").call(d3.axisBottom(x));
svg.append("g").attr("transform", "translate(40,0)").call(d3.axisLeft(y));
console.log("bars", svg.selectAll("rect").size());
document.body.innerHTML = '<div id="viz"><p>Nairobi</p></div>';
d3.select("#viz p").style("color", "#1d4f7a");
d3.select("#viz").append("p").text("Mombasa");
console.log("p", d3.selectAll("p").size());
console.log('export');