Introduction to SC Visualizer

VizChain SC Visualizer is a professional web application designed for supply chain managers, analysts, and executives who need to map, understand, and communicate complex multi-tier supply chain networks — without writing a single line of code.

What is SC Visualizer?

SC Visualizer transforms your supply chain data into a clear, interactive visual map. Instead of spreadsheets with rows of data that are hard to interpret, you see your entire network at a glance: where your suppliers are located, how products flow from raw materials to your customers, and where the risks and bottlenecks are hiding.

Whether you are mapping a simple regional distribution network or a complex global multi-tier supply chain with hundreds of facilities across five continents, SC Visualizer gives you the tools to build, analyse, and share that picture with your team and stakeholders.

Who Is This Manual For?

This manual is written for supply chain professionals — not software developers. No technical knowledge is assumed. If you can use a spreadsheet application such as Microsoft Excel, you have all the skills you need to become proficient with SC Visualizer.

Key Concepts

Before diving in, here are the four central concepts that everything else builds upon:

1. Nodes — Your Facilities

A node represents a physical location or facility in your supply chain: a supplier factory, your own manufacturing plant, a distribution warehouse, a retail store, or an end customer. Each node has a type, a geographic region, a tier position, and can hold as many data attributes as you need.

2. Connections — Your Logistics Flows

A connection (also called an edge or link) represents a logistics flow between two facilities. It carries information about transport mode (Road, Sea, Air, Rail), transit time, cost, and volume.

3. Regions — Your Geographic Swimlanes

The canvas is divided into horizontal swimlanes, one per geographic region (North America, Europe, APAC, etc.). Every node belongs to exactly one region. This keeps your map organised and immediately conveys geographic structure.

4. Tiers — Your Supply Chain Stages

The canvas is divided into vertical tier columns that represent stages in your supply chain flow, reading left to right: Upstream → Suppliers → Internal → Distribution → Customers. Every node belongs to exactly one tier.

Manual Structure

This manual is organised as follows. Feel free to read it cover to cover or jump directly to the chapter most relevant to your immediate task:

Getting Started

In this chapter you will open SC Visualizer for the first time, take a guided tour of the interface, and build your first simple supply chain map step by step. By the end you will have a working two-node map with a connection between them.

Opening the Application

SC Visualizer runs in any modern web browser — Chrome, Edge, Firefox, or Safari. Simply navigate to the application URL. No installation or login is required to start using the free features.

When the application loads for the first time, you will see a demo supply chain already on the canvas — this is a fictional example to help you understand the layout. You can explore this demo, or start fresh by clicking File → New Canvas.

A Tour of the Interface

The SC Visualizer screen is divided into four main areas:

Building Your First Supply Chain Map

Follow these steps to create a simple two-node supply chain with one connection. This takes approximately three minutes.

1. Open a new canvas. Click File in the top toolbar, then click New Canvas. If asked to confirm, click New Canvas. The canvas will clear, leaving one default swimlane (North America).

2. Add your first node — a supplier. Click the + (plus) button in the toolbar. A dialog box appears. Fill in:

   • Label: Seoul Chip Foundry
   • Type: Supplier
   • Region: APAC (you may need to create this region first — see below)
   • Tier: Suppliers

   Press Enter or click Add Node. The node appears in the APAC swimlane under the Suppliers column.

3. Add a region if needed. If you don't see APAC in the Region dropdown, click ⚙️ Settings, go to the Regions tab, click + Add Region, type APAC, and click Done. Then return to the Add Node dialog.

4. Add a second node — your factory. Click + again and fill in:

   • Label: Berlin Assembly Plant
   • Type: Factory
   • Region: Europe
   • Tier: Internal

   Press Enter. The node appears in the Europe swimlane.

5. Connect the two nodes. Hover over the Seoul Chip Foundry node until you see small connection handles appear on its edges (small grey dots). Click and drag from the right-hand handle to the Berlin Assembly Plant node. Release the mouse. A connection arrow appears with an automatic label showing the transport mode and time.

