function make_penrose_tiling() {
let svg_width = 800;
let svg_height = (2 * svg_width) / phi ** 2;
let xmin = 0;
let xmax = phi;
let ymin = -1 / phi;
let ymax = 1 / phi;
let svg = d3
.create("svg")
.style("max-width", `${svg_width}px`)
.attr("viewBox", [0, 0, svg_width, svg_height]);
let x_scale = d3.scaleLinear().domain([xmin, xmax]).range([0, svg_width]);
let y_scale = d3.scaleLinear().domain([ymin, ymax]).range([svg_height, 0]);
let pts_to_path = d3
.line()
.x(function (d) {
return x_scale(d[0]);
})
.y(function (d) {
return y_scale(d[1]);
});
svg
.selectAll("path")
.data(triangles)
.join("path")
.attr("d", function (d) {
if (depth % 2 == 0) {
return pts_to_path([d.vertices[1], d.vertices[2], d.vertices[0]]);
} else {
if (d.type == "a") {
return pts_to_path([d.vertices[2], d.vertices[0], d.vertices[1]]);
} else {
return pts_to_path([d.vertices[0], d.vertices[1], d.vertices[2]]);
}
}
})
.attr("stroke", "black")
.attr("stroke-width", 1)
.attr("fill", function (d) {
if (d.type == "o") {
return "#B0B7BC";
} else {
return "#CE0F3D";
}
});
if (show_diag) {
svg
.selectAll("path.diag")
.data(triangles)
.join("path")
.attr("d", function (d) {
if (depth % 2 == 0) {
return pts_to_path([d.vertices[1], d.vertices[0]]);
} else {
if (d.type == "a") {
return pts_to_path([d.vertices[2], d.vertices[1]]);
} else {
return pts_to_path([d.vertices[0], d.vertices[2]]);
}
}
})
.attr("stroke", "black")
.attr("stroke-width", 0.6)
.attr("stroke-dasharray", "5,5")
.attr("fill", null);
} else {
svg
.selectAll("path.diag")
.data(triangles)
.join("path")
.attr("d", function (d) {
if (depth % 2 == 0) {
return pts_to_path([d.vertices[1], d.vertices[0]]);
} else {
if (d.type == "a") {
return pts_to_path([d.vertices[2], d.vertices[1]]);
} else {
return pts_to_path([d.vertices[0], d.vertices[2]]);
}
}
})
.attr("stroke", function (d) {
if (d.type == "o") {
return "#B0B7BC";
} else {
return "#CE0F3D";
}
})
.attr("stroke-width", 1)
.attr("fill", null);
}
return svg.node();
}