27.10.2022, aktualisiert am 09.11.2022

3186

Klimastreifen (farbcodes)

Hallo,
ich suche ein kl. Javascriptprogramm, welches mir Farb-bar-codes anhand der Jahreszahl entsprechende Temperatur oder vllt. aus einer db (Land, Bundesland, Stadt) erstellt.

Also ähnlich wie es diese Seite Klimawandel-Barcodes für alle 16 Bundesländer darstellt.

Hintergund: Ich würde gerne einen Text nach den Stripes einfärben.

(Hierzu würde dann in einer db (oder Array) nachgeschaut und anhand der Temperatur (Oder Ort nacheinander) die Jahres-Farb-Codes zurückgegeben um die einzelnen Buchstaben vom Satz/Text einzufärben. Wäre auch eine schöne Programmieraufgabe für eine AG oder Schulklasse oder HiWi oder Auszubildenden.)

(bytheway not OT und zum Thema passend. Heute erschien: BuchTipp)

viele Grüße
Nebellicht

#Klima
#climatestripes

Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben

Content-ID: 4419417481

Url: https://administrator.de/forum/klimastreifen-farbcodes-4419417481.html

Ausgedruckt am: 22.12.2024 um 06:12 Uhr

24 Kommentare

Neuester Kommentar

https://softgarden.com/de/blog/20-besten-nischen-jobboersen-entwickler-p ...

Wäre auch eine schöne Programmieraufgabe für eine AG oder Schulklasse oder HiWi oder Auszubildenden.

Oder dich 😂
https://jsfiddle.net/hv0Lydjo/

Sieht für mich eher nach HSL Color aus.
Quick 'n' dirty fürs JSFiddle:

// percentage -100..100 where 0 represents the mean value
for (var i = -100; i <= 100; ++i) {
  if (i < 0) {
    // hue: blue
    var h = 240;
    // lightness: 25..100 %
    var l = 100 + Math.round(0.75 * i);
  } else {
    // hue: red
    var h = 0;
    // lightness: 100..25 %
    var l = 100 - Math.round(0.75 * i);
  }
  // saturation: always 100 %
  var color = "hsl(" + h + ", 100%," + l + "%)";  

  var el = document.createElement("div");  
  el.style.backgroundColor = color;
  el.innerText = i + "%";  
  el.style.float = "left";  
  el.style.minWidth = "50px";  
  el.clientHeight = "10px";  
  el.style.margin = "2px";  
  el.style.padding = "2px";  
  el.style.textAlign = "center";  
  document.body.appendChild(el);
}

Steffen

Essen-Bredeney Jahresmittel der Lufttemperatur
vom https://www.dwd.de

<script type="text/javascript">  
<!--

var x = new Array(125);
for (var i = 0; i < x.length; i++) { x[i] = new Array(1);}

// Jahr und Temperatur.

// Essen-Bredeney // Jahresmittel der Lufttemperatur

