{"spec_id":"audiogram-clinical","library":"highcharts","language":"javascript","code":"// anyplot.ai\n// audiogram-clinical: Clinical Audiogram\n// Library: highcharts 12.6.0 | JavaScript 22.22.3\n// Quality: 92/100 | Updated: 2026-06-15\n//# anyplot-orientation: square\n\nconst t = window.ANYPLOT_TOKENS;\n\n// Semantic color exception: clinical convention — red = right ear, blue = left ear\nconst RIGHT_COLOR = '#AE3030'; // Imprint slot 5 (matte red)\nconst LEFT_COLOR  = '#4467A3'; // Imprint slot 3 (blue)\n\n// Custom X-shaped marker symbol for the left ear (two diagonal strokes)\nHighcharts.SVGRenderer.prototype.symbols.xcross = function (x, y, w, h) {\n    return ['M', x, y, 'L', x + w, y + h, 'M', x + w, y, 'L', x, y + h];\n};\n\n// Data: high-frequency sensorineural notch — typical noise-induced hearing loss pattern\nconst frequencies = [125, 250, 500, 1000, 2000, 4000, 8000];\nconst rightThresh = [10,  10,  15,  20,   30,   65,   75];  // dB HL, right ear\nconst leftThresh  = [5,   10,  15,  25,   35,   70,   95];  // dB HL, left ear — 95 dB enters Profound zone\n\nconst rightData = frequencies.map((f, i) => [f, rightThresh[i]]);\nconst leftData  = frequencies.map((f, i) => [f, leftThresh[i]]);\n\n// Severity band fill — lighter on dark theme to avoid heavy banding on near-black bg\nconst a = window.ANYPLOT_THEME === 'dark' ? 0.07 : 0.09;\n\nHighcharts.chart('container', {\n    chart: {\n        backgroundColor: 'transparent',\n        animation: false,\n        style: { fontFamily: 'inherit' },\n        spacing: [20, 20, 20, 20],\n        plotBorderWidth: 0,\n    },\n    credits: { enabled: false },\n    colors: t.palette,\n\n    title: {\n        text: 'audiogram-clinical · javascript · highcharts · anyplot.ai',\n        style: { color: t.ink, fontSize: '22px', fontWeight: '600' },\n    },\n\n    xAxis: {\n        type: 'logarithmic',\n        min: 125,\n        max: 8000,\n        tickPositions: [125, 250, 500, 1000, 2000, 4000, 8000],\n        lineColor: t.inkSoft,\n        tickColor: t.inkSoft,\n        gridLineColor: t.grid,\n        gridLineWidth: 1,\n        title: {\n            text: 'Frequency (Hz)',\n            style: { color: t.inkSoft, fontSize: '16px' },\n        },\n        labels: {\n            style: { color: t.inkSoft, fontSize: '14px' },\n            formatter() {\n                const v = this.value;\n                return v >= 1000 ? (v / 1000) + 'k' : String(v);\n            },\n        },\n    },\n\n    yAxis: {\n        reversed: true,\n        min: -10,\n        max: 120,\n        tickInterval: 10,\n        lineColor: t.inkSoft,\n        tickColor: t.inkSoft,\n        gridLineColor: t.grid,\n        gridLineWidth: 1,\n        title: {\n            text: 'Hearing Level (dB HL)',\n            style: { color: t.inkSoft, fontSize: '16px' },\n        },\n        labels: {\n            style: { color: t.inkSoft, fontSize: '14px' },\n            format: '{value}',\n        },\n        plotBands: [\n            {\n                from: -10, to: 25,\n                color: `rgba(0,158,115,${a})`,\n                label: {\n                    text: 'Normal', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n            {\n                from: 25, to: 40,\n                color: `rgba(221,204,119,${a + 0.03})`,\n                label: {\n                    text: 'Mild', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n            {\n                from: 40, to: 55,\n                color: `rgba(189,130,51,${a + 0.04})`,\n                label: {\n                    text: 'Moderate', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n            {\n                from: 55, to: 70,\n                color: `rgba(189,130,51,${a + 0.08})`,\n                label: {\n                    text: 'Mod. Severe', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n            {\n                from: 70, to: 90,\n                color: `rgba(174,48,48,${a + 0.09})`,\n                label: {\n                    text: 'Severe', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n            {\n                from: 90, to: 120,\n                color: `rgba(174,48,48,${a + 0.17})`,\n                label: {\n                    text: 'Profound', align: 'right', x: -8, y: 14,\n                    style: { color: t.inkSoft, fontSize: '13px', fontStyle: 'italic' },\n                },\n            },\n        ],\n    },\n\n    legend: {\n        enabled: true,\n        itemStyle: { color: t.inkSoft, fontSize: '14px' },\n        itemHoverStyle: { color: t.ink },\n    },\n\n    tooltip: { enabled: false },\n\n    plotOptions: {\n        series: {\n            animation: false,\n        },\n    },\n\n    series: [\n        {\n            name: 'Right Ear (O)',\n            type: 'line',\n            data: rightData,\n            color: RIGHT_COLOR,\n            dashStyle: 'Solid',\n            lineWidth: 2,\n            marker: {\n                enabled: true,\n                symbol: 'circle',\n                radius: 8,\n                lineWidth: 2.5,\n                lineColor: RIGHT_COLOR,\n                fillColor: 'transparent',\n            },\n        },\n        {\n            name: 'Left Ear (X)',\n            type: 'line',\n            data: leftData,\n            color: LEFT_COLOR,\n            dashStyle: 'Dash',\n            lineWidth: 2,\n            marker: {\n                enabled: true,\n                symbol: 'xcross',\n                radius: 8,\n                lineWidth: 2.5,\n                lineColor: LEFT_COLOR,\n                fillColor: 'transparent',\n            },\n        },\n    ],\n});\n"}