danvics/pediatric-ai-scribe-v3
1
0
Fork 0
Code Issues Pull requests Projects Releases 14 Packages Wiki Activity Actions

Growth charts: back to 7 percentile lines (drop 5th and 95th)

Browse source 
Reduces label crowding at the chart extremes. Clinical meaning
preserved: 3rd and 97th remain as the abnormal-threshold dashed
outermost lines, 10/25/50/75/90 give the mid trend. The bidirectional
label spread, leader lines, and dot-on-top rendering from the prior
pass all still apply to the 7-line layout.

Fills updated for new indexes (3↔97, 10↔90, 25↔75).
This commit is contained in:
Daniel 2026-04-14 07:16:38 +02:00
parent 02f4bea747
commit 7a7fd5b4eb
1 changed files with 13 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
public/js/calculators.js
View file

@ -758,19 +758,17 @@
return M * Math.pow(1 + L * S * z, 1 / L);
}
// Full Epic / CDC / WHO reference set: 3, 5, 10, 25, 50, 75, 90, 95, 97.
// Each percentile has its own hue so clinicians can match the patient
// dot to a band at a glance. Outer pairs (3/97) dashed — they're the
// abnormal-threshold lines on AAP-published charts.
// 7-line reference set: 3, 10, 25, 50, 75, 90, 97.
// Drops 5th and 95th (they crowded the 3rd/10th and 90th/97th labels
// on mobile without adding clinical value — 3rd/97th are the
// abnormal-threshold lines, the inner percentiles give the trend).
var PERCENTILE_LINES = [
{ p: 3, z: -1.88079, color: 'rgba(220,38,38,0.85)', dash: [6,4], width: 1.4 }, // red
{ p: 5, z: -1.64485, color: 'rgba(234,88,12,0.8)', dash: [3,3], width: 1.1 }, // deep orange
{ p: 10, z: -1.28155, color: 'rgba(245,158,11,0.85)', dash: [], width: 1.1 }, // orange
{ p: 25, z: -0.67449, color: 'rgba(202,138,4,0.8)', dash: [], width: 1.0 }, // amber
{ p: 3, z: -1.88079, color: 'rgba(220,38,38,0.9)', dash: [6,4], width: 1.4 }, // red
{ p: 10, z: -1.28155, color: 'rgba(234,88,12,0.9)', dash: [], width: 1.2 }, // orange
{ p: 25, z: -0.67449, color: 'rgba(202,138,4,0.85)', dash: [], width: 1.1 }, // amber
{ p: 50, z: 0, color: 'rgba(22,163,74,0.95)', dash: [], width: 2.4 }, // green (center)
{ p: 75, z: 0.67449, color: 'rgba(37,99,235,0.8)', dash: [], width: 1.0 }, // blue
{ p: 90, z: 1.28155, color: 'rgba(124,58,237,0.85)', dash: [], width: 1.1 }, // violet
{ p: 95, z: 1.64485, color: 'rgba(168,85,247,0.8)', dash: [3,3], width: 1.1 }, // purple
{ p: 75, z: 0.67449, color: 'rgba(37,99,235,0.85)', dash: [], width: 1.1 }, // blue
{ p: 90, z: 1.28155, color: 'rgba(124,58,237,0.9)', dash: [], width: 1.2 }, // violet
{ p: 97, z: 1.88079, color: 'rgba(219,39,119,0.9)', dash: [6,4], width: 1.4 } // pink
];
@ -798,12 +796,11 @@
});
});
// Fill bands between symmetric percentile pairs.
// Indexes: 3=0, 5=1, 10=2, 25=3, 50=4, 75=5, 90=6, 95=7, 97=8
// Indexes: 3=0, 10=1, 25=2, 50=3, 75=4, 90=5, 97=6
var fills = [
{ outer: 0, inner: 8, color: 'rgba(220,38,38,0.04)' }, // 3rd-97th (widest)
{ outer: 1, inner: 7, color: 'rgba(234,88,12,0.04)' }, // 5th-95th
{ outer: 2, inner: 6, color: 'rgba(245,158,11,0.04)' }, // 10th-90th
{ outer: 3, inner: 5, color: 'rgba(163,163,163,0.05)' } // 25th-75th (IQR)
{ outer: 0, inner: 6, color: 'rgba(220,38,38,0.04)' }, // 3rd-97th (widest)
{ outer: 1, inner: 5, color: 'rgba(234,88,12,0.04)' }, // 10th-90th
{ outer: 2, inner: 4, color: 'rgba(163,163,163,0.05)' } // 25th-75th (IQR)
];
fills.forEach(function(f) {
if (datasets[f.outer] && datasets[f.inner]) {