From f24018e507e94dad14ee99eda84084f4a01c55bf Mon Sep 17 00:00:00 2001
From: Barrett Ruth <br.barrettruth@gmail.com>
Date: Wed, 3 Jul 2024 10:54:22 -0500
Subject: [PATCH] feat: label romer axes

---
 posts/economics/models-of-production.html |  2 +-
 scripts/posts/models-of-production.js     | 49 +++++++++++++++++++++++
 2 files changed, 50 insertions(+), 1 deletion(-)

diff --git a/posts/economics/models-of-production.html b/posts/economics/models-of-production.html
index aaecbfb..e54035e 100644
--- a/posts/economics/models-of-production.html
+++ b/posts/economics/models-of-production.html
@@ -488,7 +488,7 @@
                 <ul>
                   <li>
                     <div class="slider">
-                      <label for="sliderlChange">\(\bar{l}:\)</label>
+                      <label for="sliderlChange">\(\bar{l}_1:\)</label>
                       <span id="outputlChange">0.50</span>
                       <input
                         type="range"
diff --git a/scripts/posts/models-of-production.js b/scripts/posts/models-of-production.js
index 5d8503d..1cf2c5a 100644
--- a/scripts/posts/models-of-production.js
+++ b/scripts/posts/models-of-production.js
@@ -384,6 +384,55 @@ function drawRomerlGraph() {
         .x((d) => x(d.year))
         .y((d) => y(d.Y)),
     );
+
+  svg
+    .append("line")
+    .attr("x1", x(T_MAX / 2))
+    .attr("y1", y(romerData[T_MAX - 1].Y))
+    .attr("x2", x(T_MAX / 2))
+    .attr("y2", height)
+    .attr("stroke", "black")
+    .attr("stroke-width", 1)
+    .attr("stroke-dasharray", "4");
+
+  svg
+    .append("foreignObject")
+    .attr("width", "5em")
+    .attr("height", "2em")
+    .attr("x", x(0) + 15)
+    .attr("y", y(romerData[0].Y))
+    .append("xhtml:body")
+    .style("font-size", "0.6em")
+    .html(`<div class="romer-changel-before"></div>`);
+  katex.render(
+    `\\bar{l}_0=${l_}`,
+    document.querySelector(".romer-changel-before"),
+  );
+
+  svg
+    .append("foreignObject")
+    .attr("width", "5em")
+    .attr("height", "2em")
+    .attr("x", x(T_MAX / 2) + 15)
+    .attr("y", y(romerData[T_MAX / 2].Y))
+    .append("xhtml:body")
+    .style("font-size", "0.6em")
+    .html(`<div class="romer-changel-after"></div>`);
+  katex.render(
+    `\\bar{l}_1=${l}`,
+    document.querySelector(".romer-changel-after"),
+  );
+
+  svg
+    .append("foreignObject")
+    .attr("width", "4em")
+    .attr("height", "2em")
+    .attr("x", x(T_MAX))
+    .attr("y", y(romerData[T_MAX - 1].Y))
+    .append("xhtml:body")
+    .style("font-size", "0.75em")
+    .html(`<div class="romer-changel-y"></div>`);
+  katex.render("log_{10}Y", document.querySelector(".romer-changel-y"));
 }
 
 document.addEventListener("DOMContentLoaded", function () {