Skip to content

Commit 3f6781b

Browse files
ndittrenndittren
authored
Merge pull request #1095 from ccnmtl/ERD-453
Sim4 log learning segment
2 parents 871884b + 3c2b6d6 commit 3f6781b

File tree

4 files changed

+220
-1
lines changed

4 files changed

+220
-1
lines changed

‎media/js/src/simulations/simulation4/logarithm.json‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
{
2+
"index": [
3+
"logLinear",
4+
"linearLog",
5+
"logLog"
6+
],
7+
"logLinear": {
8+
"title": "Log-Linear Model",
9+
"X": [3.4395244, 3.7698225, 5.5587083, 4.0705084, 4.1292877, 5.715065, 4.4609162, 2.7349388, 3.3131471, 3.554338, 5.2240818, 4.3598138, 4.4007715, 4.1106827, 3.4441589, 5.7869131, 4.4978505, 2.0333828, 4.7013559, 3.5272086, 2.9321763, 3.7820251, 2.9739956, 3.2711088, 3.3749607, 2.3133067, 4.837787, 4.1533731, 2.8618631, 5.2538149, 4.4264642, 3.7049285, 4.8951257, 4.8781335, 4.8215811, 4.6886403, 4.5539177, 3.9380883, 3.6940373, 3.619529, 3.305293, 3.7920827, 2.7346036, 6.168956, 5.207962, 2.8768914, 3.5971152, 3.5333446, 4.7799651, 3.9166309, 4.2533185, 3.9714532, 3.9571295, 5.3686023, 3.774229, 5.5164706, 2.4512472, 4.5846137, 4.1238542, 4.2159416, 4.3796395, 3.4976765, 3.6667926, 2.9814246, 2.9282088, 4.3035286, 4.4482098, 4.0530042, 4.9222675, 6.0500847, 3.5089688, 1.6908311, 5.0057385, 3.2907992, 3.3119914, 5.0255714, 3.715227, 2.7792823, 4.1813035, 3.8611086, 4.0057642, 4.3852804, 3.62934, 4.6443765, 3.7795134, 4.331782, 5.096839, 4.4351815, 3.6740684, 5.1488076, 4.9935039, 4.548397, 4.2387317, 3.3720939, 5.3606524, 3.3997404, 6.187333, 5.5326106, 3.7642996, 2.9735791],
10+
"Y": [59.401595, 134.0569, 623.50849, 133.85232, 104.94941, 806.3768, 158.93002, 18.191743, 61.74629, 150.48093, 378.57277, 288.24073, 98.67485, 161.24126, 110.37266, 1030.181, 257.41474, 15.074881, 195.68451, 55.431288, 54.108949, 74.313139, 41.625661, 62.995461, 199.71508, 19.832693, 385.86221, 179.89144, 29.398238, 501.77955, 468.12701, 138.47372, 370.8294, 289.1325, 120.89924, 520.24969, 124.41187, 201.95846, 283.89065, 49.283159, 105.23387, 105.74008, 19.077919, 608.88057, 223.00494, 37.019254, 47.762336, 131.27614, 925.20894, 71.744823, 283.49314, 211.87031, 167.87688, 352.27565, 111.55332, 587.7331, 41.793548, 221.05121, 273.7844, 152.72687, 367.23252, 53.148402, 56.639974, 270.95279, 41.255316, 233.37403, 319.41609, 122.86841, 483.32944, 1386.5403, 81.555077, 15.233206, 398.89766, 211.66931, 51.48669, 239.26536, 113.76344, 51.137734, 221.31017, 102.71169, 87.715719, 410.2936, 86.014404, 183.39093, 105.78129, 187.39038, 774.17594, 239.25983, 156.19345, 364.73155, 446.18181, 218.34011, 197.55628, 50.623315, 300.44109, 221.04076, 1785.9172, 367.59248, 86.376589, 29.395425],
11+
"log_Y": [4.0843211, 4.8982644, 6.4353624, 4.8967371, 4.6534785, 6.6925511, 5.068464, 2.9009678, 4.1230339, 5.0138363, 5.9364083, 5.663796, 4.5918301, 5.0829017, 4.7038625, 6.9374898, 5.5506886, 2.7130298, 5.2765037, 4.0151442, 3.9909996, 4.3082878, 3.7287168, 4.1430627, 5.2968917, 2.9873317, 5.9554803, 5.1923535, 3.3809347, 6.2181609, 6.1487397, 4.9306805, 5.9157421, 5.6668851, 4.7949575, 6.2543089, 4.8235976, 5.308062, 5.6485891, 3.8975824, 4.6561852, 4.660984, 2.9485316, 6.4116221, 5.4071939, 3.6114382, 3.8662374, 4.877303, 6.8300196, 4.2731157, 5.6471879, 5.3559744, 5.1232308, 5.864414, 4.7145027, 6.3762729, 3.732742, 5.3983944, 5.6123409, 5.0286511, 5.9059952, 3.973088, 4.036715, 5.6019446, 3.71978, 5.4526424, 5.7664946, 4.8111139, 6.1806985, 7.2345669, 4.4012786, 2.7234776, 5.9887049, 5.3550252, 3.9413233, 5.4775732, 4.7341212, 3.9345227, 5.3995652, 4.631926, 4.4741011, 6.016873, 4.4545148, 5.2116201, 4.6613737, 5.233194, 6.6517992, 5.4775501, 5.0510953, 5.8991616, 6.1007265, 5.386054, 5.2860235, 3.9244122, 5.7052517, 5.3983471, 7.4876874, 5.9069749, 4.4587167, 3.3808391],
12+
"linearFit": {
13+
"intercept": -669.23,
14+
"slope": 224.14
15+
},
16+
"logLinearFit": {
17+
"intercept": 1.05,
18+
"slope": 0.97
19+
},
20+
"bordercolor": "blue",
21+
"fillcolor": "teal",
22+
"symbol": "circle"
23+
},
24+
"linearLog": {
25+
"title": "Linear-Log Model",
26+
"X": [139.95666, 201.96849, 954.76292, 274.53304, 290.73719, 1066.8041, 396.00098, 55.948755, 120.4933, 159.60074, 744.80035, 361.30317, 375.07253, 285.53268, 140.71251, 1121.4705, 409.27956, 17.095296, 488.53144, 154.78347, 73.91972, 204.59623, 78.227826, 114.49327, 129.7403, 28.637352, 547.7558, 297.58004, 67.080362, 761.90194, 383.90859, 188.41667, 574.18968, 566.25848, 540.45296, 483.26756, 430.07153, 240.51479, 186.21091, 171.63594, 119.35479, 206.78128, 55.921338, 1448.2605, 735.64998, 68.500522, 167.42387, 155.86335, 522.03414, 235.31553, 327.27409, 248.76989, 245.20034, 830.70137, 202.91446, 926.07302, 36.103428, 441.78504, 289.20995, 315.92088, 367.92004, 149.66442, 180.77792, 79.012414, 73.520449, 343.00369, 391.50836, 269.84118, 587.03073, 1339.818, 151.60658, 8.1733658, 627.87421, 117.27503, 120.32526, 637.8841, 190.52037, 59.66651, 305.66574, 222.25323, 257.47882, 369.81921, 173.50445, 465.27497, 204.05328, 352.10027, 674.84443, 386.94174, 182.21703, 702.79176, 621.75825, 427.98982, 322.80758, 129.30004, 825.79187, 133.59279, 1465.5949, 936.95865, 200.78753, 78.184017],
27+
"Y": [5.5861295, 6.4365535, 7.7381171, 6.4413003, 6.1966104, 7.9499088, 6.5889645, 4.1904652, 5.6014809, 6.5321737, 7.3254427, 7.1936996, 6.1181781, 6.6265755, 6.2064225, 8.1729727, 7.0672365, 3.5184503, 6.7665517, 5.5299628, 5.3618029, 5.8473011, 5.1143467, 5.6124699, 6.7874658, 4.0287369, 7.4235229, 6.7346636, 4.724963, 7.6001638, 7.6726799, 6.4644079, 7.3735762, 7.1278022, 6.265784, 7.7462391, 6.3336315, 6.8527554, 7.1814317, 5.423429, 6.1329927, 6.2005629, 4.2378739, 7.5207846, 6.7999863, 4.9613881, 5.3896509, 6.392938, 8.3077875, 5.8174121, 7.1846674, 6.9010495, 6.6681769, 7.2180821, 6.2530582, 7.6907554, 4.8678826, 6.9046041, 7.1556396, 6.5682014, 7.4342214, 5.4838071, 5.5671917, 6.990125, 5.0891348, 6.986855, 7.2882917, 6.3559432, 7.6335082, 8.3847713, 5.9135986, 3.1335273, 7.4253062, 6.8287478, 5.4195305, 6.9101585, 6.2686533, 5.2440113, 6.9407539, 6.1746347, 6.0192744, 7.5446069, 5.981378, 6.7098721, 6.2002413, 6.765328, 8.0694423, 7.0006428, 6.5822253, 7.3054146, 7.539774, 6.8967565, 6.8243482, 5.4144539, 7.060942, 6.893403, 8.590371, 7.2170035, 5.9966643, 4.7663252],
28+
"log_X": null,
29+
"linearFit": {
30+
"intercept": 5.57,
31+
"slope": 0.0025
32+
},
33+
"linearLogFit": {
34+
"intercept": 1.03,
35+
"slope": 0.98
36+
},
37+
"bordercolor": "red",
38+
"fillcolor": "pink",
39+
"symbol": "circle"
40+
},
41+
"logLog": {
42+
"title": "Log-Log Model",
43+
"X": [139.95666, 201.96849, 954.76292, 274.53304, 290.73719, 1066.8041, 396.00098, 55.948755, 120.4933, 159.60074, 744.80035, 361.30317, 375.07253, 285.53268, 140.71251, 1121.4705, 409.27956, 17.095296, 488.53144, 154.78347, 73.91972, 204.59623, 78.227826, 114.49327, 129.7403, 28.637352, 547.7558, 297.58004, 67.080362, 761.90194, 383.90859, 188.41667, 574.18968, 566.25848, 540.45296, 483.26756, 430.07153, 240.51479, 186.21091, 171.63594, 119.35479, 206.78128, 55.921338, 1448.2605, 735.64998, 68.500522, 167.42387, 155.86335, 522.03414, 235.31553, 327.27409, 248.76989, 245.20034, 830.70137, 202.91446, 926.07302, 36.103428, 441.78504, 289.20995, 315.92088, 367.92004, 149.66442, 180.77792, 79.012414, 73.520449, 343.00369, 391.50836, 269.84118, 587.03073, 1339.818, 151.60658, 8.1733658, 627.87421, 117.27503, 120.32526, 637.8841, 190.52037, 59.66651, 305.66574, 222.25323, 257.47882, 369.81921, 173.50445, 465.27497, 204.05328, 352.10027, 674.84443, 386.94174, 182.21703, 702.79176, 621.75825, 427.98982, 322.80758, 129.30004, 825.79187, 133.59279, 1465.5949, 936.95865, 200.78753, 78.184017],
44+
"Y": [266.70135, 624.25163, 2294.1487, 627.22186, 491.08167, 2835.3164, 727.02761, 66.053513, 270.82718, 686.88965, 1518.446, 1331.0183, 454.03672, 754.89262, 495.92388, 3543.8633, 1172.9023, 33.732114, 868.31248, 252.13452, 213.10882, 346.29849, 166.39204, 273.81971, 886.66369, 56.189894, 1674.9237, 841.06054, 112.72633, 1998.5233, 2148.8324, 641.88418, 1593.3217, 1246.1353, 526.254, 2312.8575, 563.19814, 946.48522, 1314.7893, 226.655, 460.81317, 493.02646, 69.260444, 1846.0151, 897.83503, 142.79187, 219.12688, 597.60981, 4055.3305, 336.10112, 1319.0505, 993.31661, 786.95958, 1363.8707, 519.59944, 2188.0268, 130.04527, 996.85374, 1281.3117, 712.08791, 1692.939, 240.76157, 261.69814, 1085.8571, 162.24942, 1082.3122, 1463.0692, 575.90531, 2066.2862, 4379.8569, 370.03537, 22.954806, 1677.9133, 924.03302, 225.7731, 1002.4061, 527.76616, 189.42843, 1033.5491, 480.40752, 411.28007, 1890.5194, 395.98567, 820.46573, 492.86798, 867.25065, 3195.3194, 1097.3383, 722.14455, 1488.3369, 1881.4048, 989.06145, 919.97655, 224.62984, 1165.5426, 985.75023, 5379.6089, 1362.4005, 402.08534, 117.48671],
45+
"log_X": [4.9413328, 5.3081117, 6.8614631, 5.6150716, 5.6724197, 6.9724227, 5.9814167, 4.0244362, 4.7915942, 5.0726754, 6.6131162, 5.8897174, 5.9271194, 5.6543565, 4.9467189, 7.022396, 6.0143984, 2.8388033, 6.1914038, 5.0420272, 4.3029796, 5.3210384, 4.3596254, 4.740516, 4.8655348, 3.3547119, 6.3058296, 5.6956832, 4.2058913, 6.6358179, 5.9504045, 5.2386559, 6.3529598, 6.3390507, 6.2924076, 6.1805705, 6.0639515, 5.4827816, 5.22688, 5.1453756, 4.7821005, 5.3316616, 4.023946, 7.2781184, 6.6007544, 4.2268414, 5.1205287, 5.0489797, 6.257733, 5.4609273, 5.790798, 5.5165283, 5.5020756, 6.7222704, 5.3127845, 6.8309531, 3.5863878, 6.0908234, 5.6671529, 5.7554918, 5.9078656, 5.0083956, 5.1972693, 4.369605, 4.2975636, 5.8377412, 5.9700069, 5.5978336, 6.3750772, 7.2002891, 5.0212889, 2.1008808, 6.4423398, 4.7645219, 4.7901985, 6.4581566, 5.2497591, 4.0887709, 5.7224921, 5.4038174, 5.5509375, 5.9130143, 5.1562032, 6.1426286, 5.3183811, 5.863916, 6.5144822, 5.9582741, 5.2051984, 6.5550606, 6.4325514, 6.0590994, 5.7770564, 4.8621356, 6.7163428, 4.8947963, 7.2900165, 6.8426392, 5.3022473, 4.3590652],
46+
"log_Y": [5.5861295, 6.4365535, 7.7381171, 6.4413003, 6.1966104, 7.9499088, 6.5889645, 4.1904652, 5.6014809, 6.5321737, 7.3254427, 7.1936996, 6.1181781, 6.6265755, 6.2064225, 8.1729727, 7.0672365, 3.5184503, 6.7665517, 5.5299628, 5.3618029, 5.8473011, 5.1143467, 5.6124699, 6.7874658, 4.0287369, 7.4235229, 6.7346636, 4.724963, 7.6001638, 7.6726799, 6.4644079, 7.3735762, 7.1278022, 6.265784, 7.7462391, 6.3336315, 6.8527554, 7.1814317, 5.423429, 6.1329927, 6.2005629, 4.2378739, 7.5207846, 6.7999863, 4.9613881, 5.3896509, 6.392938, 8.3077875, 5.8174121, 7.1846674, 6.9010495, 6.6681769, 7.2180821, 6.2530582, 7.6907554, 4.8678826, 6.9046041, 7.1556396, 6.5682014, 7.4342214, 5.4838071, 5.5671917, 6.990125, 5.0891348, 6.986855, 7.2882917, 6.3559432, 7.6335082, 8.3847713, 5.9135986, 3.1335273, 7.4253062, 6.8287478, 5.4195305, 6.9101585, 6.2686533, 5.2440113, 6.9407539, 6.1746347, 6.0192744, 7.5446069, 5.981378, 6.7098721, 6.2002413, 6.765328, 8.0694423, 7.0006428, 6.5822253, 7.3054146, 7.539774, 6.8967565, 6.8243482, 5.4144539, 7.060942, 6.893403, 8.590371, 7.2170035, 5.9966643, 4.7663252],
47+
"linearFit": {
48+
"intercept": 106.15,
49+
"slope": 2.48
50+
},
51+
"logLogFit": {
52+
"intercept": 1.03,
53+
"slope": 0.98
54+
},
55+
"bordercolor": "orange",
56+
"fillcolor": "yellow",
57+
"symbol": "circle"
58+
}
59+
}

