diff --git a/tinygrad/viz/index.html b/tinygrad/viz/index.html
index 726861c2ee..e1c55aa9b2 100644
--- a/tinygrad/viz/index.html
+++ b/tinygrad/viz/index.html
@@ -248,12 +248,8 @@
}
// **** base graph svg
- const svg = d3.select("#graph-svg");
- const inner = svg.select("g");
- const zoom = d3.zoom().scaleExtent([0.05, 2]).on("zoom", ({ transform }) => {
- inner.attr("transform", transform);
- });
- svg.call(zoom);
+ const zoom = d3.zoom().scaleExtent([0.05, 2]).on("zoom", (e) => d3.select("#render").attr("transform", e.transform));
+ d3.select("#graph-svg").call(zoom);
// zoom to fit into view
document.getElementById("zoom-to-fit-btn").addEventListener("click", () => {
const svg = d3.select("#graph-svg");
@@ -356,15 +352,8 @@
metadata.appendChild(vsCodeOpener(kernel.loc.join(":").split("/")));
metadata.appendChild(highlightedCodeBlock(kernel.code_line, "python", true));
appendResizer(metadata, { minWidth: 20, maxWidth: 50 });
- // ** code blocks
- let code = ret[currentRewrite].uop;
- let lang = "python"
- if (kernel.kernel_code != null) {
- code = kernel.kernel_code;
- lang = "cpp";
- }
- const codeBlock = highlightedCodeBlock(code, lang, false);
- metadata.appendChild(codeBlock);
+ const [code, lang] = kernel.kernel_code != null ? [kernel.kernel_code, "cpp"] : [ret[currentRewrite].uop, "python"];
+ metadata.appendChild(highlightedCodeBlock(code, lang, false));
// ** rewrite list
if (kernel.match_count >= 1) {
const rewriteList = Object.assign(document.createElement("div"), { className: "rewrite-list" })
@@ -376,16 +365,12 @@
if (i === currentRewrite) {
gUl.classList.add("active");
if (i !== 0) {
- const diff = ret[i].diff;
const [loc, pattern] = ret[i].upat;
- const parts = loc.join(":").split("/");
const div = Object.assign(document.createElement("div"), { className: "rewrite-container" });
- const link = vsCodeOpener(parts);
- div.appendChild(link);
- const pre = highlightedCodeBlock(pattern, "python", true);
- div.appendChild(pre);
+ div.appendChild(vsCodeOpener(loc.join(":").split("/")));
+ div.appendChild(highlightedCodeBlock(pattern, "python", true));
metadata.appendChild(div);
- const diffHtml = diff.map((line) => {
+ const diffHtml = ret[i].diff.map((line) => {
const color = line.startsWith("+") ? "#3aa56d" : line.startsWith("-") ? "#d14b4b" : "#f0f0f5";
return `${line}`;
}).join("
");