CSV in schicke HTML-Tabelle

CoderGirl · Samstag 11. Juli 2020, 10:46

Hallo,

ich habe ein paar CSV, die ich gerne in eine schicke HTML-Tabelle zusammenführen mag.
Es gibt ja diverse Ansätze, dass zu machen, daher mal die Frage an Euch:
Macht jemand da schon was und wer kann mir da ein guten Ansatz empfehlen?

Euer Codergirl

nezzcarth · Samstag 11. Juli 2020, 10:51

Soll einfach nur statisches HTML erzeugt werden? Dann kannst im Prinzip ein einfaches Skript schreiben und für das HTML eine Template-Engine nehmen. Jinja2 ist da sehr beliebt. Persönlich mag ich auch Mako und habe das auch für so etwas schon verwendet. Der Unterschied ist, dass man in Mako mehr oder weniger "normales" Python einbetten kann, was teilweise kritisch gesehen wird (Vermischung von Darstellung und Logik), aber bei solchen Projekt auch sehr praktisch sein kann.

Die Vorgehensweise ist in beiden Fällen gleich: Du bastelst dir ein entsprechendes Template, bei dem im Prinzip nur die Spaltenüberschriften und die Zeilen variabel sein müssen. In deinem Skript liest du die CSV Dateien ein, bereitest sie nach deinen Vorstellungen auf, packst sie in eine geeignete Datenstruktur und renderst dann mit diesen Daten als Kontext das Template als HTML. Wie schick das dann wird, hängt vom CSS/JS ab, das du dazu gibst

Da kann man bei Bedarf auf eines der gängigen Frontendframeworks (Bootstrap, Bulma, Foundation, ...) und/oder so etwas wie Datatables zurückgreifen.

CoderGirl · Samstag 11. Juli 2020, 11:41

Hallo

es soll nur statisches HTML sein. Ich habe diverse Datenquellen, die ich in einem CSV zusammengeführt habe und die Daten will ich dann per HTML
zusammenfassen, um sie mit beliebigen Browsern bei uns im Netzwerk (Mom, Dad) anzuzeigen

noisefloor · Samstag 11. Juli 2020, 11:46

Hallo,

mit einer Template Engine wie Jinja2 erzeugst du eine normale HTML Seite. Innerhalb des Templates kannst du dann über die Zeilen der CSV Datei iterieren und so deine Tabellenzeilen bauen. Das ist also genau das, was du suchst.
Einfacher geht es nicht, dafür sind Template Engines da.

Gruß, noisefloor

CoderGirl · Samstag 11. Juli 2020, 12:20

Hallo

danke Euch. Ich lese mich da mal dann ein

Euer Codergirl

nezzcarth · Samstag 11. Juli 2020, 12:27

Hier mal ein simples Beispiel, wie das gemeint ist (HTML und Code Struktur muss man natürlich noch verbessern; das Template gehört später natürlich auch in eine eigene Datei):

Code: Alles auswählen

#!/usr/bin/env python3
import csv
from jinja2 import Template

TEMPLATE = '''
<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8">
        <title>Corona</title>
    </head>
    <body>
    <table>
        <thead>
            <tr>
            {% for item in headers %}
                <th>{{ item  }}</th>
            {% endfor %}
            </tr>
        </thead>
        <tbody>
            {% for row in rows %}
            <tr>
                {% for label, cell  in row.items() %}
                <td>{{ cell }}</td>
                {% endfor %}
            <tr>
            {% endfor %}
        </tbody>
    </table>
    </body>
</html>
'''

def iter_csv(file):
    with open(file, 'r', encoding='utf8') as fh:
        reader = csv.DictReader(fh)
        for row in reader:
            yield row 


def to_html(rows, template):
    headers = list(rows[0].keys())
    return template.render(headers=headers, rows=rows)


def main():
    file = 'corona.csv'
    rows = list(iter_csv(file))
    template = Template(TEMPLATE)
    html = to_html(rows, template) 
    print(html)


if __name__ == '__main__':
    main()

(Daten von hier: https://data.europa.eu/euodp/de/data/da ... virus-data)

Und für ein ansprechenderes Layout kannst du dir ja eines der vielen fertigen Tabellen Templates aussuchen, die im Netz zu finden sind

CoderGirl · Samstag 11. Juli 2020, 13:04

Hallo

wow mega danke Dir. Ich mag ja Beispiele, da ich mit all dem abstrakten nix anfangen

Das teste ich mal durch

)

Codergirl

CoderGirl · Samstag 11. Juli 2020, 14:00

Hi zusammen,

das klappt super. Ich habe auch oben das etwas angepasst, dass das html in eine Datei geschrieben wird

Jetzt geh ich auf die Suche nach einem schicken Template

Müsste ja der Bereich nach TEMPLATE = ' ' ' sein

CoderGirl · Samstag 11. Juli 2020, 18:35

[quote=nezzcarth post_id=369932

Und für ein ansprechenderes Layout kannst du dir ja eines der vielen fertigen Tabellen Templates aussuchen, die im Netz zu finden sind
[/quote]

Irgendwie tue ich mich schwer, da was zu finden. Hast du evt die ein oder andere Quelle zur Hand?

Nur wenn es nicht zu nervig ist

Danke

Codergirl

nezzcarth · Samstag 11. Juli 2020, 19:36

Schau mal, ob hier etwas bei ist:

https://colorlib.com/wp/css3-table-templates/
https://freshdesignweb.com/free-css-tables/

Stichworte wären hier z.B. table css templates. So findet man mehrere derartiger Sammlungen.

Ein anderer Ansatz ist, ein Tabellen-Element gängiger Frontframeworks zu nehmen. Viele haben so etwas an Bord (allerdings hat man damit ggf. etwas overhead):
https://bulma.io/documentation/elements/table/
https://getbootstrap.com/docs/4.0/content/tables/
https://milligram.io/tables.html
http://getskeleton.com/#tables

etc.

CoderGirl · Samstag 11. Juli 2020, 20:08

Guten Abend

Danke dir. Morgen schau ich rein. Heute Abend muss ich mich um meinen Freund kümmern. Der hat was gegen coding SA abends