Welcome to the T-S Diagram Tool! This powerful web-based application is designed for visualizing, analyzing, and exporting thermodynamic processes and cycles. Whether you're an engineering student, an educator, or a professional, this guide will help you unlock the full potential of the tool.

1. Introduction: What Does This Tool Do?
2. A Quick Look at the Interface
3. Part 1: Basic Usage - Adding Points
   • Method A: Add a Single Point (Calculated)
   • Method B: Add a Single Point (Direct T-s)
   • Method C: Bulk Data Import (P-h or T-s)
4. Part 2: Defining Processes - Connections
   • Creating Connections Manually
   • Using the Connection Settings Panel
   • The Bulk Connection Editor (Advanced)
5. Part 3: Interacting with the Canvas
   • Managing Points
   • Panning & Zooming the View
   • Bending Lines (Curved Processes)
   • Presentation Mode
6. Part 4: Advanced Tools & Analysis
   • Plotting Iso-Lines (Isobars)
   • Custom Cycle Efficiency Calculation
7. Part 5: Customizing the Appearance
   • Global View Settings
   • Changing Point and Line Properties
   • The Legend and Notes Boxes
8. Part 6: Project & Data Management
   • Saving and Loading a Project
   • Exporting Data and Graphics

This tool allows you to create T-s (Temperature-Entropy) diagrams for water/steam with a rich set of features:

• Flexible Point Input: Calculate state points from any two known thermodynamic properties (P, T, h, s, x) or plot them directly with T and s values.
• Visual Process Definition: Create, label, and style connections between points to represent thermodynamic processes.
• Analysis Tools: Plot constant pressure lines (isobars) and calculate the thermal efficiency for custom-defined cycles.
• Deep Customization: Control every visual detail, from line widths and colors to labels and the legend.
• Full Data Management: Save your entire project to a file, load it back later, export your data to Excel or Text files, and save your diagram as a high-resolution PNG or a scalable SVG.

The interface is divided into three main sections:

The first step in creating a diagram is to add your state points. There are several ways to do this.

This is the most powerful method. It calculates all other properties from two known ones using the XSteam library.

1. In the left panel, expand the ➕ Add Points & Data section.
2. Click the Single Point tab.
3. Ensure the Calculate (XSteam) mode is active.
4. In the Point Name field, give your point a name (e.g., 1, Turbine Inlet).
5. Select the two properties you know from the Known Property 1 and Known Property 2 dropdowns (e.g., Pressure (P) and Quality (x)).
6. Enter the corresponding values in the input boxes below.
   • Pro Tip: You can also use special string values like hf (saturated liquid enthalpy), hg (saturated vapor enthalpy), or Tsat (saturation temperature).
7. Click the 🧮 Calculate & Add Point button. Your point will be calculated and added to the diagram.

If you already know the T and s values for a point and don't need calculations:

1. In the Single Point tab, switch to the Direct (T, s) mode.
2. Enter the Point Name, Temperature (°C), and Entropy (kJ/kg·K).
3. Click the 📍 Add T-s Point button.

If you have data for multiple points in a table, you can import them all at once.

1. Click the Bulk Import / Update tab.
2. For T-s Data:
   • In the first text area, paste your data in the format Name Temperature Entropy for each line. Values can be separated by spaces or tabs.
   • Click the Apply T-s Data button.
3. For P-h Data (with XSteam calculation):
   • In the second text area, paste your data in the format Name Pressure(kPa) Enthalpy(kJ/kg). You can use hf or hg for the enthalpy value.
   • Click the Apply P-h Data button. The system will calculate and add all points.
   • The Load Current button will populate this text area with the P-h data of all points currently on your canvas.

Once you have points, you can create connections between them to represent processes (steps in a cycle).

1. Click the 🔗 Connect button in the control bar above the canvas. The button will turn red, and your cursor will change.
2. Click on the starting point of your process.
3. Move your mouse toward the target point; a dashed line will follow.
4. Click on the target point. A connection (line) will be created.
5. To exit connect mode, click the 🔗 Cancel button or press the ESC key.

Use the right panel to customize any connection you've created.

1. Expand the 🔗 Connection Settings section.
2. Select the Source Point and Target Point of the connection you want to edit from the dropdowns.
3. The panel's settings will automatically load that connection's properties:
   • Line Style: Choose Solid, Dashed, or Dotted.
   • Label (on-line): A text label that appears on the line itself (e.g., Heat Addition, Work Output).
   • Legend Label: A label that appears in the diagram's legend box.
   • Color Picker & Width: Set the line's color and thickness.
   • Show in Legend: Check this box to make the connection appear in the legend.
