{
const path = d3.select(chart).select("#symbol"),
collection = d3.select(chart).select("#collection").selectAll("path"),
rect = d3.select(chart).select("rect"),
width = +rect.attr("width"),
height = +rect.attr("height"),
symbol = d3.symbol(),
symbolTypes = d3.symbols,
symbolNames = "circle cross diamond square star triangle wye".split(/ /);
let symbolIndex = -1;
do {
symbolIndex = (symbolIndex + 1) % symbolTypes.length;
symbol.type(symbolTypes[symbolIndex]);
yield symbolNames[symbolIndex];
path.attr("d", symbol.size(64));
collection.transition().style("fill", (_,i) => i === symbolIndex ? "#000" : "#999")
var box = path.node().getBBox(),
error = Math.min(width / box.width, height / box.height);
path
.transition()
.duration(1500)
.attr("d", symbol.size(error * error * 64));
} while (await Promise.race([invalidation, Promises.delay(2000, true)]));
}