Material Property Comparison simulation
What's on screen
Three visual layers. Top row has toggleable material buttons and scrollable property tabs. Middle has two side-by-side panels: a radar chart (left) showing all properties normalized for shape comparison, and a bar chart (right) showing the active property with exact values. Bottom is a data table with all 11 properties for all active materials, best value highlighted per row.
Plus two computed ratios:
σy/ρ (strength-to-weight): Ti wins at 199, Al at 102, Steel at 32
E/ρ (stiffness-to-weight): Steel at 25.5, Al at 25.6, Ti at 25.7 (nearly identical, the famous "all metals have the same specific stiffness" insight)
How toggling works:
Tap any material button to toggle it on/off. The radar chart, bar chart, and table all rebuild instantly. Compare any 2, 3, 4, or all 5. Each material has a distinct color that stays consistent across all views.
Radar chart (left panel):
8 core properties plotted on a regular octagon. Each material is a colored polygon. Values are normalized: the material with the highest value in each property touches the outer ring. For "lower is better" properties (density, cost, thermal expansion), the normalization is inverted so outward still means "better."
The radar shape tells the story at a glance: steel is a balanced hexagon, titanium spikes on strength and hardness, copper spikes on conductivity and ductility but collapses on strength, cast iron is an oddly shaped polygon with zero elongation pulling inward.
Bar chart (right panel):
Shows one property at a time with horizontal bars. Tap any property tab to switch. The bar with the highest value gets a bold border. Labels show exact values with units. The "higher is better" note at top right tells you which direction wins.
Data table (bottom):
All 11 properties in rows, active materials in columns. Bold values mark the winner in each row. Tap any property name in the table to switch the bar chart to that property. This lets you quickly scan and drill down.
Key comparisons to try
Toggle on only Steel and Al. The radar chart shows Al has a much smaller polygon but a spike on k (conductivity) and σy is almost the same. Yet the density difference is massive. Al wins on strength-to-weight by 3×.
Add Titanium. Its polygon spikes dramatically on σy and UTS. But the cost tab shows 25× steel. The bar chart for cost makes the tradeoff painfully clear.
Toggle on Copper and switch to k (thermal conductivity). Copper's bar is 385, dwarfing everything else. But switch to σy and it collapses to 70 MPa. Copper is chosen for one job: moving heat and electricity.
Tap the σy/ρ (strength-to-weight) tab. Titanium at 199 crushes everyone. Aluminum at 102 is second. Steel at 32 is last among structural metals. This is why aircraft are not made of steel.
Tap E/ρ (stiffness-to-weight). Steel, Al, and Ti are all clustered around 25-26. This is the famous coincidence of nature: nearly all engineering metals have the same specific stiffness. You cannot make a stiffer beam by switching from steel to aluminum. You can only make it lighter at the same stiffness.