{"id":61404,"date":"2026-07-30T19:22:27","date_gmt":"2026-07-30T17:22:27","guid":{"rendered":"https:\/\/alertes-meteo.com\/?page_id=61404"},"modified":"2026-07-30T19:24:15","modified_gmt":"2026-07-30T17:24:15","slug":"temperatures-moyennes-en-ete","status":"publish","type":"page","link":"https:\/\/alertes-meteo.com\/index.php\/climatologie\/temperatures-moyennes-en-ete\/","title":{"rendered":"Temp\u00e9ratures moyennes en \u00e9t\u00e9"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container nonhundred-percent-fullwidth non-hundred-percent-height-scrolling\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-flex-start fusion-flex-content-wrap\" style=\"max-width:1575px;margin-left: calc(-5% \/ 2 );margin-right: calc(-5% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion_builder_column_1_1 1_1 fusion-flex-column\" style=\"--awb-bg-blend:overlay;--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:2.375%;--awb-margin-bottom-large:0px;--awb-spacing-left-large:2.375%;--awb-width-medium:100%;--awb-spacing-right-medium:2.375%;--awb-spacing-left-medium:2.375%;--awb-width-small:100%;--awb-spacing-right-small:2.375%;--awb-spacing-left-small:2.375%;\"><div class=\"fusion-column-wrapper fusion-flex-justify-content-flex-start fusion-content-layout-column\"><div class=\"fusion-text fusion-text-1\"><div class=\"w-full\">\n<h1 style=\"text-align: center;\">Temp\u00e9ratures moyennes en \u00e9t\u00e9<\/h1>\n<\/div>\n<\/div><p style=\"margin:18px 0; color:#dc2626; font-size:18px; font-weight:800; line-height:1.5; text-align:center;\">\n  Afficher et survolez le diagramme pour voir le d\u00e9tail des temp\u00e9ratures.\n<\/p>\n\n\n<!--\n  Graphique interactif WordPress\n  \u00c0 coller dans un bloc \u00ab HTML personnalis\u00e9 \u00bb.\n  Aucune biblioth\u00e8que externe n'est n\u00e9cessaire.\n-->\n<div class=\"tsummer-widget\" data-tsummer-chart>\n  <div class=\"tsummer-header\">\n    <h2>Temp\u00e9rature moyenne observ\u00e9e en \u00e9t\u00e9 depuis 1921 (France)<\/h2>\n    <p>Valeurs en degr\u00e9s Celsius<\/p>\n  <\/div>\n\n  <div\n    class=\"tsummer-reference\"\n    role=\"note\"\n    aria-label=\"Normale 1991-2020 : 20,35 degr\u00e9s Celsius\"\n  >\n    <span>Normale 1991-2020<\/span>\n    <strong>20,35\u00a0\u00b0C<\/strong>\n  <\/div>\n\n  <div class=\"tsummer-toggle-row\">\n    <button\n      class=\"tsummer-toggle\"\n      data-tsummer-toggle\n      type=\"button\"\n      role=\"switch\"\n      aria-checked=\"false\"\n    >\n      <span class=\"tsummer-toggle-track\" aria-hidden=\"true\">\n        <span class=\"tsummer-toggle-dot\"><\/span>\n      <\/span>\n      <span data-tsummer-toggle-label>Afficher le diagramme<\/span>\n    <\/button>\n  <\/div>\n\n  <div class=\"tsummer-content\" data-tsummer-content hidden>\n    <div class=\"tsummer-selection\" data-tsummer-selection aria-live=\"polite\">\n      Survolez ou touchez la courbe pour afficher la temp\u00e9rature d\u2019une ann\u00e9e.\n    <\/div>\n\n    <div class=\"tsummer-scroll\" aria-label=\"Graphique d\u00e9filable horizontalement sur mobile\">\n      <div class=\"tsummer-stage\">\n        <svg\n          class=\"tsummer-svg\"\n          data-tsummer-svg\n          viewBox=\"0 0 1240 520\"\n          role=\"img\"\n          tabindex=\"0\"\n          aria-labelledby=\"tsummer-title tsummer-desc\"\n          preserveAspectRatio=\"xMidYMid meet\"\n        >\n          <title id=\"tsummer-title\">\n            Temp\u00e9rature moyenne observ\u00e9e en \u00e9t\u00e9 en France, de 1921 \u00e0 2025\n          <\/title>\n          <desc id=\"tsummer-desc\">\n            Courbe bleue interactive de la temp\u00e9rature moyenne nationale observ\u00e9e\n            en \u00e9t\u00e9. La ligne pointill\u00e9e repr\u00e9sente la normale 1991-2020 de 20,35 \u00b0C.\n            Les fl\u00e8ches gauche et droite permettent de parcourir les ann\u00e9es.\n          <\/desc>\n        <\/svg>\n        <div class=\"tsummer-tooltip\" data-tsummer-tooltip role=\"status\" aria-hidden=\"true\"><\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"tsummer-legend\" aria-label=\"L\u00e9gende\">\n      <span><i class=\"tsummer-line-key\"><\/i> Temp\u00e9rature moyenne observ\u00e9e<\/span>\n      <span><i class=\"tsummer-normal-key\"><\/i> Normale 1991-2020 : 20,35\u00a0\u00b0C<\/span>\n    <\/div>\n\n    <p class=\"tsummer-note\">\n      \u00c9t\u00e9 m\u00e9t\u00e9orologique : juin, juillet et ao\u00fbt. L\u2019\u00e9t\u00e9 2025\n      est la derni\u00e8re saison compl\u00e8te disponible.\n    <\/p>\n\n    <p class=\"tsummer-source\">\n      Source : M\u00e9t\u00e9o-France \u2022 Indicateur thermique national\n    <\/p>\n  <\/div>\n<\/div>\n\n<style>\n  .tsummer-widget,\n  .tsummer-widget * {\n    box-sizing: border-box;\n  }\n\n  .tsummer-widget {\n    --tsummer-blue: #2f80ed;\n    --tsummer-blue-dark: #145eb8;\n    --tsummer-blue-soft: #eaf4ff;\n    --tsummer-grid: #dfe6ee;\n    --tsummer-ink: #17202a;\n    --tsummer-muted: #5d6874;\n    width: 100%;\n    max-width: 1280px;\n    margin: 24px auto;\n    padding: clamp(18px, 3vw, 32px);\n    overflow: hidden;\n    color: var(--tsummer-ink);\n    background: #ffffff;\n    border: 1px solid #e7ecf2;\n    border-radius: 18px;\n    box-shadow: 0 12px 34px rgba(23, 32, 42, 0.09);\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  .tsummer-header h2 {\n    margin: 0;\n    font-size: clamp(21px, 2.6vw, 31px);\n    line-height: 1.18;\n    letter-spacing: -0.02em;\n  }\n\n  .tsummer-header p {\n    margin: 8px 0 0;\n    color: var(--tsummer-muted);\n    font-size: 15px;\n  }\n\n  .tsummer-reference {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    margin-top: 18px;\n    padding: 10px 14px;\n    color: #184d82;\n    background: var(--tsummer-blue-soft);\n    border: 1px solid #bfdcff;\n    border-radius: 11px;\n    font-size: 14px;\n  }\n\n  .tsummer-reference span {\n    font-weight: 700;\n  }\n\n  .tsummer-reference strong {\n    font-size: 17px;\n    color: #0f559f;\n  }\n\n  .tsummer-toggle-row {\n    margin-top: 16px;\n  }\n\n  .tsummer-toggle {\n    display: inline-flex;\n    align-items: center;\n    gap: 10px;\n    margin: 0;\n    padding: 9px 13px;\n    color: #34404c;\n    background: #f5f7fa;\n    border: 1px solid #dce2e8;\n    border-radius: 999px;\n    font: inherit;\n    font-size: 14px;\n    font-weight: 700;\n    line-height: 1.2;\n    cursor: pointer;\n    transition: color 0.16s ease, background 0.16s ease, border-color 0.16s ease;\n  }\n\n  .tsummer-toggle:hover {\n    color: #17202a;\n    background: #eef2f6;\n    border-color: #cbd3dc;\n  }\n\n  .tsummer-toggle:focus-visible,\n  .tsummer-svg:focus-visible {\n    outline: 3px solid rgba(47, 128, 237, 0.28);\n    outline-offset: 3px;\n  }\n\n  .tsummer-toggle-track {\n    position: relative;\n    display: inline-block;\n    width: 37px;\n    height: 21px;\n    flex: 0 0 auto;\n    background: #aeb7c2;\n    border-radius: 999px;\n    transition: background 0.16s ease;\n  }\n\n  .tsummer-toggle-dot {\n    position: absolute;\n    top: 3px;\n    left: 3px;\n    width: 15px;\n    height: 15px;\n    background: #ffffff;\n    border-radius: 50%;\n    box-shadow: 0 1px 4px rgba(23, 32, 42, 0.28);\n    transition: transform 0.16s ease;\n  }\n\n  .tsummer-toggle.is-active {\n    color: #174f8d;\n    background: #eff6ff;\n    border-color: #b9d4f2;\n  }\n\n  .tsummer-toggle.is-active .tsummer-toggle-track {\n    background: var(--tsummer-blue-dark);\n  }\n\n  .tsummer-toggle.is-active .tsummer-toggle-dot {\n    transform: translateX(16px);\n  }\n\n  .tsummer-content[hidden] {\n    display: none;\n  }\n\n  .tsummer-selection {\n    min-height: 49px;\n    margin: 20px 0 12px;\n    padding: 12px 15px;\n    color: #34404c;\n    background: #f5f7fa;\n    border-left: 4px solid #8995a3;\n    border-radius: 9px;\n    font-size: 15px;\n    line-height: 1.4;\n  }\n\n  .tsummer-selection strong {\n    color: #0f559f;\n  }\n\n  .tsummer-selection.has-value {\n    color: #24415f;\n    background: #eef7ff;\n    border-left-color: var(--tsummer-blue);\n  }\n\n  .tsummer-scroll {\n    width: 100%;\n    overflow-x: auto;\n    overflow-y: hidden;\n    padding-top: 6px;\n    scrollbar-color: #aeb7c2 #edf0f3;\n    scrollbar-width: thin;\n    -webkit-overflow-scrolling: touch;\n  }\n\n  .tsummer-stage {\n    position: relative;\n    width: 100%;\n    min-width: 940px;\n  }\n\n  .tsummer-svg {\n    display: block;\n    width: 100%;\n    height: auto;\n    overflow: visible;\n    cursor: crosshair;\n    touch-action: pan-x pan-y;\n  }\n\n  .tsummer-grid-line {\n    stroke: var(--tsummer-grid);\n    stroke-width: 1;\n    vector-effect: non-scaling-stroke;\n  }\n\n  .tsummer-zero-line {\n    stroke: #aeb8c3;\n    stroke-width: 1.5;\n    vector-effect: non-scaling-stroke;\n  }\n\n  .tsummer-normal-line {\n    stroke: #536273;\n    stroke-width: 1.7;\n    stroke-dasharray: 7 6;\n    vector-effect: non-scaling-stroke;\n  }\n\n  .tsummer-normal-label {\n    fill: #4e5b68;\n    font-size: 12px;\n    font-weight: 700;\n    text-anchor: end;\n  }\n\n  .tsummer-y-label,\n  .tsummer-x-label,\n  .tsummer-axis-unit {\n    fill: #687582;\n    font-family: Arial, Helvetica, sans-serif;\n  }\n\n  .tsummer-y-label {\n    font-size: 13px;\n    text-anchor: end;\n    dominant-baseline: middle;\n  }\n\n  .tsummer-x-label {\n    font-size: 11px;\n    text-anchor: middle;\n  }\n\n  .tsummer-axis-unit {\n    font-size: 12px;\n    font-weight: 700;\n  }\n\n  .tsummer-area {\n    pointer-events: none;\n  }\n\n  .tsummer-curve {\n    fill: none;\n    stroke: var(--tsummer-blue);\n    stroke-width: 2.1;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n    vector-effect: non-scaling-stroke;\n    pointer-events: none;\n  }\n\n  .tsummer-marker-line {\n    stroke: rgba(20, 94, 184, 0.42);\n    stroke-width: 1;\n    stroke-dasharray: 4 4;\n    vector-effect: non-scaling-stroke;\n    pointer-events: none;\n  }\n\n  .tsummer-marker {\n    fill: #ffffff;\n    stroke: var(--tsummer-blue-dark);\n    stroke-width: 2.2;\n    vector-effect: non-scaling-stroke;\n    filter: drop-shadow(0 2px 4px rgba(20, 94, 184, 0.28));\n    pointer-events: none;\n  }\n\n  .tsummer-overlay {\n    fill: transparent;\n    pointer-events: all;\n  }\n\n  .tsummer-tooltip {\n    position: absolute;\n    z-index: 4;\n    width: max-content;\n    max-width: 235px;\n    padding: 10px 12px;\n    color: #ffffff;\n    background: rgba(18, 34, 51, 0.97);\n    border-radius: 9px;\n    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);\n    font-size: 13px;\n    line-height: 1.35;\n    pointer-events: none;\n    opacity: 0;\n    transform: translate(-50%, calc(-100% - 12px));\n    transition: opacity 0.12s ease;\n  }\n\n  .tsummer-tooltip::after {\n    content: \"\";\n    position: absolute;\n    top: 100%;\n    left: 50%;\n    width: 0;\n    height: 0;\n    border: 7px solid transparent;\n    border-top-color: rgba(18, 34, 51, 0.97);\n    transform: translateX(-50%);\n  }\n\n  .tsummer-tooltip.is-visible {\n    opacity: 1;\n  }\n\n  .tsummer-tooltip strong,\n  .tsummer-tooltip span {\n    display: block;\n  }\n\n  .tsummer-tooltip strong {\n    margin-bottom: 2px;\n    font-size: 14px;\n  }\n\n  .tsummer-legend {\n    display: flex;\n    flex-wrap: wrap;\n    gap: 10px 22px;\n    margin-top: 14px;\n    color: #49535e;\n    font-size: 13px;\n  }\n\n  .tsummer-legend span {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .tsummer-line-key,\n  .tsummer-normal-key {\n    display: inline-block;\n    width: 30px;\n    height: 0;\n  }\n\n  .tsummer-line-key {\n    border-top: 2px solid var(--tsummer-blue);\n    border-radius: 999px;\n  }\n\n  .tsummer-normal-key {\n    border-top: 2px dashed #536273;\n  }\n\n  .tsummer-note {\n    margin: 16px 0 0;\n    padding: 11px 13px;\n    color: #52606d;\n    background: #f6f8fa;\n    border-radius: 9px;\n    font-size: 12px;\n    line-height: 1.5;\n  }\n\n  .tsummer-source {\n    margin: 13px 0 0;\n    color: #737d87;\n    font-size: 12px;\n  }\n\n  @media (max-width: 720px) {\n    .tsummer-widget {\n      margin: 14px auto;\n      padding: 17px 14px 19px;\n      border-radius: 13px;\n    }\n\n    .tsummer-reference {\n      width: 100%;\n      justify-content: space-between;\n    }\n\n    .tsummer-selection {\n      margin-top: 15px;\n    }\n\n    .tsummer-scroll {\n      padding-bottom: 7px;\n    }\n\n    .tsummer-stage {\n      min-width: 900px;\n    }\n\n    .tsummer-scroll::after {\n      content: \"Faites glisser le graphique pour parcourir les ann\u00e9es \u2192\";\n      position: sticky;\n      left: 0;\n      display: block;\n      width: max-content;\n      margin-top: 4px;\n      color: #727d88;\n      font-size: 11px;\n    }\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .tsummer-toggle,\n    .tsummer-toggle-track,\n    .tsummer-toggle-dot,\n    .tsummer-tooltip {\n      transition: none;\n    }\n  }\n<\/style>\n\n<script>\n  (() => {\n    const widgets = document.querySelectorAll(\"[data-tsummer-chart]\");\n    const NORMAL = 20.35;\n\n    widgets.forEach((widget, widgetIndex) => {\n      if (widget.dataset.tsummerReady === \"true\") return;\n      widget.dataset.tsummerReady = \"true\";\n\n      const data = [\n        [1921, 19.47], [1922, 17.80], [1923, 18.53], [1924, 17.67], [1925, 18.37],\n        [1926, 18.20], [1927, 17.97], [1928, 19.70], [1929, 19.00], [1930, 18.77],\n        [1931, 18.43], [1932, 18.67], [1933, 19.37], [1934, 19.23], [1935, 19.50],\n        [1936, 18.17], [1937, 19.33], [1938, 18.60], [1939, 18.13], [1940, 17.80],\n        [1941, 18.47], [1942, 18.83], [1943, 19.23], [1944, 19.10], [1945, 19.60],\n        [1946, 18.17], [1947, 20.93], [1948, 18.07], [1949, 20.00], [1950, 20.43],\n        [1951, 18.30], [1952, 20.17], [1953, 18.50], [1954, 17.57], [1955, 19.33],\n        [1956, 17.27], [1957, 18.70], [1958, 18.43], [1959, 19.77], [1960, 18.33],\n        [1961, 18.60], [1962, 18.57], [1963, 18.17], [1964, 19.43], [1965, 17.87],\n        [1966, 18.13], [1967, 19.00], [1968, 18.17], [1969, 18.57], [1970, 19.20],\n        [1971, 18.97], [1972, 17.63], [1973, 19.70], [1974, 18.63], [1975, 19.40],\n        [1976, 20.67], [1977, 17.70], [1978, 17.70], [1979, 18.60], [1980, 17.97],\n        [1981, 18.57], [1982, 19.90], [1983, 20.83], [1984, 18.87], [1985, 18.73],\n        [1986, 19.07], [1987, 18.90], [1988, 18.87], [1989, 20.10], [1990, 19.97],\n        [1991, 19.80], [1992, 19.73], [1993, 19.17], [1994, 20.83], [1995, 20.40],\n        [1996, 19.43], [1997, 20.07], [1998, 19.73], [1999, 20.13], [2000, 19.77],\n        [2001, 20.13], [2002, 19.63], [2003, 23.10], [2004, 20.20], [2005, 20.43],\n        [2006, 21.03], [2007, 19.30], [2008, 19.57], [2009, 20.63], [2010, 20.27],\n        [2011, 19.37], [2012, 19.63], [2013, 20.33], [2014, 19.80], [2015, 21.40],\n        [2016, 20.50], [2017, 21.43], [2018, 21.90], [2019, 21.70], [2020, 20.97],\n        [2021, 20.33], [2022, 22.70], [2023, 21.80], [2024, 21.10], [2025, 22.20]\n      ];\n\n      const svg = widget.querySelector(\"[data-tsummer-svg]\");\n      const tooltip = widget.querySelector(\"[data-tsummer-tooltip]\");\n      const selection = widget.querySelector(\"[data-tsummer-selection]\");\n      const stage = widget.querySelector(\".tsummer-stage\");\n      const toggle = widget.querySelector(\"[data-tsummer-toggle]\");\n      const toggleLabel = widget.querySelector(\"[data-tsummer-toggle-label]\");\n      const content = widget.querySelector(\"[data-tsummer-content]\");\n      const ns = \"http:\/\/www.w3.org\/2000\/svg\";\n\n      const contentId = `tsummer-chart-content-${widgetIndex + 1}`;\n      const gradientId = `tsummer-area-gradient-${widgetIndex + 1}`;\n      content.id = contentId;\n      toggle.setAttribute(\"aria-controls\", contentId);\n\n      const W = 1240;\n      const H = 520;\n      const margin = { top: 31, right: 22, bottom: 62, left: 62 };\n      const plotW = W - margin.left - margin.right;\n      const plotH = H - margin.top - margin.bottom;\n      const minY = 17;\n      const maxY = 24;\n      const ticks = [17, 18, 19, 20, 21, 22, 23, 24];\n      let activeIndex = data.length - 1;\n      let pinned = false;\n\n      const x = (index) =>\n        margin.left + (index \/ (data.length - 1)) * plotW;\n\n      const y = (value) =>\n        margin.top + ((maxY - value) \/ (maxY - minY)) * plotH;\n\n      const makeSvg = (tag, attrs = {}) => {\n        const element = document.createElementNS(ns, tag);\n        Object.entries(attrs).forEach(([name, value]) =>\n          element.setAttribute(name, value)\n        );\n        return element;\n      };\n\n      const formatValue = (value, digits = 1) =>\n        value.toFixed(digits).replace(\".\", \",\").replace(\"-\", \"\u2212\");\n\n      const formatGap = (value) => {\n        const sign = value > 0 ? \"+\" : value < 0 ? \"\u2212\" : \"\";\n        return sign + Math.abs(value).toFixed(1).replace(\".\", \",\");\n      };\n\n      const defs = makeSvg(\"defs\");\n      const gradient = makeSvg(\"linearGradient\", {\n        id: gradientId,\n        x1: \"0\",\n        x2: \"0\",\n        y1: \"0\",\n        y2: \"1\"\n      });\n      gradient.appendChild(\n        makeSvg(\"stop\", {\n          offset: \"0%\",\n          \"stop-color\": \"#2f80ed\",\n          \"stop-opacity\": \"0.24\"\n        })\n      );\n      gradient.appendChild(\n        makeSvg(\"stop\", {\n          offset: \"100%\",\n          \"stop-color\": \"#2f80ed\",\n          \"stop-opacity\": \"0.025\"\n        })\n      );\n      defs.appendChild(gradient);\n      svg.appendChild(defs);\n\n      const gridGroup = makeSvg(\"g\", { \"aria-hidden\": \"true\" });\n      ticks.forEach((tick) => {\n        gridGroup.appendChild(\n          makeSvg(\"line\", {\n            x1: margin.left,\n            x2: W - margin.right,\n            y1: y(tick),\n            y2: y(tick),\n            class: tick === 0 ? \"tsummer-zero-line\" : \"tsummer-grid-line\"\n          })\n        );\n\n        const label = makeSvg(\"text\", {\n          x: margin.left - 11,\n          y: y(tick),\n          class: \"tsummer-y-label\"\n        });\n        label.textContent = formatValue(tick);\n        gridGroup.appendChild(label);\n      });\n\n      const unit = makeSvg(\"text\", {\n        x: 8,\n        y: 19,\n        class: \"tsummer-axis-unit\"\n      });\n      unit.textContent = \"Temp\u00e9rature (\u00b0C)\";\n      gridGroup.appendChild(unit);\n      svg.appendChild(gridGroup);\n\n      svg.appendChild(\n        makeSvg(\"line\", {\n          x1: margin.left,\n          x2: W - margin.right,\n          y1: y(NORMAL),\n          y2: y(NORMAL),\n          class: \"tsummer-normal-line\",\n          \"aria-hidden\": \"true\"\n        })\n      );\n\n      const normalLabel = makeSvg(\"text\", {\n        x: W - margin.right - 3,\n        y: y(NORMAL) - 8,\n        class: \"tsummer-normal-label\",\n        \"aria-hidden\": \"true\"\n      });\n      normalLabel.textContent = \"Normale 1991-2020 : 20,35 \u00b0C\";\n      svg.appendChild(normalLabel);\n\n      const linePath = data\n        .map(([, value], index) =>\n          `${index === 0 ? \"M\" : \"L\"} ${x(index)} ${y(value)}`\n        )\n        .join(\" \");\n\n      const areaPath =\n        linePath +\n        ` L ${x(data.length - 1)} ${y(minY)}` +\n        ` L ${x(0)} ${y(minY)} Z`;\n\n      svg.appendChild(\n        makeSvg(\"path\", {\n          d: areaPath,\n          class: \"tsummer-area\",\n          fill: `url(#${gradientId})`,\n          \"aria-hidden\": \"true\"\n        })\n      );\n\n      svg.appendChild(\n        makeSvg(\"path\", {\n          d: linePath,\n          class: \"tsummer-curve\",\n          \"aria-hidden\": \"true\"\n        })\n      );\n\n      const labelsGroup = makeSvg(\"g\", { \"aria-hidden\": \"true\" });\n      data.forEach(([year], index) => {\n        if (year % 5 !== 0) return;\n        const label = makeSvg(\"text\", {\n          x: x(index),\n          y: H - 25,\n          class: \"tsummer-x-label\"\n        });\n        label.textContent = year;\n        labelsGroup.appendChild(label);\n      });\n      svg.appendChild(labelsGroup);\n\n      const markerLine = makeSvg(\"line\", {\n        x1: x(activeIndex),\n        x2: x(activeIndex),\n        y1: margin.top,\n        y2: H - margin.bottom,\n        class: \"tsummer-marker-line\",\n        visibility: \"hidden\",\n        \"aria-hidden\": \"true\"\n      });\n      svg.appendChild(markerLine);\n\n      const marker = makeSvg(\"circle\", {\n        cx: x(activeIndex),\n        cy: y(data[activeIndex][1]),\n        r: 4.7,\n        class: \"tsummer-marker\",\n        visibility: \"hidden\",\n        \"aria-hidden\": \"true\"\n      });\n      svg.appendChild(marker);\n\n      const overlay = makeSvg(\"rect\", {\n        x: margin.left,\n        y: margin.top,\n        width: plotW,\n        height: plotH,\n        class: \"tsummer-overlay\",\n        \"aria-hidden\": \"true\"\n      });\n      svg.appendChild(overlay);\n\n      const setSelectionCard = (index) => {\n        const [year, value] = data[index];\n        selection.classList.add(\"has-value\");\n        selection.innerHTML =\n          `<strong>\u00c9t\u00e9 ${year}<\/strong> \u2014 temp\u00e9rature moyenne : ` +\n          `<strong>${formatValue(value)} \u00b0C<\/strong> \u2022 \u00e9cart \u00e0 la normale : ` +\n          `<strong>${formatGap(value - NORMAL)} \u00b0C<\/strong>`;\n      };\n\n      const placeTooltip = (index) => {\n        const [year, value] = data[index];\n        const svgRect = svg.getBoundingClientRect();\n        const stageRect = stage.getBoundingClientRect();\n        const pointClientX = svgRect.left + (x(index) \/ W) * svgRect.width;\n        const pointClientY = svgRect.top + (y(value) \/ H) * svgRect.height;\n        const tooltipX = Math.max(\n          120,\n          Math.min(stageRect.width - 120, pointClientX - stageRect.left)\n        );\n        const tooltipY = Math.max(86, pointClientY - stageRect.top);\n\n        tooltip.innerHTML =\n          `<strong>\u00c9t\u00e9 ${year}<\/strong>` +\n          `<span>Temp\u00e9rature moyenne : ${formatValue(value)} \u00b0C<\/span>` +\n          `<span>\u00c9cart \u00e0 la normale : ${formatGap(value - NORMAL)} \u00b0C<\/span>`;\n        tooltip.style.left = `${tooltipX}px`;\n        tooltip.style.top = `${tooltipY}px`;\n        tooltip.classList.add(\"is-visible\");\n        tooltip.setAttribute(\"aria-hidden\", \"false\");\n      };\n\n      const showIndex = (index, showTooltip = true) => {\n        activeIndex = Math.max(0, Math.min(data.length - 1, index));\n        const value = data[activeIndex][1];\n        markerLine.setAttribute(\"x1\", x(activeIndex));\n        markerLine.setAttribute(\"x2\", x(activeIndex));\n        markerLine.setAttribute(\"visibility\", \"visible\");\n        marker.setAttribute(\"cx\", x(activeIndex));\n        marker.setAttribute(\"cy\", y(value));\n        marker.setAttribute(\"visibility\", \"visible\");\n        setSelectionCard(activeIndex);\n        if (showTooltip) placeTooltip(activeIndex);\n      };\n\n      const resetSelectionCard = () => {\n        selection.classList.remove(\"has-value\");\n        selection.textContent =\n          \"Survolez ou touchez la courbe pour afficher la temp\u00e9rature d\u2019une ann\u00e9e.\";\n      };\n\n      const hidePointer = (resetCard = false) => {\n        markerLine.setAttribute(\"visibility\", \"hidden\");\n        marker.setAttribute(\"visibility\", \"hidden\");\n        tooltip.classList.remove(\"is-visible\");\n        tooltip.setAttribute(\"aria-hidden\", \"true\");\n        if (resetCard) resetSelectionCard();\n      };\n\n      const indexFromPointer = (event) => {\n        const rect = svg.getBoundingClientRect();\n        const svgX = ((event.clientX - rect.left) \/ rect.width) * W;\n        const ratio = (svgX - margin.left) \/ plotW;\n        return Math.round(\n          Math.max(0, Math.min(1, ratio)) * (data.length - 1)\n        );\n      };\n\n      overlay.addEventListener(\"pointerenter\", (event) => {\n        if (event.pointerType === \"mouse\" || !pinned) {\n          showIndex(indexFromPointer(event));\n        }\n      });\n\n      overlay.addEventListener(\"pointermove\", (event) => {\n        if (event.pointerType === \"mouse\" || !pinned) {\n          showIndex(indexFromPointer(event));\n        }\n      });\n\n      overlay.addEventListener(\"pointerleave\", (event) => {\n        if (event.pointerType === \"mouse\") {\n          pinned = false;\n          hidePointer(true);\n        } else if (!pinned) {\n          hidePointer(true);\n        }\n      });\n\n      overlay.addEventListener(\"pointerdown\", (event) => {\n        if (event.pointerType === \"mouse\") return;\n        pinned = true;\n        showIndex(indexFromPointer(event));\n      });\n\n      svg.addEventListener(\"keydown\", (event) => {\n        if (event.key !== \"ArrowLeft\" && event.key !== \"ArrowRight\" &&\n            event.key !== \"Home\" && event.key !== \"End\" &&\n            event.key !== \"Enter\" && event.key !== \" \" &&\n            event.key !== \"Escape\") return;\n\n        event.preventDefault();\n\n        if (event.key === \"ArrowLeft\") {\n          pinned = true;\n          showIndex(activeIndex - 1);\n        } else if (event.key === \"ArrowRight\") {\n          pinned = true;\n          showIndex(activeIndex + 1);\n        } else if (event.key === \"Home\") {\n          pinned = true;\n          showIndex(0);\n        } else if (event.key === \"End\") {\n          pinned = true;\n          showIndex(data.length - 1);\n        } else if (event.key === \"Enter\" || event.key === \" \") {\n          pinned = true;\n          showIndex(activeIndex);\n        } else if (event.key === \"Escape\") {\n          pinned = false;\n          hidePointer(true);\n        }\n      });\n\n      toggle.addEventListener(\"click\", () => {\n        const willShow = content.hidden;\n        content.hidden = !willShow;\n        toggle.classList.toggle(\"is-active\", willShow);\n        toggle.setAttribute(\"aria-checked\", String(willShow));\n        toggleLabel.textContent = willShow\n          ? \"Masquer le diagramme\"\n          : \"Afficher le diagramme\";\n\n        pinned = false;\n        hidePointer(true);\n      });\n\n      window.addEventListener(\"resize\", () => {\n        if (tooltip.classList.contains(\"is-visible\")) {\n          placeTooltip(activeIndex);\n        }\n      });\n    });\n  })();\n<\/script><script async src=\"https:\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-8902396130105212\"\n     crossorigin=\"anonymous\"><\/script>\n<!-- bas de page -->\n<ins class=\"adsbygoogle\"\n     style=\"display:block\"\n     data-ad-client=\"ca-pub-8902396130105212\"\n     data-ad-slot=\"7724440717\"\n     data-ad-format=\"auto\"\n     data-full-width-responsive=\"true\"><\/ins>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><!-- BOUTON SOMMAIRE CLIMATOLOGIE \u2014 WORDPRESS -->\n\n<style>\n  .sommaire-climatologie-wrap {\n    display: flex;\n    justify-content: center;\n    margin: 24px 0;\n  }\n\n  .sommaire-climatologie {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 15px 32px;\n    color: #ffffff !important;\n    font-family: inherit;\n    font-size: 17px;\n    font-weight: 800;\n    line-height: 1.2;\n    letter-spacing: 0.7px;\n    text-align: center;\n    text-decoration: none !important;\n    text-transform: uppercase;\n    border: 1px solid rgba(255, 255, 255, 0.3);\n    border-radius: 14px;\n    background: linear-gradient(135deg, #064e3b, #059669);\n    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.3);\n    transition: transform 0.25s ease, box-shadow 0.25s ease;\n  }\n\n  .sommaire-climatologie:hover {\n    color: #ffffff !important;\n    transform: translateY(-3px);\n    box-shadow: 0 12px 26px rgba(5, 150, 105, 0.42);\n  }\n\n  .sommaire-climatologie:focus-visible {\n    outline: 3px solid #fbbf24;\n    outline-offset: 4px;\n  }\n\n  @media (max-width: 600px) {\n    .sommaire-climatologie {\n      width: 100%;\n      padding: 15px 20px;\n      font-size: 16px;\n    }\n  }\n<\/style>\n\n<div class=\"sommaire-climatologie-wrap\">\n  <a class=\"sommaire-climatologie\"\n     href=\"https:\/\/alertes-meteo.com\/index.php\/climatologie\/\"\n     aria-label=\"Acc\u00e9der au sommaire Climatologie\">\n    Sommaire Climatologie\n  <\/a>\n<\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":61410,"parent":60843,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_seopress_titles_title":"Temp\u00e9rature Moyenne \u00e9t\u00e9 France : \u00c9volution depuis 1921 | Alertes-M\u00e9t\u00e9o","_seopress_titles_desc":"Temp\u00e9rature moyenne de \u00e9t\u00e9 en France depuis 1921 : \u00e9volution, records et conseils pratiques","_seopress_robots_index":"","_seopress_robots_follow":"","_seopress_robots_imageindex":"","_seopress_robots_snippet":"","_seopress_robots_primary_cat":"","_seopress_robots_breadcrumbs":"","_seopress_robots_freeze_modified_date":"","_seopress_robots_custom_modified_date":"","_seopress_robots_canonical":"","_seopress_social_fb_title":"","_seopress_social_fb_desc":"","_seopress_social_fb_img":"","_seopress_social_fb_img_attachment_id":0,"_seopress_social_fb_img_width":0,"_seopress_social_fb_img_height":0,"_seopress_social_twitter_title":"","_seopress_social_twitter_desc":"","_seopress_social_twitter_img":"","_seopress_social_twitter_img_attachment_id":0,"_seopress_social_twitter_img_width":0,"_seopress_social_twitter_img_height":0,"_seopress_redirections_value":"","_seopress_redirections_enabled":"","_seopress_redirections_enabled_regex":"","_seopress_redirections_logged_status":"both","_seopress_redirections_param":"","_seopress_redirections_type":301,"_seopress_analysis_target_kw":"temperature mer","footnotes":""},"class_list":["post-61404","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/pages\/61404","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/comments?post=61404"}],"version-history":[{"count":4,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/pages\/61404\/revisions"}],"predecessor-version":[{"id":61411,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/pages\/61404\/revisions\/61411"}],"up":[{"embeddable":true,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/pages\/60843"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/media\/61410"}],"wp:attachment":[{"href":"https:\/\/alertes-meteo.com\/index.php\/wp-json\/wp\/v2\/media?parent=61404"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}