ml4cps.vis module¶
The module provides methods to visualize various kinds of data, such as time series or automata graphs.
Authors: - Nemanja Hranisavljevic, hranisan@hsu-hh.de, nemanja@ai4cps.com - Tom Westermann, tom.westermann@hsu-hh.de, tom@ai4cps.com
- ml4cps.vis.plot2d(df, x=None, y=None, mode='markers', hovercolumns=None, figure=False, **args)¶
Creates a 2D scatter or line plot using Plotly based on the provided DataFrame columns. :param df: The input DataFrame containing the data to plot. :type df: pd.DataFrame :param x: The column name to use for the x-axis. :type x: str, optional :param y: The column name to use for the y-axis. :type y: str, optional :param mode: The Plotly scatter mode (e.g., ‘markers’, ‘lines’). Defaults to ‘markers’. :type mode: str, optional :param hovercolumns: List of column names to include in the hover tooltip. :type hovercolumns: list of str, optional :param figure: If True, returns a Plotly Figure object; otherwise, returns a Scatter trace. Defaults to False. :type figure: bool, optional :param **args: Additional keyword arguments passed to the Plotly Scatter constructor.
- Returns:
The generated Plotly Scatter trace or Figure, depending on the ‘figure’ parameter.
- Return type:
plotly.graph_objs._scatter.Scatter or plotly.graph_objs._figure.Figure
Example
plot2d(df, x=’feature1’, y=’feature2’, hovercolumns=[‘label’], mode=’markers’, figure=True)
- ml4cps.vis.plot3d(df, x=None, y=None, z=None, mode='markers', hovercolumns=None, **args)¶
Creates a 3D scatter plot using Plotly’s Scatter3d, with customizable axes, hover information, and additional plot arguments. :param df: The data source containing columns for x, y, z, and optional hover data. :type df: pandas.DataFrame :param x: The column name in df to use for the x-axis. :type x: str, optional :param y: The column name in df to use for the y-axis. :type y: str, optional :param z: The column name in df to use for the z-axis. :type z: str, optional :param mode: Plotly scatter mode (e.g., ‘markers’, ‘lines’). Defaults to ‘markers’. :type mode: str, optional :param hovercolumns: List of column names in df to include in the hover tooltip. :type hovercolumns: list of str, optional :param **args: Additional keyword arguments passed to go.Scatter3d.
- Returns:
A Plotly 3D scatter plot object configured with the specified data and options.
- Return type:
plotly.graph_objs._scatter3d.Scatter3d
- ml4cps.vis.plot_2d_contour_from_fun(fun, rangex=None, rangey=None, th=50, **kwargs)¶
Plots a 2D contour of a function over a specified range. :param fun: A function that takes a 2D array of shape (n_points, 2) and returns a 1D array of function values. :type fun: callable :param rangex: The range for the x-axis as (min, max). Defaults to (-5, 5) if not provided. :type rangex: tuple, optional :param rangey: The range for the y-axis as (min, max). Defaults to (-5, 5) if not provided. :type rangey: tuple, optional :param th: Unused parameter, kept for compatibility. Defaults to 50. :type th: int, optional :param **kwargs: Additional keyword arguments passed to the plotly.graph_objs.Contour constructor.
- Returns:
A Plotly contour plot object representing the function values over the specified range.
- Return type:
plotly.graph_objs.Contour
- ml4cps.vis.plot_cps(cps: CPS, dash_id=None, node_labels=False, edge_labels=True, node_size=40, node_font_size=20, edge_font_size=16, edge_text_max_width=None, output='cyto', dash_port=8050, height='100%', minZoom=0.5, maxZoom=2, **kwargs)¶
Plots all the components of a CPS in the same figure. :param cps: CPS to plot. :param node_labels: Should node labels be plotted. :param edge_labels: Should edge labels be plotted. :param node_size: What is the size of the nodes in the figure. :param node_font_size: The font size of the node labels. :param edge_font_size: The font size of the edge labels. :param edge_text_max_width: Max width of the edge labels. :param output: Should output be plotted as a dash.Cytoscape component (“cyto”), or should dash server be run (“dash”). :param dash_port: If temporary dash server is run, what port to use. :param kwargs: Other paramters are forwarded to the Cytoscape component. :return:
- ml4cps.vis.plot_cps_component(cps, id=None, node_labels=False, center_node_labels=False, event_label=True, show_transition_freq=False, show_transition_timing=False, font_size=6, edge_font_size=6, edge_text_max_width=None, init_label=False, limit_interval_precision=None, show_transition_data=False, node_size=20, output='cyto', dash_port=8050, min_zoom=0.5, max_zoom=1, min_edge_thickness=0.1, max_edge_thickness=4, freq_as_edge_thickness=False, color='black', title_text=None, layout_name='cose')¶
Visualizes a component of a Cyber-Physical System (CPS) as a graph using Dash Cytoscape. This function generates a graphical representation of the discrete states and transitions of a CPS, with various customization options for node and edge appearance, labels, and output format. The visualization can be rendered as Dash Cytoscape elements, in a Dash app, or as a notebook widget. :param cps: object
The CPS object containing discrete states, transitions, and related data.
- Parameters:
id – str, optional The unique identifier for the Cytoscape component (default: “graph”).
node_labels – bool, optional Whether to display labels on nodes (default: False).
center_node_labels – bool, optional Whether to center node labels (default: False).
edge_labels – bool, optional Whether to display labels on edges (default: True).
show_transition_freq – bool, optional Whether to show transition frequency on edge labels (default: False).
edge_font_size – int, optional Font size for edge labels (default: 6).
edge_text_max_width – int or None, optional Maximum width for edge label text wrapping (default: None).
init_label – bool, optional Whether to label initial state transitions as ‘init’ (default: False).
show_transition_data – bool or list, optional Whether to display additional transition data on edge labels. If a list, only specified keys are shown (default: False).
node_size – int, optional Size of the nodes (default: 20).
output – str, optional Output format: “cyto” (Dash Cytoscape Div), “elements” (raw elements), “notebook” (inline Dash app), or “dash” (Dash app in browser) (default: “cyto”).
dash_port – int, optional Port for running the Dash app (default: 8050).
min_zoom – float, optional Minimum zoom level for the Cytoscape component (default: 0.5).
max_zoom – float, optional Maximum zoom level for the Cytoscape component (default: 1).
min_edge_thickness – float, optional Minimum edge thickness for frequency-based scaling (default: 0.1).
max_edge_thickness – float, optional Maximum edge thickness for frequency-based scaling (default: 4).
freq_as_edge_thickness – bool, optional Whether to scale edge thickness based on transition frequency (default: False).
color – str, optional Color for nodes and edges (default: “black”). If “hsu”, uses a preset color.
title_text – str or Dash component, optional Title text or component to display above the graph (default: None).
- Returns:
If output == “cyto”: returns a Dash html.Div containing the Cytoscape graph.
If output == “elements”: returns a dict with ‘nodes’ and ‘edges’.
If output == “notebook”: runs and displays a Dash app inline (for Jupyter).
If output == “dash”: runs a Dash app in the browser and returns the app instance.
- Return type:
Dash component, dict, or Dash app
Notes
Requires Dash, dash_cytoscape, dash_bootstrap_components, and pandas.
The function supports interactive modals for displaying timing data on states and transitions.
Threading is used to launch the Dash app in browser mode without blocking the main program.
- ml4cps.vis.plot_cps_plotly(cps, layout='dot', marker_size=20, node_positions=None, show_events=True, show_num_occur=False, show_state_label=True, font_size=10, plot_self_transitions=True, use_previos_node_positions=False, **kwargs)¶
Visualizes a Cyber-Physical System (CPS) state-transition graph using Plotly. This function generates an interactive Plotly figure representing the states and transitions of a CPS. Nodes represent system states, and edges represent transitions. Various layout algorithms and display options are supported. :param cps: The CPS object containing the state-transition graph. Must have attributes _G (networkx graph),
get_transitions(), print_state(), num_occur(), and previous_node_positions.
- Parameters:
layout (str, optional) – Layout algorithm for node positioning. Options are “dot” (default), “spectral”, “kamada_kawai”, or “fruchterman_reingold”.
marker_size (int, optional) – Size of the node markers. Default is 20.
node_positions (dict, optional) – Precomputed node positions as a dictionary {node: (x, y)}. If None, positions are computed using the selected layout.
show_events (bool, optional) – Whether to display event labels on transitions. Default is True.
show_num_occur (bool, optional) – Whether to display the number of occurrences for each transition. Default is False.
show_state_label (bool, optional) – Whether to display state labels on nodes. Default is True.
font_size (int, optional) – Font size for transition/event labels. Default is 10.
plot_self_transitions (bool, optional) – Whether to plot self-loop transitions. Default is True.
use_previos_node_positions (bool, optional) – If True and node_positions is None, reuse positions from cps.previous_node_positions. Default is False.
**kwargs – Additional keyword arguments passed to the layout function (e.g., for networkx layouts).
- Returns:
A Plotly figure object representing the CPS state-transition graph.
- Return type:
plotly.graph_objs.Figure
Notes
Requires Plotly, NetworkX, and pydotplus (for “dot” layout).
The CPS object must provide the required methods and attributes as described above.
Edge and node styling can be further customized by modifying the function.
- ml4cps.vis.plot_dash_frames(graph_frames, dash_port=8050)¶
Launches an interactive Dash web application to visualize a sequence of graph frames with a slider for manual frame selection. :param graph_frames: A list of Dash components (e.g., Cytoscape graphs) representing different frames to display. :type graph_frames: list :param dash_port: The port number on which to run the Dash server. Defaults to 8050. :type dash_port: int, optional
- Returns:
The Dash application instance.
- Return type:
dash.Dash
- Side Effects:
Starts a Dash server in a separate thread.
Opens the default web browser to display the Dash app.
Waits for user input before returning.
Notes
The app displays the first frame by default and allows users to select other frames using a slider.
The function blocks until the user presses Enter in the console.
- ml4cps.vis.plot_execution_tree(graph, nodes_to_color, color, font_size=30)¶
Plots a system execution tree as a graph, where the horizontal position of nodes corresponds to their timestamps and the tree branches vertically. :param graph: A directed graph where each node represents a system state, and edges represent transitions.
Each node should have a ‘label’ (str) and ‘weight’ (int) attribute. Node names must be timestamp strings in the format “%d/%m/%Y, %H:%M:%S”.
- Parameters:
nodes_to_color (list) – List of node identifiers (timestamp strings) to be highlighted with a specific color.
color (str) – The color to use for highlighting nodes in nodes_to_color.
font_size (int, optional) – Font size for node labels in the visualization. Defaults to 30.
- Returns:
A Dash Cytoscape object representing the execution tree visualization, with nodes positioned by timestamp and colored as specified.
- Return type:
cyto.Cytoscape
Notes
The function assumes the first node in graph.nodes is the starting node.
Node positions are determined by the time difference from the start node (x-axis) and their ‘weight’ attribute (y-axis).
Nodes in nodes_to_color are colored with the specified color; all others are gray.
Requires the cyto (Dash Cytoscape) library and datetime module.
- ml4cps.vis.plot_state_transitions(ta, state, obs=None)¶
Visualizes the outgoing state transitions from a given state in a timed automaton, along with associated observation data. :param ta: An object representing the timed automaton, expected to have an out_transitions(state) method that returns transitions from the given state. :param state: The current state for which outgoing transitions and associated observations are to be visualized. :param obs: A pandas DataFrame containing observation data. Must include at least the columns ‘Mode’, ‘q_next’, ‘Duration’, ‘Time’, and optionally ‘Vergussgruppe’, ‘HID’, ‘ChipID’, ‘Order’, and ‘ArtNr’. If None, the function raises NotImplemented. :type obs: optional
- Returns:
- A Plotly figure object containing subplots for each outgoing transition. For each transition, the function displays:
A scatter plot of observation durations over time, grouped by ‘Vergussgruppe’.
A histogram of durations for each ‘Vergussgruppe’.
The subplots are arranged with shared axes and appropriate titles for each transition.
- Return type:
fig
- Raises:
NotImplemented – If obs is None.
Notes
The function expects certain columns to exist in the obs DataFrame. If missing, default values are assigned.
Colors for different ‘Vergussgruppe’ groups are assigned from DEFAULT_PLOTLY_COLORS.
The function uses Plotly’s make_subplots, go.Scatter, and go.Histogram for visualization.
- ml4cps.vis.plot_stateflow(stateflow, color_mapping=None, state_col='State', bar_height=12, start_column='Start', finish_column='Finish', return_figure=False, description_col='Description', idle_states=None)¶
Visualizes state transitions over time for one or more tasks/stations as a Gantt-like interactive timeline.
Parameters: - stateflow (DataFrame or dict): DataFrame with state transitions, or a dictionary of DataFrames per station. - color_mapping (dict, optional): Mapping of state names to colors. If None, default colors are used. - state_col (str): Column name indicating the state (default: ‘State’). - bar_height (int): Height of the timeline bars (default: 12). - start_column (str): Column name with start timestamps (default: ‘Start’). - finish_column (str): Column name with end timestamps (default: ‘Finish’). - return_figure (bool): If True, returns a Plotly Figure. Otherwise, returns a list of Plotly traces. - description_col (str or list): Column(s) to include in the hover tooltip (default: ‘Description’). - idle_states (str or list): State(s) to exclude from the plot (e.g., ‘IDLE’).
Returns: - Plotly Figure or list of traces, depending on return_figure.
Example
fig = plot_stateflow(df, state_col=’Mode’, start_column=’StartTime’, finish_column=’EndTime’, return_figure=True) fig.show()
This function is ideal for visualizing process flows, machine states, or event-based logs with time intervals.
- ml4cps.vis.plot_timeseries(data, timestamp=None, mode_data=None, discrete=False, title=None, use_columns=None, height=None, limit_num_points=None, names=None, xaxis_title=None, customdata=None, iterate_colors=True, y_title_font_size=14, opacity=1, vertical_spacing=0.005, sharey=False, bounds=None, plot_only_changes=False, yAxisLabelOffset=False, marker_size=4, showlegend=False, mode='lines+markers', mode_height=0.2, x_title=None, **kwargs)¶
Using plotly library, plots each variable (column) in a collection of dataframe as subplots, one after another.
Arguments: yAxisLabelOffset (bool): if True, adds an offset to the plots y-axis labels. Improves readability on long subplot names.
- Return type:
fig (plotly.Figure)
- ml4cps.vis.plot_transition(self, s, d)¶
Plots the transition histogram between two states. Retrieves the transition data between the source state s and destination state d, and generates a Plotly figure visualizing the timing distribution of the transition. The plot includes a title, an annotation indicating the transition, and a histogram of the transition timings. :param s: The source state identifier. :param d: The destination state identifier.
- Returns:
A Plotly Figure object containing the histogram of transition timings.
- Return type:
plotly.graph_objs._figure.Figure
- ml4cps.vis.view_graphviz(self, layout='dot', marker_size=20, node_positions=None, show_events=True, show_num_occur=False, show_state_label=True, font_size=10, plot_self_transitions=True, use_previos_node_positions=False, **kwargs)¶
Visualizes the internal graph structure using Graphviz and returns a pydot graph object. :param layout: The layout algorithm to use for node positioning (default: “dot”). :type layout: str :param marker_size: Size of the node markers in the visualization (default: 20). :type marker_size: int :param node_positions: Optional dictionary mapping node names to (x, y) positions. If None, positions are computed. :type node_positions: dict or None :param show_events: Whether to display event labels on transitions (default: True). :type show_events: bool :param show_num_occur: Whether to display the number of occurrences for each transition (default: False). :type show_num_occur: bool :param show_state_label: Whether to display state labels on nodes (default: True). :type show_state_label: bool :param font_size: Font size for labels and annotations (default: 10). :type font_size: int :param plot_self_transitions: Whether to plot self-loop transitions (default: True). :type plot_self_transitions: bool :param use_previos_node_positions: Whether to reuse previously computed node positions (default: False). :type use_previos_node_positions: bool :param **kwargs: Additional keyword arguments for customization.
- Returns:
A pydot graph object representing the visualized graph.
- Return type:
pdp.Dot
Notes
Node positions are either computed using Graphviz or taken from the provided/previous positions.
Annotations for transitions can include event names and/or occurrence counts.
The function prepares the graph for further rendering or export, but does not display it directly.