6. Edit the connection details. Click the connection line. The Inspector panel opens on the right. Change:

   • Mode: Sea
   • Transit Time: 28
   • Cost: 12500

   The connection label updates automatically to show the new details.

7. Save your work. Click File → Export → Project (JSON). A file named supply-chain-YYYYMMDD.json downloads to your computer. Keep this file — you can re-import it at any time to restore your map exactly as it is now.

The Demo Supply Chain

The default demo canvas shows a fictional consumer electronics supply chain (similar to a smartphone manufacturer) with suppliers in APAC, assembly in Europe, and distribution across multiple regions. Use it as a reference and a playground as you learn the application.

Key things to notice in the demo:

• The left-to-right flow from Upstream raw material suppliers through to Customers
• The horizontal swimlanes separating geographic regions
• How sea connections span across regions while road connections stay within a region
• The information shown directly on each connection (mode icon, transit time, cost)

Understanding the Canvas

The canvas is the heart of SC Visualizer. This chapter explains the grid structure, how to navigate around a large map, and all the canvas controls at your disposal.

The Grid Structure

Think of the canvas as a two-dimensional spreadsheet grid:

When you add a node and assign it to "Europe / Suppliers", it automatically appears at the intersection of the Europe row and the Suppliers column. This keeps your map consistently organised without any manual positioning.

Navigation Controls

Panning (Moving Around)

To move the camera around the canvas:

• Click and drag on any empty part of the canvas
• The cursor changes to a hand (✋) while panning

Zooming

• Scroll wheel — zoom in and out at the cursor position
• Pinch gesture — on trackpads and touch screens
• Zoom controls in the top-left corner of the canvas (+/– buttons)

Fit to Screen

Lost in a large map? Press the ⊡ Fit View button (bottom-left controls or top-left corner) to instantly zoom and centre the view so all nodes are visible on screen.

Selecting Items

Single Selection

Click any node or connection to select it. The selected item gets a blue highlight and the Inspector panel opens on the right.

Multi-Selection

• Box select: Click and drag on empty canvas space to draw a selection rectangle. All nodes and connections inside the rectangle are selected.
• Shift+Click: Hold Shift and click to add or remove individual items from the current selection.
• Ctrl+A (or Cmd+A on Mac) selects all items.

Moving Nodes

Drag any node to reposition it. Nodes snap to a grid alignment to keep things tidy. If you want to move a node to a different swimlane (region), simply drag it into that lane — the node's Region property updates automatically.

When Alignment Guides are enabled (Settings → Regions → Layout Settings), red dashed lines appear when a node is aligned with other nodes — helping you create perfectly aligned layouts.

Auto Layout

Click the ✨ Wand icon in the toolbar to automatically arrange all nodes on the canvas. The auto-layout algorithm:

• Places nodes in their correct tier column and swimlane row
• Vertically stacks multiple nodes in the same tier/region cell
• Aligns nodes horizontally across tiers for clean visual flow
• Resizes swimlanes to fit their content (or asks you if auto-resize is off)

Canvas Toolbar Reference

The Minimap

In the bottom-right corner of the canvas is a minimap — a small overview of your entire supply chain. The highlighted rectangle shows the area currently visible in the main viewport. Click anywhere on the minimap to jump to that area. You can hide the minimap in Settings → General → View → Show Minimap.

Working with Nodes

Nodes are the building blocks of your supply chain map. Each node represents a facility, organisation, or entity in your network. This chapter covers everything you need to know about creating, editing, customising, and organising nodes.

Node Types

SC Visualizer provides four standard node types, each with its own icon and colour coding. You can also create fully custom node types in Settings.

Creating a Node

1. Click the + button in the top toolbar. The Add Node dialog opens.

2. Enter a Label — a descriptive name for this facility. Good examples: Munich Distribution Hub, Shenzhen PCB Supplier, US East Coast 3PL. Avoid generic names like "Supplier 1".

3. Select the Type (Supplier, Factory, Warehouse, Customer, or custom).

4. Select the Region (geographic swimlane). This places the node in the correct horizontal band.

5. Select the Tier (supply chain stage). This places the node in the correct vertical column.

6. Press Enter or click Add Node. The node appears on the canvas in the correct swimlane/column intersection.

