{"spec_id":"spectrum-basic","library":"highcharts","language":"javascript","code":"// anyplot.ai\n// spectrum-basic: Frequency Spectrum Plot\n// Library: highcharts 12.6.0 | JavaScript 22.23.2\n// Quality: 90/100 | Created: 2026-09-09\n\nconst t = window.ANYPLOT_TOKENS;\n\n// --- Data (in-memory, deterministic) ----------------------------------------\n// Simulated FFT magnitude spectrum of a sustained musical note (A4 = 440 Hz)\n// with decaying harmonics riding on a noisy broadband noise floor.\nlet seed = 42;\nfunction nextRandom() {\n  seed = (seed * 1103515245 + 12345) & 0x7fffffff;\n  return seed / 0x7fffffff;\n}\n\nconst fundamentalHz = 440;\nconst harmonics = [\n  { freq: fundamentalHz * 1, peakDb: -5 },\n  { freq: fundamentalHz * 2, peakDb: -15 },\n  { freq: fundamentalHz * 3, peakDb: -22 },\n  { freq: fundamentalHz * 4, peakDb: -28 },\n  { freq: fundamentalHz * 5, peakDb: -33 },\n];\nconst noiseFloorDb = -70;\nconst peakWidthOctaves = 0.04;\n\nconst nPoints = 300;\nconst freqMin = 20;\nconst freqMax = 20000;\nconst spectrum = Array.from({ length: nPoints }, (_, i) => {\n  const frequency = freqMin * Math.pow(freqMax / freqMin, i / (nPoints - 1));\n  let amplitudeDb = noiseFloorDb + (nextRandom() - 0.5) * 3;\n  for (const h of harmonics) {\n    const octaveDist = Math.log2(frequency / h.freq);\n    const bumpDb = h.peakDb - noiseFloorDb;\n    amplitudeDb +=\n      bumpDb *\n      Math.exp(-(octaveDist * octaveDist) / (2 * peakWidthOctaves * peakWidthOctaves));\n  }\n  return [frequency, amplitudeDb];\n});\n\n// Mark the fundamental's apex point with a dataLabel + halo marker so the\n// viewer doesn't have to infer which peak is the fundamental from position alone.\nlet fundamentalIndex = 0;\nlet fundamentalPeakDb = -Infinity;\nspectrum.forEach(([frequency, amplitudeDb], i) => {\n  if (frequency >= fundamentalHz * 0.9 && frequency <= fundamentalHz * 1.1 && amplitudeDb > fundamentalPeakDb) {\n    fundamentalPeakDb = amplitudeDb;\n    fundamentalIndex = i;\n  }\n});\nspectrum[fundamentalIndex] = {\n  x: spectrum[fundamentalIndex][0],\n  y: spectrum[fundamentalIndex][1],\n  marker: { enabled: true, radius: 4, fillColor: t.palette[0], lineColor: t.pageBg, lineWidth: 2 },\n  dataLabels: {\n    enabled: true,\n    format: \"Fundamental (440 Hz)\",\n    y: -16,\n    style: { color: t.ink, fontSize: \"13px\", fontWeight: \"600\", textOutline: \"none\" },\n  },\n};\n\n// --- Chart -------------------------------------------------------------------\nHighcharts.chart(\"container\", {\n  chart: {\n    type: \"area\",\n    backgroundColor: \"transparent\",\n    animation: false,\n    style: { fontFamily: \"inherit\" },\n  },\n  credits: { enabled: false },\n  colors: t.palette,\n  title: {\n    text: \"spectrum-basic · javascript · highcharts · anyplot.ai\",\n    style: { color: t.ink, fontSize: \"22px\", fontWeight: \"600\" },\n  },\n  xAxis: {\n    type: \"logarithmic\",\n    min: freqMin,\n    max: freqMax,\n    lineColor: t.inkSoft,\n    tickColor: t.inkSoft,\n    gridLineColor: t.grid,\n    labels: {\n      style: { color: t.inkSoft, fontSize: \"14px\" },\n    },\n    title: { text: \"Frequency (Hz)\", style: { color: t.inkSoft, fontSize: \"16px\" } },\n  },\n  yAxis: {\n    min: -75,\n    max: 0,\n    gridLineColor: t.grid,\n    labels: { style: { color: t.inkSoft, fontSize: \"14px\" } },\n    title: { text: \"Amplitude (dB)\", style: { color: t.inkSoft, fontSize: \"16px\" } },\n    plotLines: [\n      {\n        value: noiseFloorDb,\n        color: t.inkSoft,\n        dashStyle: \"Dash\",\n        width: 1,\n        zIndex: 5,\n        label: {\n          text: \"Noise floor\",\n          align: \"right\",\n          x: -8,\n          y: -6,\n          style: { color: t.inkSoft, fontSize: \"12px\" },\n        },\n      },\n    ],\n  },\n  legend: { enabled: false },\n  plotOptions: {\n    series: { animation: false, marker: { enabled: false }, dataLabels: { enabled: false } },\n    area: {\n      threshold: -75,\n      fillOpacity: 0.15,\n      lineWidth: 2.5,\n    },\n  },\n  series: [{ name: \"Amplitude\", data: spectrum }],\n});\n"}