x=[1888, 8.38];
x[1]=[1889, 9.17];
x[2]=[1890, 8.58];
x[3]=[1891, 9.02];
x[4]=[1892, 9.17];
x[5]=[1893, 9.99];
x[6]=[1894, 10.22];
x[7]=[1895, 9.54];
x[8]=[1896, 9.67];
x[9]=[1901, 9.12];
x[10]=[1902, 8.38];
x[11]=[1903, 9.61];
x[12]=[1904, 9.42];
x[13]=[1905, 9.14];
x[14]=[1906, 9.52];
x[15]=[1907, 9.19];
x[16]=[1908, 9.03];
x[17]=[1909, 8.87];
x[18]=[1910, 9.98];
x[19]=[1911, 10.64];
x[20]=[1912, 9.72];
x[21]=[1913, 10.14];
x[22]=[1914, 9.73];
x[23]=[1915, 9.09];
x[24]=[1916, 9.52];
x[25]=[1917, 8.49];
x[26]=[1918, 9.77];
x[27]=[1919, 8.46];
x[28]=[1920, 9.85];
x[29]=[1921, 10.27];
x[30]=[1922, 8.57];
x[31]=[1923, 9.26];
x[32]=[1924, 9.02];
x[33]=[1925, 9.20];
x[34]=[1926, 10.02];
x[35]=[1927, 9.22];
x[36]=[1928, 9.36];
x[37]=[1929, 8.78];
x[38]=[1930, 9.86];
x[39]=[1931, 8.63];
x[40]=[1932, 9.44];
x[41]=[1933, 8.84];
x[42]=[1934, 10.38];
x[43]=[1935, 9.64];
x[44]=[1936, 9.47];
x[45]=[1938, 9.84];
x[46]=[1939, 9.77];
x[47]=[1940, 8.24];
x[48]=[1941, 8.78];
x[49]=[1942, 8.60];
x[50]=[1943, 10.05];
x[51]=[1944, 9.35];
x[52]=[1948, 10.48];
x[53]=[1949, 10.49];
x[54]=[1950, 9.77];
x[55]=[1951, 9.98];
x[56]=[1953, 10.13];
x[57]=[1954, 9.13];
x[58]=[1955, 8.96];
x[59]=[1956, 8.15];
x[60]=[1957, 9.98];
x[61]=[1958, 9.45];
x[62]=[1959, 10.77];
x[63]=[1960, 9.81];
x[64]=[1961, 10.25];
x[65]=[1962, 8.20];
x[66]=[1963, 8.27];
x[67]=[1964, 9.58];
x[68]=[1965, 8.82];
x[69]=[1966, 9.79];
x[70]=[1967, 10.06];
x[71]=[1968, 9.40];
x[72]=[1969, 9.41];
x[73]=[1970, 9.28];
x[74]=[1971, 9.91];
x[75]=[1972, 9.23];
x[76]=[1973, 9.64];
x[77]=[1974, 9.95];
x[78]=[1975, 10.14];
x[79]=[1976, 10.16];
x[80]=[1977, 9.86];
x[81]=[1978, 9.04];
x[82]=[1979, 8.77];
x[83]=[1980, 9.18];
x[84]=[1981, 9.33];
x[85]=[1982, 10.44];
x[86]=[1983, 10.33];
x[87]=[1984, 9.49];
x[88]=[1985, 8.52];
x[89]=[1986, 9.09];
x[90]=[1987, 8.76];
x[91]=[1988, 10.20];
x[92]=[1989, 10.97];
x[93]=[1990, 10.75];
x[94]=[1991, 9.72];
x[95]=[1992, 10.53];
x[96]=[1993, 9.78];
x[97]=[1994, 10.89];
x[98]=[1995, 10.48];
x[99]=[1996, 8.54];
x[100]=[1997, 10.30];
x[101]=[1998, 10.13];
x[102]=[1999, 10.91];
x[103]=[2000, 10.96];
x[104]=[2001, 10.19];
x[105]=[2002, 10.69];
x[106]=[2003, 10.68];
x[107]=[2004, 9.89];
x[108]=[2005, 10.33];
x[109]=[2006, 10.77];
x[110]=[2007, 10.98];
x[111]=[2008, 10.42];
x[112]=[2009, 10.51];
x[113]=[2010, 9.09];
x[114]=[2011, 11.12];
x[115]=[2012, 10.27];
x[116]=[2013, 9.72];
x[117]=[2014, 11.65];
x[118]=[2015, 10.92];
x[119]=[2016, 10.77];
x[120]=[2017, 10.92];
x[121]=[2018, 11.79];
x[122]=[2019, 11.44];
x[123]=[2020, 11.84];
x[124]=[2021, 10.42];


console.log(x);
-->
</script>

Na ist doch super. Mittelwert feststellen, Min/Max feststellen. Range festlegen was deine 100% nach oben und unten sind und Werte in % umrechnen. Easy.

Viel Spaß,
Steffen

Hi Steffen, den code kann ich nicht lesen od. anpassen. Da steckt komprimiertes Wissen drin

Textzug wäre "Hallo Welt! In climate stripes"

Gruß Nebellicht.

Zitat von @Nebellicht:

Hi Steffen, den code kann ich nicht lesen od. anpassen. Da steckt komprimiertes Wissen drin

Textzug wäre "Hallo Welt! In climate stripes"

Wie wäre es, wen du mal ein wenig selbst Hirnschmalz da reinsteckst.

lks

Zitat von @Lochkartenstanzer:

Zitat von @Nebellicht:

Hi Steffen, den code kann ich nicht lesen od. anpassen. Da steckt komprimiertes Wissen drin

Textzug wäre "Hallo Welt! In climate stripes"

Wie wäre es, wen du mal ein wenig selbst Hirnschmalz da reinsteckst.

lks

Von Dir kommt auch nix Neues. (Lochkarten... Luftlöcher... heiße Luft durch nix.

Tja manch einer schwafelt viel von Klima hat aber selbst bei der Prozentrechnung in der Schule gefehlt ... vermutlich auf irgendeiner Demo abgehangen, ist ja auch nicht so anstrengend, nä, immer dat selbe ... Da liefert man schon Steilvorlagen und es reicht immer noch nicht ...🤮 Herr lass Hirn regnen.
Tu was für's Klima, meld dich ab, und schalte den Rechner aus.

das ist Mobbing! @4400667902 (=misstöne)

Zitat von @Nebellicht:

das ist Mobbing! @4400667902 (=misstöne)

Das ist nur dünne Haut und Faulheit

falsch! @lochie Hier ist er auch am Verfolgen.
Tags für die grüne IT gewünscht

Textzug wäre "Hallo Welt! In climate stripes"

Ja nee, is klar. Und ich verteile nun 125 Farbwerte auf ein paar Buchstaben? Und schreib dir noch den Quelltext für deine Webseite? Nee! Ich bin da ziemlich nah bei meinen Vorrednern. Das bisschen Mathe liefere ich dir noch, dann ist aber auch mal gut.

Steffen

var x = [
  [1888, 8.38],
  [1889, 9.17],
  [1890, 8.58],
  [1891, 9.02],
  [1892, 9.17],
  [1893, 9.99],
  [1894, 10.22],
  [1895, 9.54],
  [1896, 9.67],
  [1901, 9.12],
  [1902, 8.38],
  [1903, 9.61],
  [1904, 9.42],
  [1905, 9.14],
  [1906, 9.52],
  [1907, 9.19],
  [1908, 9.03],
  [1909, 8.87],
  [1910, 9.98],
  [1911, 10.64],
  [1912, 9.72],
  [1913, 10.14],
  [1914, 9.73],
  [1915, 9.09],
  [1916, 9.52],
  [1917, 8.49],
  [1918, 9.77],
  [1919, 8.46],
  [1920, 9.85],
  [1921, 10.27],
  [1922, 8.57],
  [1923, 9.26],
  [1924, 9.02],
  [1925, 9.20],
  [1926, 10.02],
  [1927, 9.22],
  [1928, 9.36],
  [1929, 8.78],
  [1930, 9.86],
  [1931, 8.63],
  [1932, 9.44],
  [1933, 8.84],
  [1934, 10.38],
  [1935, 9.64],
  [1936, 9.47],
  [1938, 9.84],
  [1939, 9.77],
  [1940, 8.24],
  [1941, 8.78],
  [1942, 8.60],
  [1943, 10.05],
  [1944, 9.35],
  [1948, 10.48],
  [1949, 10.49],
  [1950, 9.77],
  [1951, 9.98],
  [1953, 10.13],
  [1954, 9.13],
  [1955, 8.96],
  [1956, 8.15],
  [1957, 9.98],
  [1958, 9.45],
  [1959, 10.77],
  [1960, 9.81],
  [1961, 10.25],
  [1962, 8.20],
  [1963, 8.27],
  [1964, 9.58],
  [1965, 8.82],
  [1966, 9.79],
  [1967, 10.06],
  [1968, 9.40],
  [1969, 9.41],
  [1970, 9.28],
  [1971, 9.91],
  [1972, 9.23],
  [1973, 9.64],
  [1974, 9.95],
  [1975, 10.14],
  [1976, 10.16],
  [1977, 9.86],
  [1978, 9.04],
  [1979, 8.77],
  [1980, 9.18],
  [1981, 9.33],
  [1982, 10.44],
  [1983, 10.33],
  [1984, 9.49],
  [1985, 8.52],
  [1986, 9.09],
  [1987, 8.76],
  [1988, 10.20],
  [1989, 10.97],
  [1990, 10.75],
  [1991, 9.72],
  [1992, 10.53],
  [1993, 9.78],
  [1994, 10.89],
  [1995, 10.48],
  [1996, 8.54],
  [1997, 10.30],
  [1998, 10.13],
  [1999, 10.91],
  [2000, 10.96],
  [2001, 10.19],
  [2002, 10.69],
  [2003, 10.68],
  [2004, 9.89],
  [2005, 10.33],
  [2006, 10.77],
  [2007, 10.98],
  [2008, 10.42],
  [2009, 10.51],
  [2010, 9.09],
  [2011, 11.12],
  [2012, 10.27],
  [2013, 9.72],
  [2014, 11.65],
  [2015, 10.92],
  [2016, 10.77],
  [2017, 10.92],
  [2018, 11.79],
  [2019, 11.44],
  [2020, 11.84],
  [2021, 10.42]
];

function print_climatecolors(percent, txt) {
  if (percent < 0) {
    // hue: blue
    var h = 240;
    // lightness: 25..100 %
    var l = 100 + Math.round(0.75 * percent);
  } else {
    // hue: red
    var h = 0;
    // lightness: 100..25 %
    var l = 100 - Math.round(0.75 * percent);
  }
  // saturation: always 100 %
  var color = "hsl(" + h + ", 100%, " + l + "%)";  

  var el = document.createElement("div");  
  el.style.backgroundColor = color;
  el.innerText = txt;
  el.style.float = "left";  
  el.style.minWidth = "50px";  
  el.clientHeight = "10px";  
  el.style.margin = "2px";  
  el.style.padding = "2px";  
  el.style.textAlign = "center";  
  document.body.appendChild(el);
}

var min = x[1];
var max = x[1];
var sum = 0;
for (var i = 0; i < x.length; ++i) {
  var cur = x[i][1];
  if (cur < min) { min=cur; }
  if (cur > max) { max=cur; }
  sum+=cur;
}

var avg = sum / x.length;
var range = Math.max(max - avg, avg - min);

for (var i = 0; i < x.length; ++i) {
  print_climatecolors(100 * (x[i][1] - avg) / range, x[i]);
}

Vielen Dank. @steffen

so siehts für Essen-Bredeney (Beispielsweise für NRW) aus:

1888 - 2021
Anmerkung: Ich hatte so Probleme mit dem HSL Farbcode (Farbton, Sättigung und Helligkeit) aber das nur am Rande.

Schönes Wochenende! Gruß Nebellicht.

Das löst aber nicht das Problem, daß manche den Unterschied zwischen Korrelation und Kausalität nicht kennen. Und vor allem, daß sich Klimaänderingen Jahrhunderten und nicht einzelnen Jahren abspielen.

lks

Bevor uns die Wärme brutzelt haben wir uns mit unseren eigenen Waffen atomisiert ... Die Frage ist nicht ob sondern wann, und dann hat sich das mit dem Klima von selbst erledigt.

Korrelation
BILDUNGSSPRACHLICH•FACHSPRACHE

wechselseitige Beziehung "die Korrelation zwischen Angebot und Nachfrage"

MATHEMATIK

nur statistisch, mithilfe der Wahrscheinlichkeitsrechnung zu erfassender [loser, zufälliger] Zusammenhang zwischen bestimmten Erscheinungen

Kausalität
kausaler Zusammenhang; Ursächlichkeit

Jahrhunderte
(2021-1880)/100)= 1,33

Zeigt, daß Du meine Aussage nicht verstanden hast.

lks

"Ganz dünnes Eis" (globale FFF Demo 2022 in Aachen)

Zitat von @Nebellicht:
"Ganz dünnes Eis" (globale FFF Demo 2022 in Aachen)

Och je is des aber schee, die geimpften FFFler💉sammeln Kohle für ein Leben nach der Hauptschule, an die Straße gewôhnen sie sich ja schon 😂.

Zitat von @4400667902:

Zitat von @Nebellicht:
"Ganz dünnes Eis" (globale FFF Demo 2022 in Aachen)

Och je is des aber schee, die geimpften FFFler💉sammeln Kohle für ein Leben nach der Hauptschule, an die Straße gewôhnen sie sich ja schon 😂.

Naja, es ist nicht ganz klar, wer die ganze Kohle einsackt die da kassiert wird. Denn es ist ist nicht herauszufinden, wer hinter den Bankkonten steckt. Siehe z.B. https://www.danisch.de/blog/2021/03/29/datenschutz-das-betrugssystem-fri ... und den darin verlinkten Artikeln.

FFF ist ist ein Veranstaltung, die naive Jugendliche ausnutzt!

lks