‎media/js/src/simulations/simulation4/logarithmGraph.jsx‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
import React from 'react';
2+
import Plot from 'react-plotly.js';
3+
import dataset from './logarithm.json';
4+
import PropTypes from 'prop-types';
5+
6+
export const LogarithmGraph = ({ selectedModel, selectedFit }) => {
7+
const model = dataset[selectedModel];
8+
if (!model) return null;
9+
10+
const x = model.X;
11+
const y = model.Y;
12+
const fitData = model[selectedFit];
13+
14+
const plotData = [
15+
{
16+
x,
17+
y,
18+
mode: 'markers',
19+
marker: {
20+
color: model.fillcolor,
21+
size: 10,
22+
symbol: model.symbol
23+
},
24+
name: 'Observed Data'
25+
},
26+
fitData && fitData.line && {
27+
x: fitData.line.x,
28+
y: fitData.line.y,
29+
mode: 'line',
30+
line: { color: model.bordercolor },
31+
name: `${selectedFit.replace('Fit', '')} Fit`
32+
}
33+
].filter(Boolean);
34+
35+
return (
36+
<Plot
37+
data={plotData}
38+
layout={{
39+
title: model.title,
40+
xaxis: { title: 'X' },
41+
yaxis: { title: 'Y' },
42+
legend: { orientation: 'h' }
43+
}}
44+
config={{ responsive: true }}
45+
style={{ width: '100%', height: '85%' }}
46+
/>
47+
);
48+
};
49+
50+
LogarithmGraph.propTypes = {
51+
selectedModel: PropTypes.string.isRequired,
52+
selectedFit: PropTypes.string.isRequired
53+
};

