[Kapazitätsanzeige, Gantt-Diagramm, Benutzeroberfläche] Plotly dynamische Visualisierung [Python, Messanzeige, Gantt-Diagramm]

python==3.8 plotly==4.10.0

Einführung von Indikatoren und Gantt-Diagrammen als Tipps zum Erstellen eines Dashboards

Indikator

Basic

Anzeigen des Indikators aus dem Indikator von graph_objects

import plotly.graph_objects as go
fig = go.Figure()

fig.add_trace(go.Indicator(
    mode = "number+delta",
    value = 300,
    number = {'prefix': "$"},
    delta = {'position': "top", 'reference': 320}))
fig.show()

Es kann auch über der Abbildung angezeigt werden

import plotly.graph_objects as go

fig = go.Figure(go.Indicator(
    mode = "number+delta",
    value = 400,
    number = {'prefix': "$"},
    delta = {'position': "top", 'reference': 320},
    domain = {'x': [0, 1], 'y': [0, 1]}))

fig.add_trace(go.Scatter(
    y = [325, 324, 405, 400, 424, 404, 417, 432, 419, 394, 410, 426, 413, 419, 404, 408, 401, 377, 368, 361, 356, 359, 375, 397, 394, 418, 437, 450, 430, 442, 424, 443, 420, 418, 423, 423, 426, 440, 437, 436, 447, 460, 478, 472, 450, 456, 436, 418, 429, 412, 429, 442, 464, 447, 434, 457, 474, 480, 499, 497, 480, 502, 512, 492]))

#fig.update_layout(paper_bgcolor = "lightgray")

fig.show()

Anzeige mit einer Anzeige bis zu voll

Wählen Sie aus, ob im Modus nur Zahlen, Dreiecke oder Anzeigen angezeigt werden sollen Dreieckige Zahlen zeigen den Unterschied zwischen der Referenz und dem in Delta angegebenen Wert Geben Sie an, wie viele Zeilen und Spalten in der Domäne angezeigt werden sollen Geben Sie bei der Angabe eines Messgeräts in x und y an, wo das Messgerät im Anzeigebereich beginnt und wie weit es angezeigt wird. Die Farbanzeige des Messgeräts ergibt sich aus der Farbe von Steos und Balken Wie viele Zeilen und Spalten erstellt werden sollen, wird durch Angabe des Rasters aus der Aktualisierung erstellt Beachten Sie, dass sich die Anzahl der Spalten und Zeilen von der der Domäne unterscheidet Ich habe versucht, auf verschiedene Arten damit zu spielen. Bitte überprüfen Sie es, während Sie sich darauf beziehen.

import plotly.graph_objects as go

fig = go.Figure()

#down

fig.add_trace(go.Indicator(
    mode = "number+delta",
    value = 300,
    number = {'prefix': "$"},
    delta = {'position': "top", 'reference': 320},
    domain = {'row': 0, 'column': 0}))

#up

fig.add_trace(go.Indicator(
    mode = "number+delta",
    value = 300,
    number = {'prefix': "$"},
    delta = {'position': "bottom", 'reference': 20},
    domain = {'row': 0, 'column': 1}))

#bullet

fig.add_trace(go.Indicator(
    mode = "number+gauge+delta",
    value = 300,
    delta = {'position': "bottom", 'reference': 50},
    gauge = {'shape': "bullet",'axis' : {'visible': False}},
    domain = {'x': [0.1,0.5],'y':[0.5,0.6],'row': 1, 'column': 0}))

#gurge
fig.add_trace(go.Indicator(
    mode = "number+gauge+delta",
    value = 300,
    delta = {'position': "bottom", 'reference': 50},
    gauge = {'axis' : {'visible': False}},
    domain = {'row': 1, 'column': 1}))

#color bullet

fig.add_trace(go.Indicator(
    mode = "number+gauge+delta", value = 220,
    domain = {'x': [0.2, 0.5], 'y': [0.1, 0.2],'row': 2, 'column': 1},
    title = {'text' :"color bullet"},
    delta = {'reference': 200},
    gauge = {
        'shape': "bullet",
        'axis': {'range': [None, 300]},
        'threshold': {
            'line': {'color': "red", 'width': 2},
            'thickness': 0.75,
            'value': 280},
        'steps': [
            {'range': [0, 150], 'color': "lightgray"},
            {'range': [150, 250], 'color': "gray"}]}))

#blue gauge

fig.add_trace(
    go.Indicator(
    mode = "gauge+number+delta",
    value = 420,
    domain = {'x': [0.6, 1], 'y': [0, 0.2],'row': 2, 'column': 1},
    title = {'text': "blue gauge", 'font': {'size': 15}},
    delta = {'reference': 400, 'increasing': {'color': "RebeccaPurple"}},
    gauge = {
        'axis': {'range': [None, 500],
        'tickwidth': 1,
        'tickcolor': "darkblue"},
        'bar': {'color': "darkblue"},
        'bgcolor': "white",
        'borderwidth': 2,
        'bordercolor': "gray",
        'steps': [
            {'range': [0, 250], 'color': 'cyan'},
            {'range': [250, 400], 'color': 'royalblue'}],
        'threshold': {
            'line': {'color': "red", 'width': 4},
            'thickness': 0.75,
            'value': 490}})
)

fig.update_layout(
    grid = {'rows': 3, 'columns': 2, 'pattern': "independent"})

fig.update_layout(height = 1000 ,width = 900, margin = {'t':0, 'b':0, 'l':0})
fig.show()

Gantt-Diagramm

Datenaufbereitung

Setzen Sie die Spaltennamen auf Task, Start, Finish, Complete

Überprüfen Sie die Fortschrittsrate

from plotly.figure_factory import create_gantt
import pandas as pd

df = pd.DataFrame([['Run', '2010-01-01', '2011-02-02', 10],
                   ['Fast', '2011-01-01', '2012-06-05', 55],
                   ['Eat', '2012-01-05', '2013-07-05', 94]],
                  columns=['Task', 'Start', 'Finish', 'Complete'])

fig = create_gantt(df, colors='Blues', index_col='Complete',
                   show_colorbar=True, bar_width=0.5,
                   showgrid_x=True, showgrid_y=True)

fig.show()

Die Periodenanzeige ist Woche und Jahr. Kann mit einer Schaltfläche auf den Monat geändert werden

Wenn die Fortschrittsrate "Vollständig" als Zahl angegeben wird, wird sie als Abstufung angezeigt.

Bestätigung des Abschlussstatus

from plotly.figure_factory import create_gantt
import pandas as pd

df = pd.DataFrame([['Run', '2010-01-01', '2011-02-02', 'Complete'],
                   ['Fast', '2011-01-01', '2012-06-05', 'Not Complete'],
                   ['Eat', '2012-01-05', '2013-07-05', 'Stopped']],
                  columns=['Task', 'Start', 'Finish', 'Resource'])

fig = create_gantt(df, index_col='Resource', show_colorbar=True,
                      group_tasks=True)

fig.show()

Wird in verschiedenen Farben angezeigt, wenn der Status "Ressource" als Zeichen angegeben wird.

das ist alles

Das Armaturenbrett geht nach oben