fix(modelsofproduction): clean up graphs
This commit is contained in:
Barrett Ruth
parent
f63e429169
commit
a1d8f48a08
1 changed files with 64 additions and 35 deletions
|
|
@ -28,7 +28,7 @@ function setUpParameters(render, parameters, modelPrefix) {
|
|||
function drawSolowGraph() {
|
||||
const L = 150,
|
||||
K_MAX = 500,
|
||||
margin = { top: 20, right: 30, bottom: 20, left: 50 };
|
||||
margin = { top: 80, right: 80, bottom: 60, left: 100 };
|
||||
|
||||
const [A, d, s, alpha] = setUpParameters(
|
||||
drawSolowGraph,
|
||||
|
|
@ -55,27 +55,29 @@ function drawSolowGraph() {
|
|||
.attr("transform", `translate(${margin.left}, ${margin.top})`);
|
||||
|
||||
const x = d3.scaleLinear().domain([0, K_MAX]).range([0, width]);
|
||||
svg
|
||||
const xAxis = svg
|
||||
.append("g")
|
||||
.attr("transform", `translate(0, ${height})`)
|
||||
.call(d3.axisBottom(x))
|
||||
.call(d3.axisBottom(x));
|
||||
xAxis.selectAll("text").style("font-size", "1.5em");
|
||||
xAxis
|
||||
.append("text")
|
||||
.attr("x", width + 10)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "end")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("K");
|
||||
|
||||
const Y_MAX = solowOutput(K_MAX) + K_MAX / 10;
|
||||
const y = d3.scaleLinear().domain([0, Y_MAX]).range([height, 0]);
|
||||
svg
|
||||
.append("g")
|
||||
.call(d3.axisLeft(y))
|
||||
const yAxis = svg.append("g").call(d3.axisLeft(y));
|
||||
yAxis.selectAll("text").style("font-size", "1.5em");
|
||||
yAxis
|
||||
.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "start")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("Y");
|
||||
|
||||
const outputData = Array.from({ length: K_MAX }, (_, k) => ({
|
||||
|
|
@ -204,7 +206,7 @@ const updateRomerTable = (romerData) => {
|
|||
|
||||
function drawRomerGraph() {
|
||||
const T_MAX = 100,
|
||||
margin = { top: 20, right: 100, bottom: 20, left: 50 };
|
||||
margin = { top: 80, right: 120, bottom: 60, left: 100 };
|
||||
|
||||
const [z, L, l, A0] = setUpParameters(
|
||||
drawRomerGraph,
|
||||
|
|
@ -237,29 +239,33 @@ function drawRomerGraph() {
|
|||
}
|
||||
|
||||
const x = d3.scaleLinear().domain([1, T_MAX]).range([0, width]);
|
||||
svg
|
||||
const xAxis = svg
|
||||
.append("g")
|
||||
.attr("transform", `translate(0, ${height})`)
|
||||
.call(d3.axisBottom(x))
|
||||
.call(d3.axisBottom(x));
|
||||
xAxis.selectAll("text").style("font-size", "1.5em");
|
||||
xAxis
|
||||
.append("text")
|
||||
.attr("x", width + 10)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "end")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("t");
|
||||
|
||||
const y = d3
|
||||
.scaleLinear()
|
||||
.domain([0, romerData[romerData.length - 1].Y])
|
||||
.range([height, 0]);
|
||||
svg
|
||||
const yAxis = svg
|
||||
.append("g")
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")))
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")));
|
||||
yAxis.selectAll("text").style("font-size", "1.5em");
|
||||
yAxis
|
||||
.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "start")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("log(Y)");
|
||||
|
||||
svg
|
||||
|
|
@ -291,7 +297,7 @@ function drawRomerlGraph() {
|
|||
z = 0.01,
|
||||
L = 50,
|
||||
A0 = 50,
|
||||
margin = { top: 20, right: 100, bottom: 20, left: 50 };
|
||||
margin = { top: 80, right: 120, bottom: 60, left: 100 };
|
||||
|
||||
const [l, t0] = setUpParameters(drawRomerlGraph, ["lChange", "t0"], "");
|
||||
|
||||
|
|
@ -328,29 +334,33 @@ function drawRomerlGraph() {
|
|||
}
|
||||
|
||||
const x = d3.scaleLinear().domain([1, T_MAX]).range([0, width]);
|
||||
svg
|
||||
const xAxis = svg
|
||||
.append("g")
|
||||
.attr("transform", `translate(0, ${height})`)
|
||||
.call(d3.axisBottom(x))
|
||||
.call(d3.axisBottom(x));
|
||||
xAxis.selectAll("text").style("font-size", "1.5em");
|
||||
xAxis
|
||||
.append("text")
|
||||
.attr("x", width + 10)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "end")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("t");
|
||||
|
||||
const y = d3
|
||||
.scaleLinear()
|
||||
.domain([0, romerData[romerData.length - 1].Y])
|
||||
.range([height, 0]);
|
||||
svg
|
||||
const yAxis = svg
|
||||
.append("g")
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")))
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")));
|
||||
yAxis.selectAll("text").style("font-size", "1.5em");
|
||||
yAxis
|
||||
.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "start")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("log(Y)");
|
||||
|
||||
svg
|
||||
|
|
@ -437,7 +447,7 @@ function calculateRomerSolowData(
|
|||
|
||||
function drawRomerSolowGraph() {
|
||||
const T_MAX = 100,
|
||||
margin = { top: 20, right: 100, bottom: 20, left: 50 };
|
||||
margin = { top: 80, right: 120, bottom: 60, left: 100 };
|
||||
|
||||
const [z, l, L, A0, s, d, alpha] = setUpParameters(
|
||||
drawRomerSolowGraph,
|
||||
|
|
@ -471,29 +481,33 @@ function drawRomerSolowGraph() {
|
|||
);
|
||||
|
||||
const x = d3.scaleLinear().domain([1, T_MAX]).range([0, width]);
|
||||
svg
|
||||
const xAxis = svg
|
||||
.append("g")
|
||||
.attr("transform", `translate(0, ${height})`)
|
||||
.call(d3.axisBottom(x))
|
||||
.call(d3.axisBottom(x));
|
||||
xAxis.selectAll("text").style("font-size", "1.5em");
|
||||
xAxis
|
||||
.append("text")
|
||||
.attr("x", width + 10)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "end")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("t");
|
||||
|
||||
const y = d3
|
||||
.scaleLinear()
|
||||
.domain([0, romerSolowData[romerSolowData.length - 1].Y])
|
||||
.range([height, 0]);
|
||||
svg
|
||||
const yAxis = svg
|
||||
.append("g")
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")))
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")));
|
||||
yAxis.selectAll("text").style("font-size", "1.5em");
|
||||
yAxis
|
||||
.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "start")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("log(Y)");
|
||||
|
||||
svg
|
||||
|
|
@ -566,29 +580,33 @@ function drawRomerSolowChangeGraph() {
|
|||
);
|
||||
|
||||
const x = d3.scaleLinear().domain([1, T_MAX]).range([0, width]);
|
||||
svg
|
||||
const xAxis = svg
|
||||
.append("g")
|
||||
.attr("transform", `translate(0, ${height})`)
|
||||
.call(d3.axisBottom(x))
|
||||
.call(d3.axisBottom(x));
|
||||
xAxis.selectAll("text").style("font-size", "1.5em");
|
||||
xAxis
|
||||
.append("text")
|
||||
.attr("x", width + 10)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "end")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("t");
|
||||
|
||||
const y = d3
|
||||
.scaleLinear()
|
||||
.domain([0, romerSolowData[romerSolowData.length - 1].Y])
|
||||
.range([height, 0]);
|
||||
svg
|
||||
const yAxis = svg
|
||||
.append("g")
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")))
|
||||
.call(d3.axisLeft(y).ticks(10, d3.format(".1s")));
|
||||
yAxis.selectAll("text").style("font-size", "1.5em");
|
||||
yAxis
|
||||
.append("text")
|
||||
.attr("x", 0)
|
||||
.attr("y", -10)
|
||||
.style("text-anchor", "start")
|
||||
.style("font-size", "1.5em")
|
||||
.style("font-size", "2em")
|
||||
.text("log(Y)");
|
||||
|
||||
svg
|
||||
|
|
@ -635,3 +653,14 @@ window.onresize = () => {
|
|||
drawRomerSolowGraph();
|
||||
drawRomerSolowChangeGraph();
|
||||
};
|
||||
|
||||
new MutationObserver(() => {
|
||||
drawSolowGraph();
|
||||
drawRomerGraph();
|
||||
drawRomerlGraph();
|
||||
drawRomerSolowGraph();
|
||||
drawRomerSolowChangeGraph();
|
||||
}).observe(document.documentElement, {
|
||||
attributes: true,
|
||||
attributeFilter: ["data-theme"],
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue