240 IoT Network Topology Simulator

Design and Analyze IoT Network Architectures

240.1 Network Topology Simulator

Design Your IoT Network

Create network topologies by adding nodes and connections. Analyze coverage, latency, and resilience for different configurations.

240.2 Topology Builder

Show code

d3 = require("d3@7")

// Network state
mutable nodes = [
  {id: "gateway", type: "gateway", x: 400, y: 100, label: "Gateway"},
  {id: "sensor1", type: "sensor", x: 200, y: 250, label: "Sensor 1"},
  {id: "sensor2", type: "sensor", x: 400, y: 300, label: "Sensor 2"},
  {id: "sensor3", type: "sensor", x: 600, y: 250, label: "Sensor 3"}
]

mutable links = [
  {source: "sensor1", target: "gateway"},
  {source: "sensor2", target: "gateway"},
  {source: "sensor3", target: "gateway"}
]

// Topology presets
viewof topologyPreset = Inputs.select([
  "Custom",
  "Star (Centralized)",
  "Mesh (Full)",
  "Tree (Hierarchical)",
  "Ring",
  "Hybrid Star-Mesh"
], {label: "Load Preset:", value: "Star (Centralized)"})

// Node type to add
viewof newNodeType = Inputs.radio(["sensor", "router", "gateway", "actuator"], {
  label: "Add Node Type:",
  value: "sensor"
})

// Connection mode
viewof connectionMode = Inputs.toggle({label: "Connection Mode (click two nodes to connect)"})

Show code

presetLoader = {
  if (topologyPreset === "Star (Centralized)") {
    mutable nodes = [
      {id: "gateway", type: "gateway", x: 400, y: 150, label: "Gateway"},
      {id: "s1", type: "sensor", x: 200, y: 300, label: "Sensor 1"},
      {id: "s2", type: "sensor", x: 300, y: 350, label: "Sensor 2"},
      {id: "s3", type: "sensor", x: 400, y: 370, label: "Sensor 3"},
      {id: "s4", type: "sensor", x: 500, y: 350, label: "Sensor 4"},
      {id: "s5", type: "sensor", x: 600, y: 300, label: "Sensor 5"}
    ];
    mutable links = [
      {source: "s1", target: "gateway"},
      {source: "s2", target: "gateway"},
      {source: "s3", target: "gateway"},
      {source: "s4", target: "gateway"},
      {source: "s5", target: "gateway"}
    ];
  } else if (topologyPreset === "Mesh (Full)") {
    mutable nodes = [
      {id: "gw", type: "gateway", x: 400, y: 100, label: "Gateway"},
      {id: "r1", type: "router", x: 250, y: 200, label: "Router 1"},
      {id: "r2", type: "router", x: 550, y: 200, label: "Router 2"},
      {id: "s1", type: "sensor", x: 150, y: 350, label: "Sensor 1"},
      {id: "s2", type: "sensor", x: 350, y: 350, label: "Sensor 2"},
      {id: "s3", type: "sensor", x: 450, y: 350, label: "Sensor 3"},
      {id: "s4", type: "sensor", x: 650, y: 350, label: "Sensor 4"}
    ];
    mutable links = [
      {source: "r1", target: "gw"},
      {source: "r2", target: "gw"},
      {source: "r1", target: "r2"},
      {source: "s1", target: "r1"},
      {source: "s2", target: "r1"},
      {source: "s2", target: "r2"},
      {source: "s3", target: "r1"},
      {source: "s3", target: "r2"},
      {source: "s4", target: "r2"}
    ];
  } else if (topologyPreset === "Tree (Hierarchical)") {
    mutable nodes = [
      {id: "gw", type: "gateway", x: 400, y: 50, label: "Gateway"},
      {id: "r1", type: "router", x: 250, y: 150, label: "Router 1"},
      {id: "r2", type: "router", x: 550, y: 150, label: "Router 2"},
      {id: "r3", type: "router", x: 150, y: 250, label: "Router 3"},
      {id: "r4", type: "router", x: 350, y: 250, label: "Router 4"},
      {id: "s1", type: "sensor", x: 100, y: 350, label: "S1"},
      {id: "s2", type: "sensor", x: 200, y: 350, label: "S2"},
      {id: "s3", type: "sensor", x: 300, y: 350, label: "S3"},
      {id: "s4", type: "sensor", x: 400, y: 350, label: "S4"},
      {id: "s5", type: "sensor", x: 500, y: 350, label: "S5"},
      {id: "s6", type: "sensor", x: 600, y: 350, label: "S6"}
    ];
    mutable links = [
      {source: "r1", target: "gw"},
      {source: "r2", target: "gw"},
      {source: "r3", target: "r1"},
      {source: "r4", target: "r1"},
      {source: "s1", target: "r3"},
      {source: "s2", target: "r3"},
      {source: "s3", target: "r4"},
      {source: "s4", target: "r4"},
      {source: "s5", target: "r2"},
      {source: "s6", target: "r2"}
    ];
  } else if (topologyPreset === "Ring") {
    mutable nodes = [
      {id: "gw", type: "gateway", x: 400, y: 100, label: "Gateway"},
      {id: "r1", type: "router", x: 250, y: 180, label: "R1"},
      {id: "r2", type: "router", x: 550, y: 180, label: "R2"},
      {id: "r3", type: "router", x: 180, y: 320, label: "R3"},
      {id: "r4", type: "router", x: 620, y: 320, label: "R4"},
      {id: "r5", type: "router", x: 300, y: 400, label: "R5"},
      {id: "r6", type: "router", x: 500, y: 400, label: "R6"}
    ];
    mutable links = [
      {source: "gw", target: "r1"},
      {source: "r1", target: "r3"},
      {source: "r3", target: "r5"},
      {source: "r5", target: "r6"},
      {source: "r6", target: "r4"},
      {source: "r4", target: "r2"},
      {source: "r2", target: "gw"}
    ];
  } else if (topologyPreset === "Hybrid Star-Mesh") {
    mutable nodes = [
      {id: "cloud", type: "gateway", x: 400, y: 50, label: "Cloud"},
      {id: "gw1", type: "gateway", x: 200, y: 150, label: "GW 1"},
      {id: "gw2", type: "gateway", x: 600, y: 150, label: "GW 2"},
      {id: "r1", type: "router", x: 150, y: 280, label: "R1"},
      {id: "r2", type: "router", x: 300, y: 280, label: "R2"},
      {id: "r3", type: "router", x: 500, y: 280, label: "R3"},
      {id: "r4", type: "router", x: 650, y: 280, label: "R4"},
      {id: "s1", type: "sensor", x: 100, y: 380, label: "S1"},
      {id: "s2", type: "sensor", x: 200, y: 380, label: "S2"},
      {id: "s3", type: "sensor", x: 350, y: 380, label: "S3"},
      {id: "s4", type: "sensor", x: 450, y: 380, label: "S4"},
      {id: "s5", type: "sensor", x: 600, y: 380, label: "S5"},
      {id: "s6", type: "sensor", x: 700, y: 380, label: "S6"}
    ];
    mutable links = [
      {source: "gw1", target: "cloud"},
      {source: "gw2", target: "cloud"},
      {source: "gw1", target: "gw2"},
      {source: "r1", target: "gw1"},
      {source: "r2", target: "gw1"},
      {source: "r1", target: "r2"},
      {source: "r3", target: "gw2"},
      {source: "r4", target: "gw2"},
      {source: "r3", target: "r4"},
      {source: "r2", target: "r3"},
      {source: "s1", target: "r1"},
      {source: "s2", target: "r1"},
      {source: "s2", target: "r2"},
      {source: "s3", target: "r2"},
      {source: "s4", target: "r3"},
      {source: "s5", target: "r3"},
      {source: "s5", target: "r4"},
      {source: "s6", target: "r4"}
    ];
  }
  return topologyPreset;
}

presetLoader

Show code

networkMetrics = {
  const nodeCount = nodes.length;
  const linkCount = links.length;

  // Count by type
  const gateways = nodes.filter(n => n.type === "gateway").length;
  const routers = nodes.filter(n => n.type === "router").length;
  const sensors = nodes.filter(n => n.type === "sensor").length;
  const actuators = nodes.filter(n => n.type === "actuator").length;

  // Calculate average degree
  const degrees = {};
  nodes.forEach(n => degrees[n.id] = 0);
  links.forEach(l => {
    degrees[l.source]++;
    degrees[l.target]++;
  });
  const avgDegree = Object.values(degrees).reduce((a, b) => a + b, 0) / nodeCount;

  // Find max hops (simplified BFS from gateway)
  const gateway = nodes.find(n => n.type === "gateway");
  let maxHops = 0;
  if (gateway) {
    const visited = new Set([gateway.id]);
    const queue = [{id: gateway.id, hops: 0}];

    while (queue.length > 0) {
      const current = queue.shift();
      maxHops = Math.max(maxHops, current.hops);

      links.forEach(l => {
        const neighbor = l.source === current.id ? l.target :
                        l.target === current.id ? l.source : null;
        if (neighbor && !visited.has(neighbor)) {
          visited.add(neighbor);
          queue.push({id: neighbor, hops: current.hops + 1});
        }
      });
    }
  }

  // Estimate redundancy (mesh factor)
  const minLinks = nodeCount - 1; // Tree minimum
  const redundancy = linkCount > 0 ? ((linkCount - minLinks) / minLinks * 100).toFixed(0) : 0;

  // Single point of failure analysis
  const spof = gateways === 1 && routers === 0;

  return {
    nodeCount,
    linkCount,
    gateways,
    routers,
    sensors,
    actuators,
    avgDegree: avgDegree.toFixed(1),
    maxHops,
    redundancy: Math.max(0, redundancy),
    spof
  };
}

html`
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; margin: 15px 0;">
  <div style="background: #E8F6F3; padding: 12px; border-radius: 8px; text-align: center;">
    <div style="font-size: 24px; font-weight: bold; color: #16A085;">${networkMetrics.nodeCount}</div>
    <div style="font-size: 11px; color: #666;">Total Nodes</div>
  </div>
  <div style="background: #EBF5FB; padding: 12px; border-radius: 8px; text-align: center;">
    <div style="font-size: 24px; font-weight: bold; color: #3498DB;">${networkMetrics.linkCount}</div>
    <div style="font-size: 11px; color: #666;">Connections</div>
  </div>
  <div style="background: #FEF9E7; padding: 12px; border-radius: 8px; text-align: center;">
    <div style="font-size: 24px; font-weight: bold; color: #E67E22;">${networkMetrics.maxHops}</div>
    <div style="font-size: 11px; color: #666;">Max Hops</div>
  </div>
  <div style="background: #F5EEF8; padding: 12px; border-radius: 8px; text-align: center;">
    <div style="font-size: 24px; font-weight: bold; color: #9B59B6;">${networkMetrics.avgDegree}</div>
    <div style="font-size: 11px; color: #666;">Avg Degree</div>
  </div>
  <div style="background: ${networkMetrics.redundancy > 20 ? '#D5F4E6' : '#FADBD8'}; padding: 12px; border-radius: 8px; text-align: center;">
    <div style="font-size: 24px; font-weight: bold; color: ${networkMetrics.redundancy > 20 ? '#27AE60' : '#E74C3C'};">${networkMetrics.redundancy}%</div>
    <div style="font-size: 11px; color: #666;">Redundancy</div>
  </div>
</div>
`

Show code

// SVG visualization
{
  const width = 800;
  const height = 450;

  const svg = d3.create("svg")
    .attr("viewBox", [0, 0, width, height])
    .attr("style", "max-width: 100%; height: auto; background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); border-radius: 12px; border: 2px solid #dee2e6;");

  // Node colors by type
  const nodeColors = {
    gateway: "#E74C3C",
    router: "#3498DB",
    sensor: "#27AE60",
    actuator: "#9B59B6"
  };

  // Node shapes
  const nodeRadius = {
    gateway: 25,
    router: 20,
    sensor: 15,
    actuator: 18
  };

  // Create link elements
  const linkGroup = svg.append("g");
  links.forEach(link => {
    const source = nodes.find(n => n.id === link.source);
    const target = nodes.find(n => n.id === link.target);
    if (source && target) {
      linkGroup.append("line")
        .attr("x1", source.x)
        .attr("y1", source.y)
        .attr("x2", target.x)
        .attr("y2", target.y)
        .attr("stroke", "#95a5a6")
        .attr("stroke-width", 2)
        .attr("stroke-dasharray", link.wireless ? "5,5" : "none");
    }
  });

  // Create node elements
  const nodeGroup = svg.append("g");
  nodes.forEach(node => {
    const g = nodeGroup.append("g")
      .attr("transform", `translate(${node.x}, ${node.y})`);

    // Node circle
    g.append("circle")
      .attr("r", nodeRadius[node.type] || 15)
      .attr("fill", nodeColors[node.type] || "#95a5a6")
      .attr("stroke", "#fff")
      .attr("stroke-width", 3)
      .attr("style", "cursor: pointer;");

    // Node icon
    const icons = {
      gateway: "&#128225;",
      router: "&#128246;",
      sensor: "&#128161;",
      actuator: "&#9881;"
    };

    g.append("text")
      .attr("text-anchor", "middle")
      .attr("dy", "0.35em")
      .attr("fill", "white")
      .attr("font-size", "12px")
      .html(icons[node.type] || "?");

    // Label
    g.append("text")
      .attr("text-anchor", "middle")
      .attr("y", (nodeRadius[node.type] || 15) + 15)
      .attr("fill", "#2C3E50")
      .attr("font-size", "11px")
      .attr("font-weight", "bold")
      .text(node.label);
  });

  // Legend
  const legend = svg.append("g")
    .attr("transform", "translate(20, 20)");

  const legendItems = [
    {type: "gateway", label: "Gateway"},
    {type: "router", label: "Router"},
    {type: "sensor", label: "Sensor"},
    {type: "actuator", label: "Actuator"}
  ];

  legendItems.forEach((item, i) => {
    const g = legend.append("g")
      .attr("transform", `translate(0, ${i * 25})`);

    g.append("circle")
      .attr("r", 8)
      .attr("fill", nodeColors[item.type]);

    g.append("text")
      .attr("x", 15)
      .attr("dy", "0.35em")
      .attr("font-size", "12px")
      .attr("fill", "#2C3E50")
      .text(item.label);
  });

  return svg.node();
}

240.3 Network Analysis

Show code

html`
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin: 20px 0;">
  <div style="background: white; border-radius: 12px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);">
    <h4 style="margin-top: 0; color: #2C3E50; display: flex; align-items: center; gap: 10px;">
      <span style="font-size: 24px;">&#128200;</span> Topology Analysis
    </h4>

    <div style="margin: 15px 0;">
      <strong>Topology Type:</strong>
      <span style="background: #E8F6F3; padding: 4px 12px; border-radius: 15px; margin-left: 10px;">
        ${topologyPreset}
      </span>
    </div>

    <div style="margin: 15px 0;">
      <strong>Network Composition:</strong>
      <ul style="margin: 10px 0; padding-left: 20px;">
        <li>Gateways: ${networkMetrics.gateways}</li>
        <li>Routers: ${networkMetrics.routers}</li>
        <li>Sensors: ${networkMetrics.sensors}</li>
        <li>Actuators: ${networkMetrics.actuators}</li>
      </ul>
    </div>

    <div style="padding: 15px; background: ${networkMetrics.spof ? '#FADBD8' : '#D5F4E6'}; border-radius: 8px; margin-top: 15px;">
      <strong>${networkMetrics.spof ? '&#9888; Single Point of Failure' : '&#10004; Redundancy Present'}</strong>
      <p style="margin: 5px 0 0 0; font-size: 13px; color: #666;">
        ${networkMetrics.spof
          ? 'This topology has a single gateway with no backup path. Consider adding redundant routes.'
          : 'Multiple paths exist for improved reliability.'}
      </p>
    </div>
  </div>

  <div style="background: white; border-radius: 12px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);">
    <h4 style="margin-top: 0; color: #2C3E50; display: flex; align-items: center; gap: 10px;">
      <span style="font-size: 24px;">&#9889;</span> Performance Estimates
    </h4>

    <div style="margin: 15px 0;">
      <strong>Latency Impact:</strong>
      <div style="background: #eee; border-radius: 10px; height: 20px; margin-top: 5px; overflow: hidden;">
        <div style="background: ${networkMetrics.maxHops <= 2 ? '#27AE60' : networkMetrics.maxHops <= 4 ? '#F39C12' : '#E74C3C'};
                    width: ${Math.min(100, networkMetrics.maxHops * 20)}%; height: 100%;"></div>
      </div>
      <div style="font-size: 12px; color: #666; margin-top: 5px;">
        ${networkMetrics.maxHops <= 2 ? 'Low latency - Good for real-time applications'
          : networkMetrics.maxHops <= 4 ? 'Moderate latency - Acceptable for most IoT'
          : 'High latency - Consider reducing hops'}
      </div>
    </div>

    <div style="margin: 15px 0;">
      <strong>Scalability:</strong>
      <div style="font-size: 13px; color: #666; margin-top: 5px;">
        ${topologyPreset.includes("Star") ? 'Limited by gateway capacity. Max ~50-100 direct connections.'
          : topologyPreset.includes("Mesh") ? 'Highly scalable. Each node adds capacity.'
          : topologyPreset.includes("Tree") ? 'Good scalability. Add hierarchy levels as needed.'
          : 'Scalability depends on specific configuration.'}
      </div>
    </div>

    <div style="margin: 15px 0;">
      <strong>Power Efficiency:</strong>
      <div style="font-size: 13px; color: #666; margin-top: 5px;">
        ${topologyPreset.includes("Star") ? '&#9889; Best for battery devices (single-hop, sleep mode)'
          : topologyPreset.includes("Mesh") ? '&#128267; Higher power (routing overhead)'
          : '&#128268; Moderate power consumption'}
      </div>
    </div>
  </div>
</div>
`

240.4 Topology Comparison

Topology	Latency	Redundancy	Scalability	Power	Best For
Star	Low (1 hop)	None	Limited	Best	Simple sensors, battery devices
Mesh	Variable	High	Excellent	Higher	Large areas, reliability critical
Tree	Medium	Low	Good	Medium	Hierarchical, structured deployments
Ring	Medium	Some	Limited	Medium	Sequential processes, monitoring
Hybrid	Varies	High	Excellent	Varies	Complex deployments, mixed requirements

240.5 Design Recommendations

Show code

recommendations = {
  const recs = [];

  // Based on current topology
  if (networkMetrics.spof) {
    recs.push({
      type: "warning",
      title: "Add Redundancy",
      text: "Your network has a single point of failure. Consider adding a backup gateway or mesh routing."
    });
  }

  if (networkMetrics.maxHops > 4) {
    recs.push({
      type: "warning",
      title: "Reduce Hop Count",
      text: "More than 4 hops increases latency significantly. Add intermediate routers or use a flatter topology."
    });
  }

  if (networkMetrics.redundancy < 10 && networkMetrics.nodeCount > 5) {
    recs.push({
      type: "info",
      title: "Consider Mesh Links",
      text: "Adding cross-connections between nodes improves reliability and can reduce latency."
    });
  }

  if (networkMetrics.gateways > 1) {
    recs.push({
      type: "success",
      title: "Good Gateway Redundancy",
      text: "Multiple gateways provide failover capability and load distribution."
    });
  }

  if (networkMetrics.routers === 0 && networkMetrics.sensors > 10) {
    recs.push({
      type: "warning",
      title: "Add Router Layer",
      text: "With many sensors, adding a router layer improves scalability and management."
    });
  }

  if (recs.length === 0) {
    recs.push({
      type: "success",
      title: "Well-Designed Network",
      text: "Your topology appears well-balanced for typical IoT applications."
    });
  }

  return recs;
}

html`
<div style="display: flex; flex-direction: column; gap: 15px;">
  ${recommendations.map(rec => html`
    <div style="background: ${rec.type === 'warning' ? '#FEF9E7' : rec.type === 'success' ? '#D5F4E6' : '#EBF5FB'};
                border-left: 4px solid ${rec.type === 'warning' ? '#F39C12' : rec.type === 'success' ? '#27AE60' : '#3498DB'};
                padding: 15px; border-radius: 0 8px 8px 0;">
      <strong style="color: ${rec.type === 'warning' ? '#E67E22' : rec.type === 'success' ? '#27AE60' : '#3498DB'};">
        ${rec.type === 'warning' ? '&#9888;' : rec.type === 'success' ? '&#10004;' : '&#128161;'} ${rec.title}
      </strong>
      <p style="margin: 5px 0 0 0; color: #666; font-size: 14px;">${rec.text}</p>
    </div>
  `)}
</div>
`

240.6 Quick Reference

240.6.1 When to Use Each Topology

Star Topology

Use when: Simple deployment, battery-powered sensors, low latency required
Avoid when: Large coverage area, high reliability needed, many nodes (>50)
Protocols: Zigbee (coordinator mode), LoRaWAN, BLE

Mesh Topology

Use when: Large area coverage, self-healing required, nodes can relay
Avoid when: Tight power budget, simple requirements, few nodes
Protocols: Zigbee (mesh mode), Thread, Z-Wave, Wi-SUN

Tree Topology

Use when: Hierarchical organization, structured deployment, cluster-based
Avoid when: Flat organization preferred, nodes move frequently
Protocols: RPL (6LoWPAN), cluster-tree Zigbee

240.1 Network Topology Simulator

240.2 Topology Builder

240.3 Network Analysis

240.4 Topology Comparison

240.5 Design Recommendations

240.6 Quick Reference

240.6.1 When to Use Each Topology

240.7 Related Resources