diff --git a/docs/IntensiveCareCapacitiesChartView.js b/docs/IntensiveCareCapacitiesChartView.js
new file mode 100644
index 00000000000..6f70325f16b
--- /dev/null
+++ b/docs/IntensiveCareCapacitiesChartView.js
@@ -0,0 +1,62 @@
+class IntensiveCareCapacitiesChartView {
+
+    displayChart({ data, canvas, title }) {
+        new Chart(
+            canvas,
+            {
+                type: 'bar',
+                data: this.#getData(data),
+                options: this.#getOptions(title)
+            });
+    }
+
+    #getData(data) {
+        return {
+            datasets: [
+                {
+                    label: 'Belegte Betten',
+                    data: data,
+                    parsing: {
+                        yAxisKey: 'betten_belegt'
+                    },
+                    backgroundColor: 'rgba(255, 0, 0, 1)',
+                },
+                {
+                    label: 'Freie Betten',
+                    data: data,
+                    parsing: {
+                        yAxisKey: 'betten_frei'
+                    },
+                    backgroundColor: 'rgba(0, 255, 0, 1)',
+                }
+            ]
+        };
+    }
+
+    #getOptions(title) {
+        return {
+            plugins: {
+                title: {
+                    display: true,
+                    text: title
+                },
+            },
+            responsive: true,
+            scales: {
+                x: {
+                    stacked: true,
+                    type: 'time',
+                    time: {
+                        unit: 'month'
+                    }
+                },
+                y: {
+                    stacked: true
+                }
+            },
+            parsing: {
+                xAxisKey: 'date'
+            }
+        };
+    }
+}
\ No newline at end of file
diff --git a/docs/UIUtils.js b/docs/UIUtils.js
new file mode 100644
index 00000000000..a3e80645278
--- /dev/null
+++ b/docs/UIUtils.js
@@ -0,0 +1,15 @@
+class UIUtils {
+
+    static instantiateTemplate(templateId) {
+        return document.getElementById(templateId).content.firstElementChild.cloneNode(true);
+    }
+
+    static createChartViewElementWithHeading(heading) {
+        const chartViewElement = UIUtils.instantiateTemplate('template-ChartView');
+        chartViewElement.querySelector(".heading").textContent = heading;
+        return {
+            chartViewElement: chartViewElement,
+            canvas: chartViewElement.querySelector(".canvas")
+        };
+    }    
+}
diff --git a/docs/intensivstationen.html b/docs/intensivstationen.html
index 76d1b1522d8..325c529b849 100644
--- a/docs/intensivstationen.html
+++ b/docs/intensivstationen.html
@@ -11,99 +11,28 @@
   <script src="https://cdn.jsdelivr.net/npm/chart.js@^3"></script>
   <script src="https://cdn.jsdelivr.net/npm/moment@^2"></script>
   <script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment@^1"></script>
+  <script src="./UIUtils.js"></script>
+  <script src="./IntensiveCareCapacitiesChartView.js"></script>
+  <script src="./intensivstationen.js"></script>
   <script>
-    document.addEventListener("DOMContentLoaded", function (event) {
-      displayChart("data/intensivstationen/intensivstationen-de.csv", document.getElementById('deChart'), 'Deutschland, Erwachsenen-Intensivstationen');
-      displayChart("data/intensivstationen/intensivstationen-Tübingen, Landkreis.csv", document.getElementById('tueChart'), 'Tübingen, Erwachsenen-Intensivstationen');
-      displayChart("data/intensivstationen/intensivstationen-Reutlingen, Landkreis.csv", document.getElementById('rtChart'), 'Reutlingen, Erwachsenen-Intensivstationen');
-    });
-
-    function displayChart(file, canvas, title) {
-      Papa.parse(file, {
-        header: true,
-        dynamicTyping: true,
-        download: true,
-        complete: function (results) {
-          // console.log(results);
-          const myChart =
-            new Chart(
-              canvas,
-              {
-                type: 'bar',
-                data: getData(results.data),
-                options: getOptions(title)
-              });
-        }
-      });
-    }
-
-    function getData(data) {
-      return {
-        datasets: [
-          {
-            label: 'Belegte Betten',
-            data: data,
-            parsing: {
-              yAxisKey: 'betten_belegt'
-            },
-            backgroundColor: 'rgba(255, 0, 0, 1)',
-          },
-          {
-            label: 'Freie Betten',
-            data: data,
-            parsing: {
-              yAxisKey: 'betten_frei'
-            },
-            backgroundColor: 'rgba(0, 255, 0, 1)',
-          }
-        ]
-      };
-    }
-
-    function getOptions(title) {
-      return {
-        plugins: {
-          title: {
-            display: true,
-            text: title
-          },
-        },
-        responsive: true,
-        scales: {
-          x: {
-            stacked: true,
-            type: 'time',
-            time: {
-              unit: 'month'
-            }
-          },
-          y: {
-            stacked: true
-          }
-        },
-        parsing: {
-          xAxisKey: 'date'
-        }
-      };
-    }
+    document.addEventListener(
+      "DOMContentLoaded",
+      event => displayIntensiveCareCapacitiesCharts(document.getElementById('content')));
   </script>
 </head>
 
 <body>