‎media/js/src/simulations/simulation4/simulationFour.jsx‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { STATIC_URL, createSubmission, getCoursePk } from '../../utils/utils';
44
import { PolynomialGraph } from './polynomialGraph';
55
import { WhatArePolynomialRegressions } from './whatArePolynomialRegs';
66
import { NonlinearRegsDefinition } from './nonlinearRegModal';
7+
import { WhatAreLogarithmRegs } from './whatAreLogarithms';
8+
import { LogarithmGraph } from './logarithmGraph';
79
import { RealDataPolynomials } from './realDataPolynomials';
810
import { StepProgressButton } from '../../StepProgressButton';
911
import { PolynomialTakeaway } from './polynomialTakeaway';
@@ -22,6 +24,8 @@ export const SimulationFour = () => {
2224
const [progress, setProgress] = useState([0,0,0]);
2325
const [compareRegLine, setCompareRegLine] = useState([]);
2426
const [isCorrect, setIsCorrect] = useState([false]);
27+
const [selectedModel, setSelectedModel] = useState('logLinear');
28+
const [selectedFit, setSelectedFit] = useState('linearFit');
2529

2630
const quizComplete = () => !isCorrect.includes(false);
2731

@@ -169,6 +173,28 @@ export const SimulationFour = () => {
169173
{mkProgressBar()}
170174
</>
171175
},
176+
{
177+
headerId: 'whatarelogarithms',
178+
title: 'What are Logarithms?',
179+
content: <>
180+
{progress[stage] < 1 && (
181+
<WhatAreLogarithmRegs
182+
selectedModel={selectedModel}
183+
setSelectedModel={setSelectedModel}
184+
selectedFit={selectedFit}
185+
setSelectedFit={setSelectedFit}
186+
/>
187+
)}
188+
{/* <StepProgressButton
189+
progress={progress}
190+
stage={stage}
191+
setProgress={setProgress}
192+
continueLabel="Continue to Real dataset »"
193+
reviewLabel="Review »"
194+
progressNumber={1}
195+
/> */}
196+
</>
197+
},
172198
];
173199

174200
const interactionSteps = [
@@ -214,7 +240,9 @@ export const SimulationFour = () => {
214240
)}
215241
{stage === 1 && (
216242
<SimulationPanel steps={logarithmSteps}
217-
graphContent={<PolynomialGraph />}
243+
graphContent={<LogarithmGraph
244+
selectedModel={selectedModel}
245+
selectedFit={selectedFit} />}
218246
modals={[]}
219247
/>
220248
)}

‎media/js/src/simulations/simulation4/whatAreLogarithms.jsx‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
3+
4+
export const WhatAreLogarithmRegs = ({
5+
selectedFit, setSelectedFit,
6+
selectedModel, setSelectedModel
7+
}) => {
8+
9+
const fitOptions = {
10+
logLinear: ['linearFit', 'logLinearFit'],
11+
linearLog: ['linearFit', 'linearLogFit'],
12+
logLog: ['linearFit', 'logLogFit']
13+
};
14+
15+
return (
16+
<div>
17+
<h2>Exploring Logarithmic Relationships</h2>
18+
<p>
19+
Select a model type below to explore how logarithmic
20+
transformations affect regression fitting.
21+
</p>
22+
23+
<div className="radio-group">
24+
{Object.keys(fitOptions).map(model => (
25+
<div key={model}>
26+
<label htmlFor={`model-radio-${model}`}>
27+
<input
28+
type="radio"
29+
name="model-radio-group"
30+
id={`model-radio-${model}`}
31+
value={model}
32+
checked={selectedModel === model}
33+
onChange={() => setSelectedModel(model)}
34+
/>
35+
{model === 'logLinear'
36+
? 'Log-Linear Model'
37+
: model === 'linearLog'
38+
? 'Linear-Log Model'
39+
: 'Log-Log Model'}
40+
</label>
41+
{selectedModel === model && (
42+
<div className="nested-radio ps-4">
43+
{fitOptions[model].map(fit => (
44+
<label key={fit} className="d-block"
45+
htmlFor={`fit-radio-${model}-${fit}`}>
46+
<input
47+
type="radio"
48+
name={`fit-radio-group-${model}`}
49+
id={`fit-radio-${model}-${fit}`}
50+
value={fit}
51+
checked={selectedFit === fit}
52+
onChange={() => setSelectedFit(fit)}
53+
/>
54+
{
55+
(() => {
56+
const fitLabel = fit
57+
.replace('Fit', '')
58+
.replace(/([A-Z])/g, ' $1')
59+
.trim();
60+
return `${fitLabel} Regression`;
61+
})()
62+
}
63+
</label>
64+
))}
65+
</div>
66+
)}
67+
</div>
68+
))}
69+
</div>
70+
</div>
71+
);
72+
};
73+
74+
WhatAreLogarithmRegs.propTypes = {
75+
selectedFit: PropTypes.string.isRequired,
76+
setSelectedFit: PropTypes.func.isRequired,
77+
selectedModel: PropTypes.string.isRequired,
78+
setSelectedModel: PropTypes.func.isRequired
79+
};

0 commit comments

Comments
 (0)