🔍 Probabilistic Graphical Model Editor

PGM Studio is an interactive JavaScript-based platform designed for building, visualizing, and analyzing probabilistic graphical models (PGMs) such as Bayesian networks and Markov networks.

This tool supports component-based architecture, dual-mode execution (online & desktop), and integrates a high-performance mathematical backend based on a WebAssembly port of the aGrUM C++ library.

🚀 Overview

This software provides a powerful and interactive interface for designing, analyzing, and experimenting with PGMs such as Bayesian networks, Markov networks, and causal models.

✨ Key Features

• 🎛️ Modular interface wit dedicated modes for Modeling, Learning, Inference, and Causality
• 🌐 Online and Desktop support through web deployment or Electron packaging
• 🧱 Component-oriented UI for maintainability and extensibility
• 🎨 Dynamic visual model editing: positions, colors, shapes, user-defined metadata
• 📁 Unified file format: embeds standard BIFXML model and open-format metadata
• ⚡ High-performance reasoning: powered by a transcompiled version of the aGrUM C++ engine

🔍 Core Concepts

• Model-first design: Graphical modeling is central to the application, and all interface features reflect probabilistic semantics
• Backend-native computing: Inference and learning are offloaded to a robust WASM-compiled C++ core
• Fully decoupled front-end: UI and graph manipulation logic are framework-agnostic, using clean interface bindings

💡 Use Cases

This tool is designed to serve a wide variety of users and domains:

• Academia: Teaching probabilistic reasoning, causality, and graphical models with a visual, interactive approach
• Data Science: Model latent variables, explore conditional dependencies, and conduct causal inference
• AI Engineering: Integrate structured reasoning into machine learning pipelines
• Policy Simulation: Use causal models to evaluate interventions and simulate "what-if" scenarios
• Prototyping: Rapid development and testing of probabilistic structures for research or production use

🏗️ Architecture Diagram

+-------------------------------+
|         UI Components         |
| - Mode Switcher               |
| - Graph Editor                |
| - Panel: Variables, CPTs      |
+-------------------------------+
               |
               v
+-------------------------------+
|       Reactive State Store    |
| - Current Graph               |
| - Current Mode                |
| - Visual Layout               |
+-------------------------------+
               |
               v
+-------------------------------+
|        Graph Engine           |
| - Edges, Nodes, Interactions  |
| - Layout & Grouping           |
+-------------------------------+
               |
               v
+-------------------------------+
|   Inference & Learning Core   |
| - WebAssembly binding         |
| - aGrUM backend               |
+-------------------------------+
               |
               v
+-------------------------------+
|       File Format Layer       |
| - Load/Save BIFXML+Metadata   |
| - Format Validation           |
+-------------------------------+

Component Breakdown:

• UI Components: Graph editor, mode switcher, parameter panel, visualization layers
• State Management: Reactive stores for session data, graph structure, current mode
• Graph Engine: Manages structure, layout, and user interactions
• Inference & Learning Engine: Delegates computational tasks to the WebAssembly-wrapped aGrUM library
• File & Format Layer: Parses/exports model definitions and metadata in BIF + extended JSON/YAML
• aGrUM Backend: High-performance C++ core for inference, learning, and structure analysis

📦 Dependencies

(for instance)

📂 Sample File Format

The application uses a single file format combining a standard BIFXML model and open-format metadata (YAML), for portability and extensibility.

network.pgm.yaml

model:
  bifxml: |
    <BIF VERSION="0.3">
      <NETWORK>
        <NAME>RainNetwork</NAME>
        <VARIABLE TYPE="nature">
          <NAME>Rain</NAME>
          <OUTCOME>yes</OUTCOME>
          <OUTCOME>no</OUTCOME>
        </VARIABLE>
        <VARIABLE TYPE="nature">
          <NAME>Sprinkler</NAME>
          <OUTCOME>on</OUTCOME>
          <OUTCOME>off</OUTCOME>
        </VARIABLE>
        <DEFINITION>
          <FOR>Sprinkler</FOR>
          <GIVEN>Rain</GIVEN>
          <TABLE>0.1 0.9 0.5 0.5</TABLE>
        </DEFINITION>
      </NETWORK>
    </BIF>

metadata:
  layout:
    Rain:      { x: 100, y: 100, color: "#3498db", shape: "circle" }
    Sprinkler: { x: 300, y: 100, color: "#2ecc71", shape: "square" }
  semantic:
    tags:
      Rain: ["observable"]
      Sprinkler: ["action"]
  ui:
    zoom: 1.0
    pan: { x: 0, y: 0 }
  user:
    createdBy: "Alice Smith"
    editedAt: "2025-04-05"
    version: "0.9-beta"

🧩 Advantages of This Format:

This layered format allows separation of probabilistic structure and visual/semantic information, ensuring compatibility and extensibility.

• Fully editable and human-readable
• Allows automated layout reproduction
• Backward-compatible with standard BIF parsers (if extracted)
• Compatible with JSON via YAML-to-JSON conversion