2546961Plate mechanics lab: Kirchhoff-Love plates solved by numbl in the browserJeremy Magland 1import type { CompareResult } from "@plate-lab/core";
2import { LinePlot } from "../plots/LinePlot";
3import { useSharedAxis } from "../plots/useSharedAxis";
5export interface CompareViewProps {
6 cmp: CompareResult;
7 labelA?: string;
8 labelB?: string;
9}
11/** Side-by-side metrics and overlaid probe series for two solutions of one problem. */
12export function CompareView({ cmp, labelA = "modal", labelB = "finite differences" }: CompareViewProps) {
13 const pct = (x: number) => `${(100 * x).toFixed(2)} %`;
14 const axis = useSharedAxis();
15 return (
16 <div style={{ display: "flex", flexDirection: "column", gap: 10 }}>
17 <table className="pl-metrics">
18 <thead>
19 <tr>
20 <th>Quantity</th>
21 <th>{labelA}</th>
22 <th>{labelB}</th>
23 <th>relative L2 difference</th>
24 </tr>
25 </thead>
26 <tbody>
27 <tr>
28 <td>Peak displacement at probe</td>
29 <td>{(cmp.w_peak_a * 1e6).toPrecision(4)} µm</td>
30 <td>{(cmp.w_peak_b * 1e6).toPrecision(4)} µm</td>
31 <td>{pct(cmp.w_rel_l2)}</td>
32 </tr>
33 <tr>
34 <td>Peak von Mises stress at probe</td>
35 <td>{(cmp.vm_peak_a * 1e-6).toPrecision(4)} MPa</td>
36 <td>{(cmp.vm_peak_b * 1e-6).toPrecision(4)} MPa</td>
37 <td>{pct(cmp.vm_rel_l2)}</td>
38 </tr>
39 <tr>
40 <td>Strongest spectral peak</td>
41 <td>{cmp.f_peak_a.toFixed(0)} Hz</td>
42 <td>{cmp.f_peak_b.toFixed(0)} Hz</td>
43 <td>–</td>
44 </tr>
45 </tbody>
46 </table>
47 <div className="pl-small pl-muted">
48 Stress is a second derivative of displacement, so its difference is expected to exceed the displacement difference. The window is the shorter of the two runs.
49 </div>
50 <LinePlot
51 title="Displacement at the probe"
52 series={[
53 { x: cmp.t, y: cmp.w_a, label: labelA },
54 { x: cmp.t, y: cmp.w_b, label: labelB, dash: [4, 3] },
55 ]}
56 xScale={1000}
57 yScale={1e6}
58 xLabel="time [ms]"
59 yLabel="w [µm]"
60 yUnit="µm"
61 height={180}
62 {...axis}
63 />
64 <LinePlot
65 title="Von Mises stress at the probe"
66 series={[
67 { x: cmp.t, y: cmp.vm_a, label: labelA },
68 { x: cmp.t, y: cmp.vm_b, label: labelB, dash: [4, 3] },
69 ]}
70 xScale={1000}
71 yScale={1e-6}
72 xLabel="time [ms]"
73 yLabel="σ_vM [MPa]"
74 yUnit="MPa"
75 height={180}
76 {...axis}
77 />
78 {cmp.frames_rel_l2.length > 0 && (
79 <LinePlot
80 title="Relative L2 difference of the displacement field, frame by frame"
81 series={[{ x: cmp.frames_t, y: cmp.frames_rel_l2, label: "‖w_a − w_b‖ / ‖w_a‖" }]}
82 xScale={1000}
83 xLabel="time [ms]"
84 yLabel="relative difference"
85 height={150}
86 {...axis}
87 />
88 )}
89 </div>
90 );
91}