-  <div>
-    <h1>Deutschland</h1>
-    <p>
-      <canvas id="deChart"></canvas>
-    </p>
-    <h1>Tübingen</h1>
-    <p>
-      <canvas id="tueChart"></canvas>
-    </p>
-    <h1>Reutlingen</h1>
-    <p>
-      <canvas id="rtChart"></canvas>
-    </p>
+  <div id="content">
   </div>
+
+  <template id="template-ChartView">
+    <div>
+      <h1 class="heading"></h1>
+      <p>
+        <canvas class="canvas"></canvas>
+      </p>
+    </div>
+  </template>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/docs/intensivstationen.js b/docs/intensivstationen.js
new file mode 100644
index 00000000000..740dfbe010f
--- /dev/null
+++ b/docs/intensivstationen.js
@@ -0,0 +1,133 @@
+const kreisValues =
+    ['Flensburg', 'Bamberg', 'Hof', 'Coburg', 'Bayreuth', 'Schwandorf',
+        'Regensburg', 'Neumarkt i.d.OPf.', 'Cham', 'Amberg-Sulzbach',
+        'Amberg', 'Dingolfing-Landau', 'Straubing-Bogen', 'Rottal-Inn',
+        'Regen', 'Passau', 'Landshut', 'Kelheim', 'Weiden i.d.OPf.',
+        'Forchheim', 'Kronach', 'Kitzingen', 'Haßberge', 'Rhön-Grabfeld',
+        'Bad Kissingen', 'Aschaffenburg', 'Würzburg', 'Schweinfurt',
+        'Weißenburg-Gunzenhausen', 'Roth',
+        'Neustadt a.d.Aisch-Bad Windsheim', 'Nürnberger Land',
+        'Erlangen-Höchstadt', 'Ansbach', 'Nürnberg', 'Fürth', 'Erlangen',
+        'Wunsiedel i.Fichtelgebirge', 'Lichtenfels', 'Kulmbach',
+        'Freyung-Grafenau', 'Miltenberg', 'Deggendorf', 'Bodenseekreis',
+        'Biberach', 'Alb-Donau-Kreis', 'Ulm', 'Zollernalbkreis',
+        'Tübingen', 'Reutlingen', 'Waldshut', 'Lörrach', 'Ravensburg',
+        'Konstanz', 'Schwarzwald-Baar-Kreis', 'Rottweil', 'Ortenaukreis',
+        'Emmendingen', 'Breisgau-Hochschwarzwald', 'Freiburg im Breisgau',
+        'Freudenstadt', 'Enzkreis', 'Calw', 'Tuttlingen', 'Sigmaringen',
+        'Ingolstadt', 'München', 'Weilheim-Schongau', 'Traunstein',
+        'Starnberg', 'Rosenheim', 'Pfaffenhofen a.d.Ilm',
+        'Neuburg-Schrobenhausen', 'Mühldorf a.Inn', 'Miesbach',
+        'Landsberg am Lech', 'Garmisch-Partenkirchen', 'Fürstenfeldbruck',
+        'Freising', 'Erding', 'Eichstätt', 'Dachau',
+        'Bad Tölz-Wolfratshausen', 'Berchtesgadener Land', 'Altötting',
+        'Straubing', 'Augsburg', 'Saalekreis', 'Mansfeld-Südharz',
+        'Jerichower Land', 'Harz', 'Burgenlandkreis', 'Börde',
+        'Anhalt-Bitterfeld', 'Altmarkkreis Salzwedel', 'Magdeburg',
+        'Salzlandkreis', 'Halle (Saale)', 'Nordsachsen', 'Leipzig',
+        'Sächsische Schweiz-Osterzgebirge', 'Meißen', 'Görlitz', 'Bautzen',
+        'Dresden', 'Zwickau', 'Dessau-Roßlau', 'Stendal', 'Wittenberg',
+        'Erfurt', 'Altenburger Land', 'Greiz', 'Saale-Orla-Kreis',
+        'Saale-Holzland-Kreis', 'Saalfeld-Rudolstadt', 'Sonneberg',
+        'Weimarer Land', 'Ilm-Kreis', 'Hildburghausen', 'Sömmerda',
+        'Gotha', 'Schmalkalden-Meiningen', 'Kyffhäuserkreis',
+        'Unstrut-Hainich-Kreis', 'Wartburgkreis', 'Nordhausen',
+        'Eichsfeld', 'Weimar', 'Suhl', 'Jena', 'Gera', 'Vogtlandkreis',
+        'Mittelsachsen', 'Erzgebirgskreis', 'Chemnitz',
+        'Brandenburg an der Havel', 'Berlin', 'St. Wendel',
+        'Saarpfalz-Kreis', 'Saarlouis', 'Neunkirchen', 'Merzig-Wadern',
+        'Saarbrücken, Regionalverband', 'Oberallgäu', 'Donau-Ries',
+        'Unterallgäu', 'Ostallgäu', 'Lindau (Bodensee)', 'Neu-Ulm',
+        'Günzburg', 'Dillingen a.d.Donau', 'Aichach-Friedberg',
+        'Memmingen', 'Kempten (Allgäu)', 'Kaufbeuren', 'Cottbus',
+        'Pforzheim', 'Frankfurt (Oder)', 'Barnim',
+        'Landkreis Ludwigslust-Parchim', 'Vorpommern-Greifswald',
+        'Landkreis Nordwestmecklenburg', 'Vorpommern-Rügen',
+        'Landkreis Rostock', 'Mecklenburgische Seenplatte', 'Schwerink',
+        'Rostock, Hanse- und Universitätsstadt', 'Uckermark',
+        'Teltow-Fläming', 'Spree-Neiße', 'Prignitz', 'Potsdam-Mittelmark',
+        'Ostprignitz-Ruppin', 'Oder-Spree', 'Oberspreewald-Lausitz',
+        'Oberhavel', 'Märkisch-Oderland', 'Havelland', 'Elbe-Elster',
+        'Dahme-Spreewald', 'Potsdam', 'Rhein-Neckar-Kreis',
+        'Main-Spessart', 'Mannheim', 'Remscheid', 'Oberhausen',
+        'Mülheim an der Ruhr', 'Mönchengladbach', 'Krefeld', 'Essen',
+        'Duisburg', 'Düsseldorf', 'Bremerhaven', 'Solingen', 'Bremen',
+        'Wesermarsch', 'Vechta', 'Osnabrück', 'Oldenburg', 'Leer',
+        'Grafschaft Bentheim', 'Friesland', 'Emsland', 'Cloppenburg',
+        'Wittmund', 'Wuppertal', 'Kleve', 'Mettmann', 'Steinfurt',
+        'Recklinghausen', 'Coesfeld', 'Borken', 'Münster', 'Gelsenkirchen',
+        'Bottrop', 'Rhein-Sieg-Kreis', 'Rheinisch-Bergischer Kreis',
+        'Oberbergischer Kreis', 'Heinsberg', 'Euskirchen',
+        'Rhein-Erft-Kreis', 'Düren',
+        'Städteregion Aachen (einschl. Stadt Aachen)', 'Leverkusen',
+        'Köln', 'Bonn', 'Wesel', 'Viersen', 'Rhein-Kreis Neuss', 'Aurich',
+        'Ammerland', 'Wilhelmshaven', 'Helmstedt', 'Goslar', 'Gifhorn',
+        'Wolfsburg', 'Salzgitter', 'Braunschweig', 'Hamburg', 'Stormarn',
+        'Steinburg', 'Segeberg', 'Schleswig-Flensburg',
+        'Rendsburg-Eckernförde', 'Plön', 'Pinneberg', 'Ostholstein',
+        'Nordfriesland', 'Herzogtum Lauenburg', 'Dithmarschen',
+        'Neumünster', 'Lübeck', 'Neckar-Odenwald-Kreis', 'Northeim',
+        'Warendorf', 'Peine', 'Göttingen', 'Oldenburg (Oldenburg)',
+        'Emden', 'Delmenhorst', 'Verden', 'Uelzen', 'Stade', 'Heidekreis',
+        'Rotenburg (Wümme)', 'Osterholz', 'Lüneburg', 'Lüchow-Dannenberg',
+        'Harburg', 'Cuxhaven', 'Celle', 'Schaumburg', 'Nienburg (Weser)',
+        'Holzminden', 'Hildesheim', 'Hameln-Pyrmont', 'Diepholz',
+        'Region Hannover', 'Wolfenbüttel', 'Bielefeld', 'Kiel',
+        'Heidelberg', 'Alzey-Worms', 'Zweibrücken', 'Worms', 'Speyer',
+        'Pirmasens', 'Neustadt an der Weinstraße', 'Mainz',
+        'Ludwigshafen am Rhein', 'Landau in der Pfalz', 'Donnersbergkreis',
+        'Kaiserslautern', 'Trier-Saarburg', 'Vulkaneifel',
+        'Eifelkreis Bitburg-Prüm', 'Bernkastel-Wittlich', 'Trier',
+        'Westerwaldkreis', 'Rhein-Lahn-Kreis', 'Rhein-Hunsrück-Kreis',
+        'Neuwied', 'Frankenthal (Pfalz)', 'Germersheim', 'Kusel',
+        'Gütersloh', 'Rastatt', 'Karlsruhe', 'Baden-Baden', 'Ostalbkreis',
+        'Heidenheim', 'Main-Tauber-Kreis', 'Schwäbisch Hall',
+        'Hohenlohekreis', 'Heilbronn', 'Heilbronn, Universitätsstadt',
+        'Rems-Murr-Kreis', 'Ludwigsburg', 'Göppingen', 'Esslingen',
+        'Böblingen', 'Stuttgart', 'Südwestpfalz', 'Mainz-Bingen',
+        'Südliche Weinstraße', 'Mayen-Koblenz', 'Cochem-Zell',
+        'Bad Dürkheim', 'Bad Kreuznach', 'Bergstraße', 'Wiesbaden',
+        'Offenbach am Main', 'Frankfurt am Main', 'Darmstadt', 'Unna',
+        'Soest', 'Siegen-Wittgenstein', 'Märkischer Kreis',
+        'Hochsauerlandkreis', 'Ennepe-Ruhr-Kreis', 'Herne', 'Hamm',
+        'Hagen', 'Dortmund', 'Bochum', 'Paderborn', 'Minden-Lübbecke',
+        'Lippe', 'Höxter', 'Birkenfeld', 'Darmstadt-Dieburg', 'Groß-Gerau',
+        'Olpe', 'Herford', 'Hochtaunuskreis', 'Ahrweiler', 'Koblenz',
+        'Werra-Meißner-Kreis', 'Waldeck-Frankenberg', 'Schwalm-Eder-Kreis',
+        'Kassel', 'Hersfeld-Rotenburg', 'Fulda', 'Vogelsbergkreis',
+        'Altenkirchen (Westerwald)', 'Limburg-Weilburg',
+        'Marburg-Biedenkopf', 'Main-Taunus-Kreis', 'Odenwaldkreis',
+        'Offenbach', 'Main-Kinzig-Kreis', 'Wetteraukreis', 'Gießen',
+        'Lahn-Dill-Kreis', 'Rheingau-Taunus-Kreis', 'Ebersberg',
+        'Schwabach', 'Tirschenreuth'];
+
+function displayIntensiveCareCapacitiesCharts(content) {
+    for (i = 0; i < 5 /*kreisValues.length*/; i++) {
+        displayIntensiveCareCapacitiesChart(content, kreisValues[i]);
+    }
+}
+
+function displayIntensiveCareCapacitiesChart(content, kreis) {
+    const { chartViewElement, canvas } = UIUtils.createChartViewElementWithHeading(kreis);
+    content.appendChild(chartViewElement);
+    withCsvDo(
+        `data/intensivstationen/intensivstationen-${kreis}.csv`,
+        csv =>
+            new IntensiveCareCapacitiesChartView().displayChart(
+                {
+                    data: csv,
+                    canvas: canvas,
+                    title: kreis
+                }));
+}
+
+function withCsvDo(file, csvConsumer) {
+    Papa.parse(
+        file,
+        {
+            header: true,
+            dynamicTyping: true,
+            download: true,
+            complete: results => csvConsumer(results.data)
+        });
+}