feat: raster layers - drawCells

This commit is contained in:
Azgaar 2024-09-05 18:57:30 +02:00
parent 0b8d3c63fc
commit 0c36dda60b

View file

@ -689,12 +689,32 @@ function toggleCells(event) {
} }
function drawCells() { function drawCells() {
cells.selectAll("path").remove(); const canvas = document.createElement("canvas");
const data = customization === 1 ? grid.cells.i : pack.cells.i; const ctx = canvas.getContext("2d");
canvas.width = graphWidth * scale;
canvas.height = graphHeight * scale;
ctx.scale(scale, scale);
ctx.strokeStyle = cells.attr("stroke") || "#808080";
ctx.lineWidth = cells.attr("stroke-width") || 1;
const graphCells = customization === 1 ? grid.cells.i : pack.cells.i;
const polygon = customization === 1 ? getGridPolygon : getPackPolygon; const polygon = customization === 1 ? getGridPolygon : getPackPolygon;
let path = "";
data.forEach(i => (path += "M" + polygon(i))); for (const i of graphCells) {
cells.append("path").attr("d", path); const poly = polygon(i);
ctx.beginPath();
ctx.moveTo(...poly[0]);
for (let j = 1; j < poly.length; j++) {
ctx.lineTo(...poly[j]);
}
ctx.closePath();
ctx.stroke();
}
const dataUrl = canvas.toDataURL("image/png", 1);
byId("cells").innerHTML = `<image href="${dataUrl}" style="width:${graphWidth}px; height:${graphHeight}px;"/>`;
} }
function toggleIce(event) { function toggleIce(event) {