Ridgeline plot

.block

license: gpl-3.0
border: no
width: 760
height: 606

README.md

Ridgeline plot

Idea taken from http://www.realclimate.org/index.php/archives/2017/07/joy-plots-for-climate-change/.

Data source : GISS Surface Temperature Analysis (GISTEMP v3) from Goddard Institute for Space Studies, NASA.

GLB.Ts+dSST.csv

Land-Ocean: Global Means
Year,Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec,J-D,D-N,DJF,MAM,JJA,SON
1880,-.29,-.18,-.11,-.20,-.12,-.23,-.21,-.09,-.16,-.23,-.20,-.23,-.19,***,***,-.14,-.18,-.20
1881,-.16,-.17,.04,.04,.02,-.20,-.07,-.03,-.14,-.21,-.22,-.11,-.10,-.11,-.18,.03,-.10,-.19
1882,.14,.15,.03,-.19,-.16,-.26,-.21,-.06,-.10,-.25,-.16,-.25,-.11,-.10,.06,-.10,-.17,-.17
1883,-.32,-.39,-.13,-.17,-.20,-.13,-.08,-.15,-.21,-.14,-.22,-.16,-.19,-.20,-.32,-.17,-.12,-.19
1884,-.16,-.08,-.37,-.43,-.37,-.41,-.35,-.26,-.27,-.24,-.30,-.29,-.29,-.28,-.13,-.39,-.34,-.27
1885,-.59,-.30,-.25,-.42,-.42,-.44,-.36,-.32,-.24,-.19,-.20,-.05,-.32,-.34,-.39,-.37,-.37,-.21
1886,-.42,-.45,-.39,-.28,-.26,-.39,-.22,-.34,-.26,-.29,-.31,-.27,-.32,-.31,-.31,-.31,-.32,-.29
1887,-.73,-.52,-.34,-.39,-.32,-.24,-.23,-.32,-.23,-.33,-.23,-.34,-.35,-.35,-.51,-.35,-.27,-.26
1888,-.38,-.36,-.41,-.22,-.22,-.18,-.09,-.16,-.10,.02,.01,-.06,-.18,-.20,-.36,-.29,-.14,-.02
1889,-.11,.19,.08,.07,-.02,-.14,-.10,-.20,-.22,-.22,-.33,-.30,-.11,-.09,.00,.04,-.14,-.26
1890,-.44,-.45,-.40,-.37,-.45,-.27,-.27,-.38,-.39,-.24,-.48,-.31,-.37,-.37,-.40,-.41,-.31,-.37
1891,-.42,-.47,-.19,-.28,-.18,-.20,-.20,-.16,-.14,-.21,-.35,-.04,-.24,-.26,-.40,-.21,-.19,-.23
1892,-.28,-.12,-.35,-.35,-.25,-.23,-.32,-.25,-.13,-.13,-.42,-.39,-.27,-.24,-.15,-.32,-.27,-.22
1893,-.80,-.54,-.23,-.30,-.36,-.29,-.16,-.27,-.20,-.17,-.17,-.35,-.32,-.32,-.58,-.30,-.24,-.18
1894,-.54,-.33,-.25,-.48,-.35,-.44,-.26,-.22,-.25,-.21,-.25,-.20,-.31,-.33,-.41,-.36,-.31,-.24
1895,-.44,-.42,-.29,-.25,-.27,-.24,-.18,-.16,-.09,-.08,-.15,-.16,-.23,-.23,-.35,-.27,-.19,-.11
1896,-.26,-.14,-.26,-.31,-.18,-.14,-.04,-.04,-.03,.11,-.08,-.04,-.12,-.13,-.19,-.25,-.07,.00
1897,-.15,-.15,-.14,-.02,-.05,-.16,-.07,-.11,-.08,-.12,-.19,-.19,-.12,-.11,-.11,-.07,-.11,-.13
1898,-.03,-.30,-.52,-.33,-.32,-.21,-.24,-.25,-.22,-.33,-.38,-.25,-.28,-.28,-.17,-.39,-.23,-.31
1899,-.19,-.40,-.34,-.21,-.23,-.33,-.18,-.07,-.03,-.05,.12,-.28,-.18,-.18,-.28,-.26,-.19,.01
1900,-.37,-.03,.01,-.12,-.10,-.13,-.13,-.10,-.05,.09,-.10,-.07,-.09,-.11,-.23,-.07,-.12,-.02
1901,-.24,-.04,.08,-.04,-.17,-.13,-.16,-.20,-.22,-.31,-.17,-.28,-.16,-.14,-.12,-.05,-.16,-.24
1902,-.20,-.03,-.29,-.30,-.35,-.35,-.30,-.32,-.29,-.29,-.39,-.46,-.30,-.28,-.17,-.31,-.32,-.33
1903,-.26,-.04,-.24,-.43,-.44,-.46,-.37,-.49,-.49,-.48,-.45,-.52,-.39,-.38,-.25,-.37,-.44,-.47
1904,-.68,-.58,-.51,-.55,-.56,-.51,-.54,-.50,-.53,-.40,-.22,-.35,-.49,-.51,-.59,-.54,-.52,-.38
1905,-.40,-.59,-.24,-.36,-.33,-.31,-.29,-.22,-.19,-.25,-.10,-.19,-.29,-.30,-.45,-.31,-.27,-.18
1906,-.28,-.31,-.16,-.04,-.24,-.21,-.25,-.20,-.27,-.19,-.39,-.16,-.23,-.23,-.26,-.15,-.22,-.28
1907,-.42,-.51,-.27,-.39,-.47,-.44,-.37,-.35,-.33,-.24,-.49,-.48,-.40,-.37,-.37,-.38,-.38,-.35
1908,-.44,-.31,-.54,-.46,-.41,-.41,-.40,-.46,-.36,-.45,-.50,-.49,-.43,-.43,-.41,-.47,-.42,-.44
1909,-.69,-.47,-.51,-.60,-.56,-.53,-.45,-.31,-.35,-.37,-.31,-.55,-.47,-.47,-.55,-.56,-.43,-.34
1910,-.45,-.44,-.51,-.40,-.35,-.38,-.35,-.37,-.36,-.38,-.54,-.66,-.43,-.42,-.48,-.42,-.37,-.43
1911,-.64,-.58,-.60,-.54,-.52,-.48,-.41,-.42,-.38,-.23,-.18,-.22,-.43,-.47,-.63,-.55,-.44,-.26
1912,-.26,-.12,-.35,-.20,-.22,-.26,-.44,-.55,-.51,-.57,-.38,-.43,-.36,-.34,-.20,-.25,-.42,-.49
1913,-.42,-.43,-.43,-.40,-.47,-.49,-.37,-.34,-.36,-.34,-.19,-.04,-.36,-.39,-.43,-.43,-.40,-.30
1914,.04,-.11,-.22,-.29,-.23,-.26,-.24,-.14,-.13,-.04,-.18,-.08,-.16,-.15,-.04,-.25,-.22,-.12
1915,-.17,.00,-.10,.06,-.07,-.21,-.11,-.20,-.17,-.25,-.13,-.17,-.13,-.12,-.09,-.03,-.17,-.18
1916,-.09,-.13,-.28,-.30,-.32,-.47,-.36,-.26,-.32,-.27,-.40,-.80,-.33,-.28,-.13,-.30,-.36,-.33
1917,-.58,-.61,-.60,-.51,-.55,-.43,-.25,-.22,-.18,-.40,-.28,-.68,-.44,-.45,-.67,-.55,-.30,-.29
1918,-.42,-.32,-.25,-.45,-.46,-.36,-.31,-.30,-.15,-.05,-.11,-.28,-.29,-.32,-.47,-.38,-.32,-.10
1919,-.20,-.23,-.20,-.14,-.28,-.38,-.29,-.33,-.22,-.19,-.41,-.42,-.27,-.26,-.24,-.21,-.33,-.28
1920,-.23,-.23,-.08,-.26,-.27,-.36,-.32,-.25,-.20,-.27,-.27,-.44,-.26,-.26,-.29,-.20,-.31,-.24
1921,-.03,-.19,-.23,-.29,-.29,-.28,-.15,-.24,-.17,-.03,-.13,-.17,-.18,-.20,-.22,-.27,-.22,-.11
1922,-.34,-.44,-.13,-.24,-.33,-.33,-.25,-.31,-.32,-.32,-.14,-.18,-.28,-.28,-.32,-.24,-.30,-.26
1923,-.29,-.37,-.35,-.40,-.34,-.26,-.30,-.30,-.28,-.11,.01,-.02,-.25,-.26,-.28,-.36,-.28,-.13
1924,-.22,-.24,-.07,-.31,-.18,-.23,-.26,-.34,-.31,-.34,-.20,-.41,-.26,-.23,-.16,-.19,-.27,-.28
1925,-.36,-.38,-.25,-.25,-.30,-.32,-.28,-.15,-.16,-.18,.04,.09,-.21,-.25,-.38,-.26,-.25,-.10
1926,.19,.06,.11,-.13,-.22,-.23,-.24,-.13,-.13,-.10,-.05,-.28,-.09,-.06,.11,-.08,-.20,-.09
1927,-.27,-.18,-.37,-.31,-.25,-.26,-.16,-.21,-.11,-.01,-.04,-.33,-.21,-.20,-.24,-.31,-.21,-.05
1928,-.01,-.08,-.27,-.28,-.30,-.37,-.19,-.23,-.19,-.17,-.09,-.18,-.20,-.21,-.14,-.28,-.27,-.15
1929,-.46,-.60,-.32,-.40,-.39,-.41,-.33,-.29,-.23,-.12,-.12,-.54,-.35,-.32,-.41,-.37,-.34,-.15
1930,-.30,-.27,-.09,-.24,-.23,-.20,-.20,-.12,-.12,-.09,.15,-.08,-.15,-.19,-.37,-.19,-.17,-.02
1931,-.10,-.24,-.08,-.21,-.20,-.07,-.03,-.03,-.06,.02,-.12,-.09,-.10,-.10,-.14,-.16,-.04,-.05
1932,.14,-.18,-.19,-.06,-.18,-.29,-.24,-.23,-.12,-.10,-.27,-.26,-.17,-.15,-.04,-.15,-.25,-.16
1933,-.34,-.34,-.30,-.25,-.29,-.33,-.21,-.24,-.27,-.21,-.30,-.46,-.29,-.28,-.31,-.28,-.26,-.26
1934,-.24,-.04,-.33,-.30,-.11,-.15,-.10,-.11,-.16,-.08,.03,-.04,-.13,-.17,-.25,-.24,-.12,-.07
1935,-.33,.15,-.13,-.36,-.30,-.27,-.22,-.22,-.21,-.08,-.28,-.20,-.20,-.19,-.07,-.26,-.24,-.19
1936,-.28,-.39,-.22,-.20,-.18,-.21,-.08,-.13,-.09,-.04,-.04,-.03,-.16,-.17,-.29,-.20,-.14,-.05
1937,-.13,.04,-.18,-.17,-.08,-.05,-.05,.02,.11,.08,.09,-.11,-.04,-.03,-.04,-.14,-.03,.10
1938,.01,-.02,.08,.04,-.10,-.18,-.09,-.06,.02,.11,.04,-.22,-.03,-.02,-.04,.01,-.11,.05
1939,-.07,-.08,-.19,-.09,-.06,-.08,-.08,-.07,-.07,-.03,.06,.44,-.03,-.08,-.13,-.11,-.08,-.01
1940,-.06,.13,.15,.18,.10,.08,.12,.05,.13,.08,.17,.28,.12,.13,.17,.14,.08,.13
1941,.21,.32,.08,.17,.14,.12,.21,.14,.02,.34,.24,.21,.18,.19,.27,.13,.16,.20
1942,.26,.02,.09,.11,.09,.04,.00,-.04,-.05,-.01,.08,.07,.05,.07,.16,.09,.00,.00
1943,-.04,.13,-.08,.07,.04,-.06,.08,.00,.06,.22,.19,.24,.07,.06,.05,.01,.01,.16
1944,.35,.26,.27,.20,.19,.20,.18,.17,.30,.26,.10,.02,.21,.23,.29,.22,.18,.22
1945,.09,-.02,.07,.18,.05,-.01,.03,.27,.22,.19,.07,-.09,.09,.10,.03,.10,.10,.16
1946,.15,.07,.01,.06,-.08,-.21,-.14,-.16,-.07,-.06,-.06,-.35,-.07,-.05,.04,-.01,-.17,-.06
1947,-.13,-.08,.07,.07,-.03,.02,-.08,-.09,-.13,.06,.02,-.16,-.04,-.06,-.19,.03,-.05,-.02
1948,.07,-.15,-.25,-.11,.01,-.04,-.11,-.12,-.11,-.07,-.12,-.23,-.10,-.10,-.08,-.12,-.09,-.10
1949,.09,-.16,-.02,-.10,-.08,-.23,-.14,-.12,-.14,-.06,-.10,-.22,-.11,-.11,-.10,-.07,-.16,-.10
1950,-.33,-.28,-.07,-.20,-.09,-.03,-.10,-.16,-.12,-.22,-.38,-.20,-.18,-.18,-.28,-.12,-.10,-.24
1951,-.35,-.43,-.21,-.13,.00,-.02,.03,.06,.08,.05,-.02,.14,-.07,-.09,-.32,-.11,.02,.04
1952,.13,.11,-.10,.02,-.02,-.04,.04,.04,.07,-.01,-.14,-.01,.01,.02,.12,-.03,.01,-.03
1953,.08,.14,.11,.18,.09,.10,.00,.06,.04,.06,-.06,.02,.07,.07,.07,.13,.05,.01
1954,-.28,-.13,-.15,-.17,-.21,-.17,-.19,-.17,-.10,-.04,.06,-.22,-.15,-.13,-.13,-.18,-.18,-.03
1955,.14,-.17,-.34,-.21,-.21,-.12,-.12,.01,-.11,-.05,-.24,-.30,-.14,-.14,-.08,-.25,-.08,-.13
1956,-.16,-.26,-.23,-.27,-.31,-.16,-.12,-.26,-.20,-.24,-.17,-.08,-.21,-.22,-.24,-.27,-.18,-.20
1957,-.11,-.04,-.06,-.01,.09,.16,.01,.15,.09,.01,.06,.16,.04,.02,-.07,.01,.11,.06
1958,.39,.24,.11,.03,.07,-.07,.05,-.03,-.02,.04,.02,.00,.07,.08,.26,.07,-.02,.02
1959,.08,.09,.18,.13,.04,.02,.06,-.01,-.06,-.09,-.09,-.01,.03,.03,.06,.12,.02,-.08
1960,-.01,.16,-.34,-.14,-.07,-.04,-.03,.01,.07,.07,-.12,.18,-.02,-.04,.05,-.19,-.02,.01
1961,.07,.19,.09,.12,.11,.11,.00,.03,.07,.00,.03,-.15,.06,.08,.15,.11,.05,.03
1962,.07,.14,.12,.04,-.04,.04,.02,-.01,.01,.00,.07,.00,.04,.03,.02,.04,.02,.03
1963,-.02,.20,-.14,-.06,-.04,.05,.08,.27,.20,.15,.15,-.01,.07,.07,.06,-.08,.14,.17
1964,-.08,-.13,-.23,-.31,-.25,-.02,-.03,-.21,-.29,-.31,-.21,-.30,-.20,-.17,-.07,-.26,-.09,-.27
1965,-.08,-.17,-.11,-.19,-.14,-.09,-.12,-.03,-.16,-.05,-.07,-.06,-.11,-.13,-.18,-.15,-.08,-.09
1966,-.17,-.01,.05,-.12,-.11,.01,.09,-.08,-.02,-.15,-.02,-.06,-.05,-.05,-.08,-.06,.01,-.06
1967,-.06,-.21,.04,-.05,.14,-.08,.01,.01,-.06,.08,-.07,-.03,-.02,-.02,-.11,.05,-.02,-.01
1968,-.25,-.15,.20,-.06,-.13,-.08,-.12,-.09,-.18,.10,-.03,-.13,-.08,-.07,-.14,.00,-.10,-.04
1969,-.11,-.14,.01,.18,.19,.05,-.02,.03,.09,.13,.13,.27,.07,.03,-.13,.13,.02,.11
1970,.09,.22,.08,.09,-.04,-.02,-.02,-.09,.11,.06,.02,-.12,.03,.06,.19,.04,-.04,.06
1971,-.02,-.20,-.17,-.08,-.05,-.19,-.11,-.03,-.04,-.06,-.05,-.09,-.09,-.09,-.11,-.10,-.11,-.05
1972,-.24,-.17,.02,.00,-.04,.06,.01,.17,.02,.09,.04,.20,.01,-.01,-.17,.00,.08,.05
1973,.29,.31,.27,.26,.26,.18,.10,.03,.10,.14,.06,-.06,.16,.18,.27,.26,.11,.10
1974,-.15,-.28,-.05,-.11,-.02,-.06,-.04,.11,-.11,-.08,-.07,-.09,-.08,-.08,-.16,-.06,.00,-.09
1975,.07,.07,.13,.05,.16,.01,-.01,-.19,-.03,-.09,-.16,-.17,-.01,-.01,.02,.11,-.06,-.09
1976,-.01,-.06,-.21,-.08,-.24,-.16,-.10,-.14,-.09,-.26,-.04,.10,-.11,-.13,-.08,-.18,-.13,-.13
1977,.19,.22,.25,.28,.30,.24,.20,.16,.00,.02,.17,.02,.17,.18,.17,.27,.20,.07
1978,.06,.14,.21,.15,.06,-.02,.03,-.17,.05,.00,.16,.10,.06,.06,.07,.14,-.05,.07
1979,.12,-.11,.18,.13,.05,.13,.02,.14,.25,.24,.28,.47,.16,.13,.04,.12,.10,.26
1980,.30,.42,.30,.33,.36,.17,.28,.23,.19,.18,.29,.20,.27,.29,.40,.33,.23,.22
1981,.55,.41,.49,.32,.24,.32,.34,.32,.17,.14,.24,.43,.33,.31,.38,.35,.33,.18
1982,.10,.15,-.01,.10,.15,.05,.13,.07,.14,.13,.15,.43,.13,.13,.23,.08,.08,.14
1983,.52,.41,.43,.31,.36,.20,.18,.33,.39,.16,.32,.17,.32,.34,.45,.37,.24,.29
1984,.30,.17,.29,.08,.33,.05,.17,.16,.21,.16,.06,-.05,.16,.18,.21,.24,.13,.14
1985,.22,-.06,.17,.11,.17,.18,-.01,.15,.15,.11,.08,.15,.12,.10,.03,.15,.11,.11
1986,.28,.39,.27,.24,.24,.11,.11,.12,.00,.13,.11,.16,.18,.18,.27,.25,.11,.08
1987,.36,.46,.16,.22,.25,.37,.45,.28,.39,.32,.25,.48,.33,.31,.33,.21,.37,.32
1988,.58,.43,.51,.45,.43,.43,.34,.47,.41,.39,.12,.33,.41,.42,.49,.47,.41,.31
1989,.15,.35,.36,.33,.16,.14,.34,.37,.37,.32,.20,.38,.29,.29,.28,.29,.28,.30
1990,.41,.41,.77,.55,.46,.38,.43,.31,.29,.41,.46,.41,.44,.44,.40,.59,.37,.39
1991,.41,.49,.35,.52,.38,.53,.48,.40,.48,.30,.31,.32,.41,.42,.44,.42,.47,.36
1992,.44,.42,.48,.24,.32,.25,.12,.07,.00,.09,.03,.22,.22,.23,.39,.35,.15,.04
1993,.37,.39,.36,.27,.27,.25,.28,.13,.10,.22,.06,.16,.24,.24,.32,.30,.22,.13
1994,.27,.02,.27,.40,.28,.42,.30,.21,.29,.41,.46,.36,.31,.29,.15,.32,.31,.38
1995,.51,.78,.45,.47,.26,.41,.48,.46,.32,.47,.45,.28,.45,.45,.55,.40,.45,.42
1996,.25,.48,.32,.36,.27,.25,.35,.49,.25,.19,.41,.40,.34,.33,.34,.32,.36,.28
1997,.31,.38,.53,.36,.36,.53,.35,.41,.53,.62,.65,.59,.47,.45,.36,.42,.43,.60
1998,.60,.90,.63,.63,.69,.77,.68,.66,.42,.44,.49,.56,.62,.62,.69,.65,.70,.45
1999,.48,.65,.34,.32,.31,.37,.37,.31,.41,.39,.38,.43,.40,.41,.56,.32,.35,.39
2000,.23,.56,.57,.57,.36,.41,.38,.42,.40,.28,.32,.29,.40,.41,.41,.50,.40,.33
2001,.42,.43,.55,.50,.56,.54,.60,.48,.53,.50,.69,.55,.53,.51,.38,.54,.54,.58
2002,.75,.75,.89,.56,.63,.55,.61,.53,.62,.55,.58,.43,.62,.63,.68,.70,.56,.58
2003,.73,.55,.57,.53,.60,.47,.53,.65,.64,.74,.52,.73,.60,.58,.57,.57,.55,.63
2004,.58,.72,.64,.62,.38,.42,.24,.43,.50,.64,.70,.51,.53,.55,.67,.55,.36,.61
2005,.72,.57,.69,.66,.62,.66,.63,.60,.74,.75,.71,.65,.67,.66,.60,.66,.63,.74
2006,.56,.69,.62,.50,.46,.64,.52,.70,.61,.67,.70,.73,.62,.61,.63,.53,.62,.66
2007,.95,.70,.69,.73,.66,.59,.60,.57,.59,.57,.54,.46,.64,.66,.79,.69,.59,.57
2008,.23,.34,.73,.51,.47,.46,.59,.44,.62,.63,.64,.53,.51,.51,.34,.57,.49,.63
2009,.61,.51,.52,.58,.64,.65,.69,.66,.68,.63,.76,.65,.63,.62,.55,.58,.67,.69
2010,.73,.79,.91,.85,.73,.62,.59,.63,.59,.69,.77,.46,.70,.71,.72,.83,.61,.68
2011,.48,.51,.62,.62,.51,.57,.71,.71,.54,.63,.56,.53,.58,.58,.48,.59,.67,.58
2012,.45,.48,.56,.68,.75,.63,.53,.62,.72,.74,.73,.52,.62,.62,.49,.66,.59,.73
2013,.67,.56,.65,.53,.58,.66,.57,.66,.78,.67,.78,.65,.65,.64,.58,.59,.63,.74
2014,.73,.52,.76,.77,.85,.66,.56,.81,.88,.81,.66,.77,.73,.72,.63,.79,.68,.79
2015,.81,.87,.90,.75,.75,.79,.71,.79,.82,1.07,1.03,1.10,.87,.84,.82,.80,.77,.97
2016,1.15,1.35,1.31,1.07,.91,.77,.82,1.00,.88,.90,.91,.83,.99,1.01,1.20,1.10,.86,.89
2017,.98,1.13,1.13,.92,.89,.70,.82,.87,.76,.88,.86,.89,.90,.90,.98,.98,.80,.83
2018,.77,.85,.91,.87,.81,.74,.78,.73,.76,.99,.78,.89,.82,.82,.84,.86,.75,.84
2019,.87,.92,1.11,.97,.85,.86,.90,***,***,***,***,***,***,***,.89,.98,***,***

