plot_silly_arrows = {
const height = 600;
const radius = Math.min(width/2, height/2) - 20;
const svg = d3.select(DOM.svg(width, height))
.attr('style', `background-color: ${colors.palegray};`);
const n = Object.keys(cute_examples).length
const arrows = svg.append("g").selectAll("path")
.data(
Object.keys(cute_examples).map(
(k, i) => ({
start: [width/2 + 45*Math.cos(2*Math.PI*i/n), height/2 - 45*Math.sin(2*Math.PI*i/n)],
end: [width/2 + radius*Math.cos(2*Math.PI*i/n), height/2 - radius*Math.sin(2*Math.PI*i/n)],
strokewidth: 13,
endarrow: cute_examples[k]
})))
.enter().append("path")
.attr("d", d => arrow_path(d))
.attr("fill", (d, i) => interpolateRainbow(i/n))
return svg.node()
}