Was können Sie diesen Artikel lesen

Mit der PySimple-Benutzeroberfläche können Sie:

Sie können Balkendiagramme, Liniendiagramme usw. zeichnen.
Grafik, die die Anzeige regelmäßig aktualisiert

Informationen zur grundlegenden Funktionsweise von PySimpleGUI finden Sie unter Wenn Sie Tkinter verwenden, versuchen Sie es mit PySimpleGUI.

Überblick

Ich denke, es gibt viele Leute, die Daten analysieren, um Python zu verwenden. Einige Benutzer möchten die Analyseergebnisse möglicherweise auch mit einem Liniendiagramm oder einem Balkendiagramm visualisieren.

Es gibt ungefähr zwei Möglichkeiten, Diagramme mit PySimpleGUI zu verwenden.

-Zeichnen Sie mit graph-element

Matplotlib einbetten und zeichnen

Dieses Mal werde ich erklären, wie man es mit graph-element erstellt.

Über Graph-Element

graph-element ist eine Klasse, die zum Zeichnen verwendet wird. In tkinter wird mit Canvas gezeichnet, aber das Grafikelement von PySimpleGUI wird durch die Erstellung des Koordinatensystems von Leinwänden einfacher zu verwenden.

Als Grundverwendung Verwenden Sie die Klasse "Graph", um die Größe des Zeichenbereichs, die untere linke Koordinate (Ursprung) des Zeichenbereichs und die obere rechte Koordinate anzugeben.

graph = sg.Graph((500,500), (0,0), (500, 500))

Danach verwenden wir jede Zeichenmethode für dieses Diagramm.

--DrawCircle: Zeichne einen Kreis --DrawLine: Zeichne eine Linie --DrawPoint: Platziere Punkte --DrawRectangle: Zeichne ein Viereck --DrawOval: Zeichne einen Bogen --DrawImage: Bild anzeigen --DrawText: Zeichne Zeichen

Davon werden die folgenden beim Zeichnen von Balkendiagrammen und Kreisdiagrammen verwendet.

--DrawLine: Dient zum Zeichnen von Linien, Hilfslinien und Skalen im Faltliniendiagramm. --DrawPoint: Wird verwendet, um gezeichnete Punkte in einem Faltliniendiagramm zu zeichnen oder um einen Bogen wie eine Sinuswelle zu zeichnen --DrawText: Dient zum Anzeigen von Diagrammbeschriftungen und Werten pro Diagramm

Verwenden Sie auch die folgende Methode.

--Erase: Löscht den Zeichenbereich. Es wird verwendet, um das gezeichnete Diagramm beim Wechseln des Diagramms nicht zu löschen.

Verschieben: Verschiebt das, was in x- und y-Richtung gezeichnet wird. Wird verwendet, um das Diagramm in Echtzeit zu verschieben

Code

Ich werde eine Zusammenfassung des offiziellen Beispielcodes veröffentlichen. Wechseln Sie den Inhalt des Diagramms mit der Schaltfläche

Ausführungsbildschirm

Code

import PySimpleGUI as sg
from random import randint
import math
"""
Die folgenden offiziellen Beispiele sind in einem integriert
https://pysimplegui.trinket.io/demo-programs#/graph-element/graph-element-bar-chart
https://pysimplegui.trinket.io/demo-programs#/graph-element/graph-element-sine-wave
https://pysimplegui.trinket.io/demo-programs#/graph-element/graph-element-line-graph-with-labels
https://pysimplegui.trinket.io/demo-programs#/graph-element/animated-line-graph
"""

#Konstante
GRAPH_SIZE = (500, 500)
DATA_SIZE = (500, 500)

# 
PLOTS_NUMBER = 30
RAND_MAX = 400

#Für unterbrochene Linien
LINE_BAR_WIDTH = 10
LINE_BAR_SPACING = 16
LINE_EDGE_OFFSET = 3

#Balkendiagramm
BAR_WIDTH = 50
BAR_SPACING = 75
EDGE_OFFSET = 3

#Grafik zeichnen
SIZE_X = GRAPH_SIZE[0]//2
SIZE_Y = GRAPH_SIZE[1]//2
NUMBER_MARKER_FREQUENCY = 25

#Animation
GRAPH_STEP_SIZE = 5
DELAY = 15  #Zeitintervall

#Layout
#Festlegen des Zeichenbereichs des Diagramms
graph = sg.Graph(GRAPH_SIZE, (0, 0), DATA_SIZE,
                 key='-GRAPH-', background_color='white',)

layout = [[sg.Text('chart demo')],
          [graph],
          [sg.Button('LINE'), sg.Button('chart'), sg.Button('Beide'), sg.Button('Kuchendiagramm'), sg.Button('Sinus'),sg.Button('Animation') ]]

window = sg.Window('Einfaches Diagrammbeispiel', layout)

before_value = 0  #Initialisierung des Liniendiagramms
delay = x = lastx = lasty = 0  #Animationsinitialisierung