4. Click the 🔄 Update Connection button to apply your changes.

This is the fastest way to script complex cycles like the Rankine cycle.

1. In the left panel, expand the 🔗 Bulk Connection Editor section.
2. Enter commands into the text area using a special syntax. Click the ⓘ help icon for a detailed guide.
3. Basic Formats:
   • Connection: SourcePoint,TargetPoint,"Label",Color,Style
   • Point Creation: PointName(p=1000,x=0)
   • All-in-one: 1(p=10,x=0), 2(p=5000,s=*1), "Pump Work"
     • This command creates point 1, calculates point 2 isentropically (using the entropy of point 1 as a reference), and draws a line between them labeled "Pump Work".
4. Click the ↥ Apply Changes button to execute all commands.

• Select: Click a point to make it active. Its properties will appear in the right-hand panel.
• Move (Drag): Click, hold, and drag a selected point to change its position. This changes its visual T and s values but does not affect its calculated thermodynamic properties.
• Delete: After selecting a point, click the small 🗑️ icon that appears above it, or press the Delete key on your keyboard.
• Right-Click Menu: Right-clicking on a point opens a context menu with options to Edit, Delete, or Start a Connection.

• Pan: Click and drag on any empty area of the canvas to move the diagram around.
• Zoom: Use your mouse wheel to zoom in and out, centered on your cursor's position. These features can be disabled via the Allow Dragging and Allow Zoom checkboxes in the top control bar.

Real-world processes are not always ideal straight lines.

1. Ensure Allow Bending is checked in the top control bar.
2. Hover your mouse over the middle of a line; a small control point will appear.
3. Click and drag this control point to give the line a curve.
4. To straighten the line again, use the Reset Curve button under Connection Settings in the right panel.

Clicking the Presentation button simplifies the UI, automatically shows all point labels, and prepares the diagram for a clean, focused view. Click it again to return to editing mode.

To draw constant pressure lines (isobars) on your diagram:

1. In the left panel, expand the 〰️ Plot Iso-Lines section.
2. Enter a pressure value in the Pressure (kPa) field.
3. Click the Plot Isobar button.
4. The Plot All Point Pressures button will automatically draw isobars for the pressure values of all points currently on the canvas.

You can calculate the thermal efficiency of any cycle you define.

1. In the left panel, expand the 📊 Custom Cycle Efficiency section. (This is enabled once you have at least 3 points).
2. Under Heat Input (Q_H) Processes, define the processes where heat is added to your cycle. Click + Add Boiler/Heater and select the inlet and outlet points for that process.
3. Under Heat Rejection (Q_L) Processes, define the processes where heat is removed from your cycle (e.g., the condenser).
4. Enter the Mass Flow rate in kg/s for each process.
5. Click the 🧮 Calculate Efficiency button. The result will be displayed below.

The checkboxes in the control bar above the canvas allow you to instantly toggle major visual elements:

• Saturation Curve: Shows/hides the saturation dome.
• Show Lines: Shows/hides the connections between points.
• Show Labels: Shows/hides the names of the points.
• Show Arrows: Shows/hides the direction arrows on the process lines.

The 🎨 Appearance Settings section in the right panel gives you full control over visuals:

• Global: Adjust the default thickness for all lines and the saturation curve.
• Point Specific: Select a point from the dropdown and change its color, size, or label color individually.

• Legend: Located in the top-right of the canvas. It displays any connection that has the Show in Legend box checked in its settings. You can drag the legend box by its header to reposition it.
• Notes: A draggable text box in the top-left where you can add custom notes about your project. These notes are saved with your project file.

You can save your entire session to resume work later.

1. Go to the 💾 Project & Data Export section in the left panel.
2. Click 📥 Save (.json) to download a .json file containing everything (points, connections, settings, notes).
3. To resume, click 📤 Load (.json) and select the project file you previously saved.

• Data Export:
  • 📊 Excel (.xlsx): Generates a detailed Excel report with all thermodynamic and saturation properties for your points.
  • 📋 Text (.txt): Creates a clean, easy-to-copy plain text report of all properties.
• Graphics Export:
  • 💾 4K PNG: Downloads a high-resolution (3840x2160) image of your diagram.
  • ✨ SVG: Downloads a vector version of your diagram. This format is perfect for reports and presentations as it can be scaled to any size without losing quality.