index.html

<!DOCTYPE html>
<meta charset="utf-8">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Baloo+Bhaina+2:wght@400;800&display=swap" />
<style>
  svg {
    background-color: #f3f3f3;
    border: inset 3px yellow;
  }
  g.tick > text { font-size: 12px; font-family: Helvetica, sans-serif; }
  text { font-family: 'Baloo Bhaina 2', sans-serif; }
</style>
<script src="https://d3js.org/d3.v5.js"></script>
<script src="https://d3js.org/d3-selection-multi.v1.min.js"></script>
<div id="chart"></div>
<script>
const margin = { top: 120, right: 30, bottom: 60, left: 90 };
const width = 760 - margin.left - margin.right
const height = 600 - margin.top - margin.bottom;
const delay = 750;

const svg = d3.select('#chart')
  .append('svg')
  .attr('width', width + margin.left + margin.right)
  .attr('height', height + margin.top + margin.bottom);
const svg_chart = svg.append("g")
  .attr('transform', 'translate(' + margin.left + "," + margin.top + ')');

const categories = ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Aout', 'Septembre', 'Octobre', 'Novembre', 'Décembre'];
const _cat = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];

const lgd = svg.append('g')
  .attr('class', 'legend');

lgd.append('text')
  .attrs({ x: 800 / 2, y: 30, 'text-anchor': 'middle', 'font-weight': 'bold' })
  .html('Comment la distribution des températures a-t-elle évolué depuis le 19ème siècle ?')

lgd.append('text')
  .attrs({ x: 800 / 2, y: 580, 'text-anchor': 'middle' })
  .html('Température (w.r.t. 1951-1980)');

lgd.append('text')
  .attrs({ x: 330, y: 75, 'text-anchor': 'middle' })
  .html('1881 - 1910');

const current_date = lgd.append('text')
  .attrs({ x: 480, y: 75, 'text-anchor': 'middle' });

fetch('GLB.Ts+dSST.csv').then(async (data) => {
  const raw_csv_data = await data.text();
  const first_eol = raw_csv_data.indexOf('\n');
  const parsed_csv = d3.csvParse(raw_csv_data.substring(first_eol + 1));
  const bymon = [];
  _cat.forEach((item, i) => {
    const t = [];
    parsed_csv.forEach((d) => {
      if (d['Year'] != '2019') t.push(+d[item]);
    });
    bymon.push(t);
  });

  const dyr = 5; // 2
  const ns = Math.floor((138 - 30) / dyr) + 1.;
  const n = categories.length;
  const n_records = bymon[0].length;

  const scale_steps = d3.scaleLinear()
    .range([0.5, 1])
    .domain([0, ns]);

  const x = d3.scaleLinear()
    .domain([-1.5, 1.5])
    .range([ 0, width ]);
  svg_chart.append('g')
    .attr('transform', `translate(0,${height})`)
    .call(d3.axisBottom(x).ticks(8));

  const y = d3.scaleLinear()
    .domain([0, 25])
    .range([ height, 0]);

  const yName = d3.scaleBand()
    .domain(categories)
    .range([0, height])
    .paddingInner(1)
  svg_chart.append('g')
    .call(d3.axisLeft(yName));

  const kde = kernelDensityEstimator(kernelEpanechnikov(0.12), x.ticks(40))
  const allDensity = [];
  const allDensity2 = [];
  let step = 1;
  makeDensityArray(allDensity, 0, 30);
  makeJoyplot('areas', allDensity, 0);
  makeJoyplot('areas2', allDensity, 0);

  setInterval(() => {
    let [start, stop] = [step * dyr + 0, step * dyr + 30];
    let [start_year, stop_year] = [1881 + start, 1910 + start];
    if (stop > n_records) {
      stop_year -= (stop - (n_records - 1));
      stop = n_records - 1;
    }

    makeDensityArray(allDensity2, start, stop);

    svg_chart.selectAll(".areas2")
      .data(allDensity2)
      .transition()
      .duration(delay * 0.46)
      .attr('fill', d3.interpolateTurbo(scale_steps(step)))
      .attr('stroke', d3.interpolateTurbo(scale_steps(step < 9 ? ns : 0)))
      .attr('stroke-width', 1)
      .attr('d',  (d) => (d3.line()
          .curve(d3.curveBasis)
          .x((d) => x(d[0]))
          .y((d) => y(d[1]))(d.density))
      );
    setTimeout(() => {
      current_date.html(step === 0 ? '' : `${start_year} - ${stop_year}`);
      step = step === ns ? 0 : step + 1;
    }, delay * 0.3);
  }, delay);

  function makeDensityArray(result, start, stop) {
    for (let i = 0; i < n; i++) {
      result[i] = {
        key: categories[i],
        density: kde(bymon[i].slice(start, stop)),
      };
    }
  }

  function makeJoyplot(className, dens, step) {
    svg_chart.selectAll(className)
      .data(dens)
      .enter()
      .append('path')
        .attr('transform', (d) => `translate(0,${(yName(d.key) - height)})`)
        .attr("class", className)
        .attr('fill', d3.interpolateTurbo(scale_steps(step)))
        .attr('stroke', d3.interpolateTurbo(scale_steps(ns)))
        .attr('stroke-width', 1)
        .attr('d',  (d) => (d3.line()
            .curve(d3.curveBasis)
            .x((d) => x(d[0]))
            .y((d) => y(d[1]))(d.density))
        );
  }
});

const kernelDensityEstimator = (kernel, X) => (V) => X.map(
    (x) => [x, d3.mean(V, (v) => kernel(x - v))]);
const kernelEpanechnikov = (k) => (v) => Math.abs(
  v /= k) <= 1 ? 0.75 * (1 - v * v) / k : 0;
</script>

thumbnail.png