Editing a Node — The Inspector Panel

Click any node to open the Inspector Panel on the right side of the screen. The Inspector shows all properties for that node. Changes are applied immediately as you type — there is no "Save" button needed.

Standard Node Properties

Adding Custom Properties

Every node type can have additional custom properties that you define. For example, a Factory might need "Annual Capacity (units)", "ISO Certification", "Risk Score", or "Lead Time (weeks)".

1. Go to Settings → Nodes. Select the node type tab (e.g. Factory).

2. Scroll down to Add Custom Property. Enter the property name and select its data type (text, number, currency, date, boolean, duration).

3. Click Add. The new property now appears in the Inspector for all nodes of that type.

Controlling What Is Displayed on Nodes

By default, nodes show their label and a few key properties. You can control exactly what appears on each node type's visual box on the canvas, separately from what appears in the Inspector.

1. Open Settings → Nodes and select a node type tab.

2. For each property, toggle the Eye icon to show/hide it. Properties with the eye off will not appear on the canvas card at all.

3. For visible properties, choose the display mode: Value Only (shows just the data) or Label + Value (shows "Location: Berlin, Germany").

Node Icons and Branding

Each node type can have a unique icon that displays prominently on the canvas card. SC Visualizer provides access to over 20,000 icons from four built-in icon libraries:

• Supply Chain Icons — 33 logistics-specific icons built in
• Simple Icons — 3,400+ company brand logos
• Lucide — 1,000+ clean outline icons
• Heroicons — 300+ professional UI icons

To change a node's icon: click the node, then in the Inspector click the icon thumbnail to open the Icon Library Browser.

Copying and Pasting Nodes

• Select one or more nodes
• Press Ctrl+C (or Cmd+C)
• Press Ctrl+V (or Cmd+V)
• Pasted nodes appear offset from the originals with "(copy)" appended to the label
• If both endpoints of a connection are copied, the connection is also copied

Bulk Editing Multiple Nodes

When you need to update many nodes at once — for example, moving all your European factories to a new "Continental Europe" region, or reassigning a batch of nodes to a different tier:

1. Use box-select (drag on empty canvas) to select multiple nodes.

2. The Inspector switches to Bulk Edit Mode showing how many nodes are selected.

3. Fields showing <Multiple Values> indicate that the selected nodes have different values. Choosing a new value will apply it to all selected nodes.

4. All changes are captured as a single undo step — press Ctrl+Z once to revert the entire bulk edit.

Deleting Nodes

• Select one or more nodes, then press Delete
• Or use the Inspector panel's Delete button at the bottom
• When a node is deleted, all connections to/from it are also deleted
• Use Ctrl+Z to undo a deletion

Connections & Transport Flows

Connections — also called edges or links — represent the logistics flows between facilities in your supply chain. They carry information about how goods move: the transport mode, transit time, cost, and volume. This chapter explains how to create, edit, style, and organise connections.

Creating a Connection

Connections are always drawn from a source node to a target node. The direction matters: it represents the direction goods flow (upstream to downstream).

1. Hover over the source node (the one goods flow from). Small grey dots — called connection handles — appear on the node's edges.

2. Click and hold on a handle, then drag toward the target node. A preview line follows your cursor.

3. Release the mouse over the target node. The connection is created with smart defaults based on whether the nodes are in the same region or different regions:

   • Same region → Road transport, 7 days transit time
   • Different regions → Sea transport, 35 days transit time

4. Immediately after creating a connection, a Quick Connect toolbar appears — select the primary transport mode with a single click. The connection label updates instantly.

Connection Properties

Click any connection line to open the Inspector panel and view or edit its properties.

Multiple Transport Modes

Many supply chains use multi-modal transport — for example, goods travel by truck to a port, then by sea, then by truck again. You can assign multiple modes to a single connection:

• In the Inspector, the Mode field shows checkboxes for each available transport mode
• Select all modes that apply (e.g. Road + Sea + Road)
• The connection label displays the combined modes: Road, Sea
• Mode icons for each selected mode appear on the connection line

Transport Modes

SC Visualizer comes with four default transport modes. You can customise these (add, rename, delete, change icons) in Settings → Connectors → Transport Modes.

Connection Line Styles

You can change the visual style of all connections globally in Settings → Connectors. Choose from three styles:

Advanced Connection Styling

Beyond the global line style, individual connections can have custom visual styling. Enable this in Settings → Connectors → Advanced Styling.

Once enabled, click any connection. In the Inspector you will see additional styling controls:

Dynamic Stroke Width (Data-Driven Thickness)

Enable Dynamic Stroke Width in Settings → Connectors to make connection thickness proportional to a data value — for example, shipment volume or cost. Thicker lines immediately communicate where the highest-value flows are. Configure:

• Which property drives the width (Volume, Cost, Transit Time, or any custom property)
• Minimum and maximum stroke width (pixels)

Moving Connection Labels

Connection labels show transport mode, transit time, and cost directly on the canvas. If a label overlaps with a node or another label:

• Click and drag the label to reposition it along the connection line
• The label stays at the new position even after panning and zooming
• To reset: click the connection → Inspector → Reset Label Position

Controlling What Labels Show

You can choose which data properties appear in connection labels:

1. Open Settings → Connectors → Properties subsection.

2. For each property (Mode, Transit Time, Cost, Volume), use the eye toggle and display mode buttons to control label visibility.

3. Display modes: Hidden (never shown), Value Only (shows "28 days"), or Label + Value (shows "Transit: 28 days").

Deleting a Connection

• Click the connection, then press Delete
• Or click the connection → Inspector → Delete button
• Deleting a connection does not delete the nodes at either end
• Use Ctrl+Z to undo

Regions & Tiers

Regions (horizontal swimlanes) and Tiers (vertical columns) form the structural backbone of your supply chain map. This chapter explains how to customise both to match your specific supply chain structure.

Regions — Geographic Swimlanes

Each region is a horizontal band on the canvas. Every node belongs to one region. By default, five regions are provided:

1. North America
2. Europe
3. APAC (Asia-Pacific)
4. Latin America
5. Middle East

These are just defaults — your supply chain may need completely different regions. You might use country-level regions (Germany, Japan, USA), sub-regional groupings (South-East Asia, Nordic), or even non-geographic groupings (Online, Brick-and-Mortar).

Adding a Region

1. Open Settings → Regions.

2. Click + Add Region.

3. Type the region name (e.g. "Southeast Asia") and click the colour swatch to choose a background colour. SC Visualizer automatically assigns the next colour from the palette if you don't choose one.

4. Click Done. The new swimlane appears at the bottom of the canvas.

Renaming a Region

Open Settings → Regions, click the edit icon next to the region name, type the new name, and confirm. All nodes in that region are automatically updated to use the new name — no manual reassignment needed.

Reordering Regions

Drag the handle (⠿) next to each region in the Settings panel to change its vertical order on the canvas. The canvas updates immediately.

Region Colours

Each region has a background colour (rendered as a soft pastel tint). Click the colour swatch in Settings → Regions to change it. Choose colours that make geographic sense for your audience — for example, blue tones for the Americas, green for Europe, orange for Asia-Pacific.

Hiding a Region

Click the Eye icon next to a region in Settings to hide it from the canvas. The region and its nodes are not deleted — just hidden. Hidden regions still appear in the Inspector dropdowns (shown in grey italic with a "(Hidden)" label) so you can still assign nodes to them. A minimum of one region must remain visible.

Deleting a Region

In Settings → Regions, click the trash icon next to a region. If that region has nodes assigned to it, you will see a warning. You must reassign or delete those nodes first. At least one region must always exist.

Swimlane Height

By default, swimlane heights are calculated automatically based on the number of nodes in each region. You can switch this off in Settings → Regions → Auto-Resize Swimlanes and then drag the resize handles (the border between swimlanes) to manually set heights.

Tiers — Supply Chain Stage Columns

Each tier is a vertical column. The default tiers represent the canonical supply chain stages: Upstream → Suppliers → Internal → Distribution → Customers. Reading left to right shows how goods flow through your supply chain.

Renaming Tiers

Go to Settings → Tiers. Click the edit icon next to any tier name and type a new name. All nodes in that tier are automatically updated.

Reordering Tiers

Drag the handle (⠿) next to each tier in the Settings panel. The column order on the canvas updates immediately.

Adding a Tier

In Settings → Tiers, click + Add Tier. Enter a name. The new column appears on the right side of the canvas. Drag it to the correct position if needed.

Deleting a Tier

Click the trash icon next to a tier in Settings. Any nodes in that tier are automatically reassigned to the nearest remaining tier. At least one tier must always exist.

Hiding a Tier

Click the Eye icon next to a tier to hide it. The tier column disappears from the canvas view, but its nodes still exist and can still be assigned to it in the Inspector. Useful for temporarily simplifying the view for a presentation.

Tier Column Width

Each tier column can be resized. Go to Settings → Tiers and adjust the Tier Column Width slider (200–800 px). Or drag the resize handle at the right edge of any tier header directly on the canvas.

Import & Export

SC Visualizer supports multiple ways to get data in and out of the application. Whether you are loading an existing supply chain spreadsheet, sharing a visual with management, or backing up your work, this chapter covers every option.

The File Menu

All import and export functions are accessed through the File button in the top toolbar. Click it to open the dropdown menu, which is organised into sections: New Canvas, Import, Export Data, and Export Image.

Exporting Your Work

Export as JSON (Full Backup)

File → Export Data → Project (JSON)

This is the recommended way to save your work. A JSON export captures everything: all nodes, all connections, all annotations, all settings, regions, tiers, transport modes, and property definitions. The exported file is a complete snapshot of your project at that moment in time.

• The file is named supply-chain-YYYYMMDD-HHMMSS.json
• It downloads to your browser's default downloads folder
• Import it later to restore your project exactly
• Good for version control — keep dated copies in a shared folder

Export as Excel Worksheet

File → Export Data → Excel Worksheet

Exports your supply chain data to a .xlsx file that opens directly in Microsoft Excel or Google Sheets. The export creates two worksheets:

• Nodes sheet — one row per node with all properties as columns
• Connections sheet — one row per connection with source, target, mode, time, cost, volume

This format is ideal for sharing data with colleagues who prefer spreadsheets, for running further analysis in Excel (pivot tables, charts), or for bulk data editing.

Export as PNG Image

SC Visualizer offers two PNG export options:

Importing Data

Import from JSON

File → Import → JSON Project

Select a previously exported JSON file. SC Visualizer will restore the complete project, including:

• All nodes and connections with their exact positions
• All settings, regions, tiers, and transport mode definitions
• Annotations, chart title, and visual styling

If the JSON file contains references to regions or tiers that don't already exist in the current session, they are automatically created.

Import from Excel or CSV

File → Import → Excel Worksheet

This is the most powerful way to get an existing dataset into SC Visualizer. The importer is designed to be forgiving and flexible — it does not require a specific column naming convention.

Supported File Formats

• .xlsx — Microsoft Excel 2007+ format
• .xls — Excel 97-2003 format
• .csv — Comma-separated values

Flexible Column Mapping

The importer automatically recognises common column name variations. You do not need to rename your columns — these examples all map to the same field:

What to Prepare in Your Spreadsheet

For best results, structure your Excel file with:

• A Nodes sheet (or first sheet) listing each facility as one row
• A Connections sheet (or second sheet) listing each logistics flow with source and target node names
• Column headers in row 1
• One entry per row — no merged cells

Smart Defaults During Import

If a column is missing or a cell is blank, the importer applies sensible defaults:

• Missing Type → default
• Missing Region → North America (or the first existing region)
• Missing Tier → Internal (or the first existing tier)
• Unrecognised columns → Stored as custom attributes on the node
• Source/Target names that don't match any node → Skipped with a warning in the console

Fuzzy Name Matching

When building connections, the importer uses fuzzy name matching to link source/target node names to existing nodes. Minor typos or formatting differences (e.g. "Berlin Plant" vs "Berlin Assembly Plant") are automatically resolved if the similarity score is high enough. Ambiguous matches are flagged for manual review.

Exporting the World Map View

When you are in World Map view mode (see Chapter 9), you can export the geographic map as a PNG:

File → Export Image → World View PNG

This option is only available when the View is set to World Map or Split mode. It is greyed out in Flow Canvas mode.

AI Assistant

The AI Assistant is SC Visualizer's most powerful feature. Describe your supply chain in plain English, and the AI builds the map for you — complete with nodes, connections, geographic coordinates, and risk indicators. This chapter covers how to use the AI effectively, with practical examples.

What the AI Can Do

Opening the AI Chat Panel

Click the AI Chat button (robot icon 🤖) in the bottom-right corner of the canvas. The chat panel slides in from the right side. Type your message in the text field at the bottom and press Enter or click the send button.

Setting Up the AI — API Keys

The AI assistant requires a connection to an AI language model. SC Visualizer supports multiple AI providers:

• OpenAI (GPT-4o, GPT-4 Turbo) — most capable
• Anthropic (Claude Sonnet, Claude Haiku) — excellent for structured output
• Google Gemini — fast and cost-effective
• Manual (Clipboard) Mode — no API key needed (see below)

1. Open Settings → AI.

2. Select your preferred AI Provider from the dropdown.

3. Paste your API Key in the field provided. Your API key is stored only in your browser's local storage and never transmitted to any SC Visualizer server.

4. Select the Model you have access to.

5. Click Save. The AI chat button is now available on the canvas.

How to Write Effective AI Prompts

The AI understands plain English. You do not need to know any special syntax. However, the more specific you are, the better the result. Here are the key principles:

• Be specific about geography — Use real city and country names. The AI geocodes them automatically.
• Mention transport details — Include modes, transit times, or costs where you know them.
• Reference the correct tiers — Upstream, Suppliers, Internal, Distribution, Customers.
• Iterate — Build the map in stages. Start with the main structure, then add details in follow-up messages.
• Use "add", "remove", "change" to modify existing maps clearly.

Practical Examples

The following examples demonstrate the range of what you can ask the AI. Each example shows the prompt and what the AI does in response.

Example 1 — Build a Supply Chain from Scratch

Example 2 — Add Risk Indicators

Example 3 — Modify an Existing Map

Example 4 — Change Property Visibility

Example 5 — Risk and Financial Analysis Prompt

Example 6 — Build from a Real Company's Known Network

AI Conversation History

The AI chat panel maintains a full conversation history within a session. The AI remembers the context of previous messages, so you can refer to "the suppliers I mentioned earlier" or "the connection we just created" without repeating details.

Each exchange between you and the AI is displayed as a chat bubble — your messages in blue on the right, the AI's responses in white on the left. Each response is scrollable within its bubble if the response is long.

Understanding AI Limits

Manual (Clipboard) Mode — Air-Gapped Use

In environments where outbound API calls are not permitted (e.g. data-sensitive environments, government or defence supply chains), use Manual (Clipboard) Mode:

1. In Settings → AI, select Manual (Clipboard) as the provider.

2. Open the AI chat and type your message as normal. Click Copy Prompt.

3. Paste the copied prompt into any AI tool of your choice (the company-approved ChatGPT Enterprise, Claude, Gemini, etc.).

4. Copy the AI's response, return to SC Visualizer, and paste it into the Response field in the AI Exchange panel. Click Execute.

5. SC Visualizer processes the response and applies all changes to the canvas — identical to using a direct API connection.

World Map View

The World Map View overlays your supply chain on an interactive geographic globe. Instead of abstract swimlanes, you see your facilities exactly where they are in the real world — connected by arcing flow lines across continents and oceans. This is the most powerful way to communicate geographic risk concentration and supply chain reach to senior stakeholders.

Switching to World Map View

Click the View button in the top toolbar and choose:

Geocoding — Placing Nodes on the Map

For nodes to appear on the World Map, they need geographic coordinates. SC Visualizer resolves these automatically through a process called geocoding.

Automatic Geocoding

When a node has a Location property set to a city name or city/country combination, the application automatically resolves it to coordinates using a built-in database of over 30,000 cities worldwide.

Examples of location strings that geocode automatically:

• Seoul, South Korea
• Rotterdam, Netherlands
• Chicago, IL
• São Paulo
• DE (ISO country code — resolves to country centroid)

AI-Assisted Geocoding

The AI Assistant geocodes all nodes automatically when building a map. Simply mention city or country names in your prompt, and the AI assigns coordinates. You can also specifically ask the AI to geocode your existing nodes:

Manual Coordinate Placement

In World Map view, you can drag any node to reposition it manually. Click and drag a node to the correct location on the map. The new coordinates are saved and the node is marked as "manually placed" — AI geocoding will not override manually placed nodes.

Interacting with the World Map

Navigation

• Pan: Click and drag on the map background
• Zoom: Scroll wheel or pinch gesture
• Rotate: (Globe projection) Right-click drag or two-finger rotate

Node Interactions

• Click a node to open the Inspector panel and view/edit its properties
• Drag a node to manually reposition it on the map
• Node risk glow indicators (red/amber) from the AI are visible on the map

The Magnifier (Map Annotations)

The World Map supports Magnifier regions — interactive zoom-in overlays that let you show detail for a specific area (e.g., zooming into Western Europe) while keeping the full global view. Add magnifiers from the Drawing Tools menu.

Risk Concentration at a Glance

One of the most powerful uses of the World Map is geographic risk concentration analysis. By looking at the map, you can immediately see:

• Whether too many critical suppliers are in a single country or region
• Where single-source dependencies create geographic bottlenecks
• Nodes highlighted in red by the AI as high-risk
• The length and complexity of cross-continental logistics arcs

Undo/Redo in World Map View

The World Map has its own undo/redo history for node movements and magnifier edits. The ↶ Undo and ↷ Redo buttons in the toolbar automatically route to the correct history context based on which view is active.

Analytics & Network Insights

The Network Insights Panel is a built-in analytics dashboard that automatically analyses your supply chain and surfaces actionable intelligence. No formulas, no pivot tables — just instant insights from your visual map.

Opening the Insights Panel

Click the 📈 Analytics button at the bottom of the screen (the panel drawer handle). The panel slides up, revealing four analytics tabs. The panel can be dragged to any height to balance analytics view with the canvas.

The Four Analytics Tabs

Tab 1: Overview KPIs

The Overview tab shows a dashboard of key supply chain metrics calculated from your current map data:

Tab 2: Velocity & Critical Path

The critical path is the sequence of supply chain steps that takes the longest time from raw material to end customer. It defines your theoretical minimum lead time. This tab visualises:

• Longest end-to-end path — calculated across all node-to-node routes
• Each step's transit time contribution shown as a bar chart
• Bottleneck nodes highlighted in amber — nodes where delays have the highest downstream impact

Tab 3: Financial Matrix Heatmap

The Financial Matrix tab displays a colour-coded heatmap of logistics costs across your supply chain. Cells with higher costs appear in deeper red/orange tones, making expensive flows immediately visible.

The matrix shows costs organised by:

• By connection — which individual logistics flows cost the most
• By region pair — which inter-regional flows drive total cost
• By transport mode — breakdown of air vs sea vs road spend

Tab 4: Risk Analysis

The Risk Analysis tab automatically identifies structural vulnerabilities in your network topology:

• Single-source dependencies — nodes that are the only supplier for a downstream node
• Geographic concentration — what percentage of your supply base is in each country/region
• High-degree nodes — facilities with many connections that could become bottlenecks
• Longest lead time connections — connections that most extend your supply chain cycle time

Cross-Filtering with the Canvas

The Insights Panel and the Canvas are connected. When you click on a node or connection in the Insights Panel, the canvas automatically pans and centres on that item, and selects it. This makes it fast to navigate from an insight to the actual item on the map.

Settings & Customisation

SC Visualizer's Settings panel gives you deep control over every aspect of the application. This chapter is a comprehensive reference for all settings grouped by tab.

Opening Settings

Click the ⚙️ Settings icon in the top-right of the toolbar. The settings modal opens with multiple tabs on the left side.

General Tab

High-level application settings:

Nodes Tab

Configure node types, icons, and property display.

Manage Node Types

Each node type (Supplier, Factory, Warehouse, Customer, plus any custom types you create) has its own row in the node type list. For each type:

• Icon — Click the icon to open the Icon Library Browser (20,000+ icons)
• Eye toggle — Show or hide this node type on the canvas
• Per-type property configuration — Select the type and use the tabs below to control which properties are shown in the Inspector and on the canvas card

Property Display Modes

For each property of a node type:

• Eye off — Property is hidden everywhere (Inspector and canvas)
• Hidden button — Shown in Inspector but not on the canvas card
• Value Only button — Shows just the data value on the canvas card (e.g. "Berlin, DE")
• Label + Value button — Shows property name and value (e.g. "Location: Berlin, DE")

Custom Properties

Scroll to the bottom of the Nodes tab to find Add Custom Property. Define a name and type for each custom property. Available types:

Connectors Tab

Control all aspects of connection (edge) display and behaviour.

Shape

Select the global connector line shape: Straight, Step (orthogonal), or Smooth (bezier).

Transport Modes Management

Add, edit, and delete transport modes. Each mode has a name and an icon chosen from a visual icon picker. Custom modes appear in the Mode dropdown in the Inspector and in the Quick Connect toolbar.

Properties Subsection

Configure label visibility for connection data properties (Mode, Transit Time, Cost, Volume). Same display mode system as node properties (Hidden / Value Only / Label+Value).

Styling Subsection

Regions Tab

Manage geographic swimlanes (see also Chapter 6):

• Add, rename, delete, reorder, and show/hide regions
• Colour picker for each region's background tint
• Auto-Resize Swimlanes toggle
• Vertical Spacing slider (0–100px between stacked nodes)
• Layout Settings: Show Alignment Guides toggle, Snap to Guides toggle

Tiers Tab

Manage supply chain stage columns (see also Chapter 6):

• Add, rename, delete, reorder, and show/hide tiers
• Tier Column Width slider (200–800px)

AI Tab

Configure the AI Assistant:

• AI Provider: OpenAI, Anthropic, Google Gemini, Manual (Clipboard)
• API Key: Your provider API key (stored locally, never sent to SC Visualizer)
• Model: Select the specific model version (e.g. gpt-4o, claude-3-5-sonnet)
• Temperature: Creativity vs. precision (0.0 = deterministic, 1.0 = creative)

Brand Assets Tab

Upload your own brand logos or custom icons to use on nodes. Uploaded images are stored in your browser. The Browse Icon Libraries button opens the full icon library browser with 20,000+ icons across four libraries.

About Tab

Shows the current application version, quick links to documentation, and a Contact Support link.

Keyboard Shortcuts & Reference

This chapter is a quick-reference guide for power users. Keyboard shortcuts dramatically speed up your workflow once you know them. All shortcuts use Ctrl on Windows/Linux and Cmd on Mac.

Complete Keyboard Shortcuts

Canvas & Navigation

Nodes & Connections

Inspector Panel

Node Type Quick Reference

Transport Mode Reference

Default Tier Reference

Data Model Reference

When importing or exporting data, or when reviewing the JSON format of your saved projects, you may want to understand the underlying data structure:

Node JSON Structure

{
  "id": "node-1",
  "type": "factory",
  "data": {
    "label": "Berlin Assembly Plant",
    "region": "Europe",
    "tier": "Internal",
    "attributes": {
      "location": "Berlin, Germany",
      "products": ["Model X", "Model Y"],
      "value": 5000000,
      "capacity": 200000
    }
  },
  "position": { "x": 500, "y": 200 }
}

Connection JSON Structure

{
  "id": "e1-2",
  "source": "node-1",
  "target": "node-2",
  "data": {
    "mode": "Sea",
    "modes": ["Sea"],
    "transitTime": 28,
    "cost": 12500,
    "currency": "EUR",
    "volume": 5000
  },
  "label": "Sea: 28d · €12,500"
}

Troubleshooting Common Issues

Workflow Recipes

Quick step-by-step guides for common supply chain mapping tasks: