chart = {
const svg = d3.select(DOM.svg(width, height));
svg.append("polygon")
.attr("points", polygon);
const point = svg.append("circle")
.attr("r", radius)
.attr("transform", `translate(${[width / 2, height / 2]})`)
.call(drag);
function drag(sel){
const selPoint = sel.attr("data-point");
const dragGenerator = d3.drag()
.on("start", start)
.on("drag", dragging)
.on("end", end);
function start(){
sel.classed("active", 1);
}
function dragging(event){
let x = Math.round(event.x);
x = x < radius ? radius : x > width - radius ? width - radius : x;
let y = Math.round(event.y);
y = y < radius ? radius : y > height - radius ? height - radius : y;
point
.attr("transform", `translate(${[x, y]})`);
}
function end(){
sel.classed("active", 0);
}
sel.call(dragGenerator);
}
return svg.node();
}