is_animated = False


def draw_axis():
    """Zeichnen Sie Hilfslinien auf der X- und Y-Achse

Ursprung unten links im Diagrammelement(0,0)Ist eingestellt als
Bewegen mit der Mitte des Diagrammbereichs als Ursprung
    """

    graph.draw_line((0, SIZE_Y), (SIZE_X*2, SIZE_Y))  #Ursprung
    graph.draw_line((SIZE_X, 0), (SIZE_X, SIZE_Y*2))

    for x in range(0, SIZE_X*2, NUMBER_MARKER_FREQUENCY):
        graph.draw_line((x, SIZE_Y-3), (x, SIZE_Y+3))  #Zeichnen Sie eine Skala
        if x != 0:
            graph.draw_text(str(x-SIZE_X), (x, SIZE_Y-10),
                            color='green')  #Zeichnen Sie den Wert der Skala

    for y in range(0, SIZE_Y*2+1, NUMBER_MARKER_FREQUENCY):
        graph.draw_line((SIZE_X-3, y), (SIZE_X+3, y))
        if y != 0:
            graph.draw_text(str(y-SIZE_Y), (SIZE_X-10, y), color='blue')


while True:

    if is_animated:
        #Regelmäßig'__TIMEOUT__'Ereignis wird ausgegeben
        event, values = window.Read(timeout=DELAY)
    else:
        event, values = window.Read()

    if event is None:
        break

    if event == 'LINE':
        is_animated = False
        #Beschriftetes Faltliniendiagramm anzeigen
        graph.Erase()  #Diagrammanzeige Löschen Sie beide Maschinen

        for i in range(PLOTS_NUMBER):
            graph_value = randint(0, 400)
            if i > 0:
                graph.DrawLine(((i-1) * LINE_BAR_SPACING + LINE_EDGE_OFFSET + LINE_BAR_WIDTH/2,  before_value),
                               (i * LINE_BAR_SPACING + LINE_EDGE_OFFSET + LINE_BAR_WIDTH/2, graph_value), color='green', width=1)

            #Zeigen Sie die gestrichelte Beschriftung an (y-Wert)
            graph.DrawText(text=graph_value, location=(
                i * LINE_BAR_SPACING+EDGE_OFFSET+2, graph_value+10))

            graph.DrawPoint((i * LINE_BAR_SPACING + LINE_EDGE_OFFSET +
                             LINE_BAR_WIDTH/2, graph_value), size=3, color='green',)

            before_value = graph_value

    if event == 'chart':
        is_animated = False

        #Balkendiagramm löschen
        graph.Erase()
        for i in range(PLOTS_NUMBER):
            graph_value = randint(0, 400)
            graph.DrawRectangle(top_left=(i * BAR_SPACING + EDGE_OFFSET, graph_value),
                                bottom_right=(i * BAR_SPACING + EDGE_OFFSET + BAR_WIDTH, 0), fill_color='blue')
            graph.DrawText(text=graph_value, location=(
                i*BAR_SPACING+EDGE_OFFSET+25, graph_value+10))

    if event == 'Beide':
        is_animated = False

        #Zeigen Sie sowohl das Liniendiagramm als auch das Balkendiagramm an
        graph.Erase()
        for i in range(PLOTS_NUMBER):
            graph_value = randint(0, 400)
            graph.DrawRectangle(top_left=(i * BAR_SPACING + EDGE_OFFSET, graph_value),
                                bottom_right=(i * BAR_SPACING + EDGE_OFFSET + BAR_WIDTH, 0), fill_color='blue')
            graph.DrawText(text=graph_value, location=(
                i*BAR_SPACING+EDGE_OFFSET+25, graph_value+10))

            if i > 0:
                graph.DrawLine(((i-1) * LINE_BAR_SPACING + LINE_EDGE_OFFSET + LINE_BAR_WIDTH/2,  before_value),
                               (i * LINE_BAR_SPACING + LINE_EDGE_OFFSET + LINE_BAR_WIDTH/2, graph_value), color='green', width=1)

            graph.DrawText(text=graph_value, location=(
                i * LINE_BAR_SPACING+EDGE_OFFSET+2, graph_value+10))

            graph.DrawPoint((i * LINE_BAR_SPACING + LINE_EDGE_OFFSET +
                             LINE_BAR_WIDTH/2, graph_value), size=3, color='green',)
            before_value = graph_value

    if event == 'Kuchendiagramm':
        is_animated = False
        graph.erase()
        
        # create_arc()Kann nicht gefüllt werden, da keine Füllung vorhanden ist
        graph.DrawArc( (50,50), (DATA_SIZE[0]-50, DATA_SIZE[1]-50), extent=-200, start_angle=90)
        graph.DrawArc( (50,50), (DATA_SIZE[0]-50, DATA_SIZE[1]-50), extent=-400, start_angle=-110 ,arc_color="yellow")
        graph.DrawArc( (50,50), (DATA_SIZE[0]-50, DATA_SIZE[1]-50), extent=-50,  start_angle=-510 , arc_color="blue")
        graph.DrawArc( (50,50), (DATA_SIZE[0]-50, DATA_SIZE[1]-50), extent=-50,  start_angle=-560 , arc_color="red")
        graph.DrawArc( (50,50), (DATA_SIZE[0]-50, DATA_SIZE[1]-50), extent=-20,  start_angle=-610 , arc_color="green")

    if event == 'Sinus':
        is_animated = False
        graph.erase()

        draw_axis()
        prev_x = prev_y = None
        for x in range(0, SIZE_X*2):
            y = math.sin(x/75)*100 + SIZE_Y
            if prev_x is not None:
                graph.draw_line((prev_x, prev_y), (x, y), color='red')
            prev_x, prev_y = x, y

    if event == 'Animation' or is_animated:

        if not is_animated:
            graph.Erase()  #Diagramm einmal löschen

        is_animated = True

        #Zeigen Sie ein Diagramm an, das sich in chronologischer Reihenfolge bewegt
        step_size, delay = GRAPH_STEP_SIZE, DELAY
        y = randint(0, GRAPH_SIZE[1])
        if x < GRAPH_SIZE[0]:  #Erstes Mal
            # window['-GRAPH-'].DrawLine((lastx, lasty), (x, y), width=1)
            graph.DrawLine((lastx, lasty), (x, y), width=1)
        else:
            # window['-GRAPH-'].Move(-step_size, 0)  #Verschieben Sie das gesamte Diagramm nach links
            # window['-GRAPH-'].DrawLine((lastx, lasty), (x, y), width=1)
            graph.Move(-step_size, 0)  #Verschieben Sie das gesamte Diagramm nach links
            graph.DrawLine((lastx, lasty), (x, y), width=1)
            x -= step_size
            lastx, lasty = x, y
        lastx, lasty = x, y
        x += step_size

window.Close()

Der Unterschied zum offiziellen Diagramm besteht darin, dass der Ursprung der Sinuswelle dieses Mal (0,0) von der gesamten Leinwand ausgeht, sodass die Koordinaten von (250.250) zum Ursprung verschoben werden. In der offiziellen Stichprobe ist die Koordinate ganz links (250, -250). Es gibt auch kein offizielles Beispiel für das Kreisdiagramm, und ich habe versucht, es unabhängig mit der "DrawArc" -Methode zu implementieren, aber es gibt keinen "Füll" -Parameter, der das Innere des Kreises ausfüllt, und die Winkelangabe ist eindeutig und zeitaufwändig. Ich denke, es ist besser, keine Kreisdiagramme mehr zu erstellen

Mit dem Diagrammelement von PySimpleGUI können einfache Diagramme wie Balkendiagramme und Liniendiagramme erstellt werden, z. B. solche, die mit der Diagrammfunktion von Excel erstellt wurden.

Über das offizielle grafische Beispiel

PySimpleGUI enthält viele Beispieldateien, und es gibt viele nützliche Beispiele, die als Referenz für die Implementierung verwendet werden können.

Offizielle Demo
- https://github.com/PySimpleGUI/PySimpleGUI/tree/master/DemoPrograms
Offizielle Demo 2
- https://pysimplegui.trinket.io/demo-programs#/demo-programs/the-basic-pysimplegui-program

Hier sind einige Beispiele, die ich persönlich nützlich und interessant finde.

Kooperation mit matplotlib

https://github.com/PySimpleGUI/PySimpleGUI/blob/master/DemoPrograms/Demo_Matplotlib.py
Zusammenarbeit mit Matplotlib. Es gibt mehrere andere Demos, die matplotlib verwenden

Animation zum Sortieren

https://pysimplegui.trinket.io/demo-programs#/graph-element/visualizing-sorts --Animiertes Diagramm, das die Werte des Balkendiagramms nach Blasensortierung sortiert.

Echtzeitdiagramm zur CPU-Auslastung

https://github.com/PySimpleGUI/PySimpleGUI-Rainmeter-CPU-Cores/blob/master/PySimpleGUI_Rainmeter_CPU_Cores.py
Dies ist ein Diagramm, das den CPU-Wert anzeigt. Der Hintergrund ist durchscheinend oder die Registerkarten sind ausgeblendet

Zusammenfassung

Sie haben festgestellt, dass Sie mithilfe der PySimple-Benutzeroberfläche problemlos Diagramme erstellen können. Im offiziellen Beispiel von PySimpleGUI gibt es einige andere Beispiele, die Grafiken verwenden. Schauen Sie also bitte vorbei, wenn Sie interessiert sind.

[PYTHON] Zeichnen Sie ein Diagramm mit der PySimple-Benutzeroberfläche

Was können Sie diesen Artikel lesen

Überblick

Über Graph-Element

Code

Über das offizielle grafische Beispiel

Kooperation mit matplotlib

Animation zum Sortieren

Echtzeitdiagramm zur CPU-Auslastung

Zusammenfassung