<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Tim Jager, Author at DMC, Inc.</title>
	<atom:link href="https://static.dmcinfo.com/blog/author/timj/feed/index.xml" rel="self" type="application/rss+xml" />
	<link></link>
	<description></description>
	<lastBuildDate>Fri, 21 Aug 2026 19:11:08 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.1.2</generator>

<image>
	<url>https://static.dmcinfo.com/wp-content/uploads/2025/04/site-icon-150x150.png</url>
	<title>Tim Jager, Author at DMC, Inc.</title>
	<link></link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Battery Life Calculator</title>
		<link>https://static.dmcinfo.com/blog/41922/battery-life-calculator/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Thu, 05 Mar 2026 13:00:00 +0000</pubDate>
				<category><![CDATA[Embedded Development & Programming]]></category>
		<category><![CDATA[Low-Power Embedded Design]]></category>
		<category><![CDATA[Product Development]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/?p=41922</guid>

					<description><![CDATA[<p>As engineers who design electronic products, maximizing battery life is a constant challenge. Devices keep getting smaller while their feature sets continue to grow, forcing us to carefully manage power consumption across multiple operating modes, batteries, and power conversion stages. This calculator helps explore those tradeoffs by letting you tune system parameters and compare different [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/41922/battery-life-calculator/">Battery Life Calculator</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">As engineers who design electronic products, maximizing battery life is a constant challenge. Devices keep getting smaller while their feature sets continue to grow, forcing us to carefully manage power consumption across multiple operating modes, batteries, and power conversion stages.</p>



<p class="wp-block-paragraph">This calculator helps explore those tradeoffs by letting you tune system parameters and compare different battery and power architecture options. Unlike many simple online calculators, it breaks power usage down by operating mode and accounts for conversion efficiency so you can better see where energy is going and how design choices affect battery life.</p>



<style>
    /* Root layout */
    .dmc-calc-root {
      margin: 2rem auto;
      padding: 1.5rem;
      border: 1px solid #ccc;
      border-radius: 8px;
      background-color: #fff;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    }

    .dmc-calc-root h1 {
      margin-top: 0;
      margin-bottom: 0.25rem;
      font-size: 1.6rem;
    }

    .dmc-calc-root p.dmc-calc-subtitle {
      margin-top: 0;
      color: #555;
      font-size: 0.95rem;
    }

    .dmc-calc-section {
      margin-top: 1.75rem;
    }

    .dmc-calc-section h2 {
      margin: 0 0 0.75rem 0;
      font-size: 1.25rem;
      border-bottom: 1px solid #ddd;
      padding-bottom: 0.25rem;
    }

    .dmc-calc-section h3 {
      margin: 1rem 0 0.5rem 0;
      font-size: 1.05rem;
    }

    /* Battery configuration */
    .dmc-calc-battery-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
      gap: 0.75rem 1rem;
    }

    .dmc-calc-field {
      display: flex;
      flex-direction: column;
      font-size: 0.9rem;
    }

    .dmc-calc-field label {
      margin-bottom: 0.15rem;
      font-weight: 600;
    }

    .dmc-calc-field input,
    .dmc-calc-field select {
      padding: 0.3rem 0.4rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 0.9rem;
    }

    .dmc-calc-field input.dmc-calc-readonly {
      background-color: #f4f6fb;
      border-color: #cdd6e4;
      color: #394255;
      cursor: not-allowed;
    }

    .dmc-calc-field input.dmc-calc-readonly:focus {
      outline: none;
      box-shadow: none;
    }

    .dmc-calc-field span.dmc-calc-unit {
      font-size: 0.8rem;
      color: #666;
      margin-top: 0.15rem;
    }

    .dmc-calc-example-links {
      margin: 0;
      padding-left: 1.05rem;
      display: flex;
      flex-direction: column;
      gap: 0.35rem;
    }

    .dmc-calc-example-links li {
      line-height: 1.3;
    }

    .dmc-calc-example-links a {
      color: #0057b8;
      text-decoration: underline;
      text-underline-offset: 2px;
    }

    .dmc-calc-example-links a:hover,
    .dmc-calc-example-links a:focus-visible {
      color: #003f84;
    }

    .dmc-calc-example-blurb {
      margin: 0.1rem 0 0 0;
      color: #666;
      font-size: 0.78rem;
    }

    /* Rails and modes tables */
    .dmc-calc-table-wrapper {
      overflow-x: auto;
    }

    .dmc-calc-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.85rem;
      min-width: 760px;
    }

    .dmc-calc-table th,
    .dmc-calc-table td {
      border: 1px solid #ddd;
      padding: 0.3rem;
      text-align: left;
      vertical-align: middle;
      white-space: nowrap;
    }

    .dmc-calc-table thead {
      background-color: #f7f7f7;
      position: sticky;
      top: 0;
      z-index: 1;
    }

    .dmc-calc-table th {
      font-weight: 600;
    }

    .dmc-calc-table input,
    .dmc-calc-table select {
      width: 100%;
      box-sizing: border-box;
      font-size: 0.8rem;
      padding: 0.2rem 0.25rem;
    }

    .dmc-calc-rails-table input[data-rail-field="name"] {
      max-width: 6rem;
    }

    .dmc-calc-rails-table input[data-rail-field="voltage"] {
      max-width: 4.75rem;
    }

    .dmc-calc-rails-table input[data-rail-field="efficiency"],
    .dmc-calc-rails-table input[data-rail-field="eff-low-pct"],
    .dmc-calc-rails-table input[data-rail-field="eff-high-pct"] {
      max-width: 3.5rem;
    }

    .dmc-calc-rails-table input[data-rail-field="iq-ua"] {
      max-width: 6rem;
    }

    .dmc-calc-rails-table select[data-rail-field="parent"] {
      max-width: 8rem;
    }

    .dmc-calc-rails-eff-mode-hidden:disabled {
      color: transparent;
      text-shadow: none;
      -webkit-text-fill-color: transparent;
    }

    .dmc-calc-rails-table {
      min-width: 640px;
    }

    .dmc-calc-loads-table {
      min-width: 640px;
    }

    .dmc-calc-modes-table {
      min-width: 1000px;
    }

    .dmc-calc-modes-table input[data-load-id] {
      width: 4.5rem;
      min-width: 4.5rem;
      max-width: 4.5rem;
    }

    .dmc-calc-modes-table input[data-mode-field="period"] {
      width: 4.5rem;
      min-width: 4.5rem;
    }

    .dmc-calc-input-with-unit {
      display: inline-flex;
      align-items: center;
      gap: 0.15rem;
    }

    .dmc-calc-input-with-unit > input,
    .dmc-calc-input-with-unit > .dmc-calc-computed-field {
      box-sizing: border-box;
      height: 1.95rem;
      line-height: 1.2;
    }

    .dmc-calc-input-with-unit select {
      width: auto;
      min-width: 4.9rem;
      padding: 0.2rem 0.2rem;
      padding-right: 1.45rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 0.85rem;
      color: #111;
      background-color: #fff;
      flex: 0 0 auto;
      -webkit-appearance: menulist;
      appearance: auto;
    }

    .dmc-calc-unit-label {
      width: 4.9rem;
      min-width: 4.9rem;
      box-sizing: border-box;
      height: 1.95rem;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0.2rem 0.2rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      background-color: #f7f7f7;
      color: #394255;
      font-size: 0.85rem;
      font-weight: 600;
      user-select: none;
    }

    .dmc-calc-modes-table input[data-mode-field="name"] {
      width: 9rem;
      min-width: 9rem;
    }

    .dmc-calc-computed-field {
      display: inline-block;
      padding: 0.3rem 0.4rem;
      background-color: #f4f6fb;
      border: 1px solid #cdd6e4;
      border-radius: 4px;
      font-size: 0.9rem;
      color: #394255;
      font-variant-numeric: tabular-nums;
      text-align: right;
      min-width: 4.5rem;
    }

    .dmc-calc-modes-table .dmc-calc-mode-period-value {
      width: 4.5rem;
      min-width: 4.5rem;
    }

    .dmc-calc-modes-table .dmc-calc-mode-active-value {
      width: 5.5rem;
      min-width: 5.5rem;
    }

    .dmc-calc-modes-table input[data-mode-field="active"] {
      width: 5.5rem;
      min-width: 5.5rem;
    }

    .dmc-calc-modes-table .dmc-blc-duty,
    .dmc-calc-modes-table .dmc-blc-avg-power,
    .dmc-calc-modes-table .dmc-blc-contrib {
      font-variant-numeric: tabular-nums;
      text-align: right;
      display: inline-block;
      min-width: 2.2rem;
    }

    .dmc-calc-modes-table th.dmc-calc-narrow-col,
    .dmc-calc-modes-table td.dmc-calc-narrow-col {
      width: 3.2rem;
      min-width: 3.2rem;
      max-width: 3.5rem;
      white-space: normal;
      line-height: 1.3;
      text-align: right;
    }

    .dmc-calc-modes-table td[role="button"] {
      padding: 0.3rem 0.15rem;
      width: 2rem;
      min-width: 2rem;
    }

    .dmc-calc-modes-table .dmc-calc-delete-col {
      width: 2rem;
      min-width: 2rem;
      padding: 0.3rem 0.15rem;
      text-align: center;
    }

    .dmc-calc-rails-eff-cell {
      white-space: normal;
    }

    .dmc-calc-rails-eff-cell input[data-rail-field="efficiency"],
    .dmc-calc-rails-eff-cell {
      white-space: normal;
    }

    .dmc-calc-rails-eff-rows {
      display: grid;
      gap: 0.2rem;
      align-items: center;
    }

    .dmc-calc-rails-eff-row {
      display: grid;
      grid-template-columns: auto 3.25rem auto 4rem auto;
      align-items: center;
      gap: 0.2rem;
    }

    .dmc-calc-rails-eff-row input[type="number"] {
      width: 100%;
      min-width: 3rem;
    }

    .dmc-calc-rails-eff-row span {
      color: #555;
      font-size: 0.85rem;
      white-space: nowrap;
    }

    .dmc-calc-rails-eff-label {
      display: inline-block;
      min-width: 2.6rem;
      text-align: right;
    }

    .dmc-calc-rails-eff-rows .dmc-calc-rails-eff-simple-only {
      grid-template-columns: 1fr;
      gap: 0;
    }

    /* Topology diagram */
    .dmc-calc-topology {
      margin: 1rem 0 1.25rem 0;
      padding: 0.75rem;
      border: 1px solid #e0e0e0;
      border-radius: 6px;
      background: linear-gradient(120deg, #fafafa 0%, #f5f7fa 100%);
    }

    .dmc-calc-topology {
      position: relative;
    }

    .dmc-calc-topology svg {
      width: 100%;
      height: 100%;
      min-height: 360px;
      max-height: 600px;
      display: block;
    }

    .dmc-calc-modes-actions {
      margin-top: 0.5rem;
      display: flex;
      gap: 0.5rem;
    }

    /* Concept tiles */
    .dmc-calc-concepts-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
      gap: 0.9rem;
      margin-top: 0.75rem;
    }

    .dmc-calc-concept-card {
      border: 1px solid #e0e0e0;
      border-radius: 6px;
      padding: 0.6rem 0.75rem;
      background: #fcfcff;
    }

    .dmc-calc-concept-name {
      font-weight: 600;
      margin: 0 0 0.35rem 0;
    }

    .dmc-calc-concept-detail {
      margin: 0.15rem 0;
      font-size: 0.86rem;
    }

    .dmc-calc-concept-detail em {
      font-style: normal;
      font-weight: 600;
      display: block;
      margin-bottom: 0.05rem;
    }

    .dmc-calc-2pt-demo {
      margin-top: 0.5rem;
      padding: 0.45rem 0.55rem;
      border: 1px solid #d8dee8;
      border-radius: 6px;
      background: #ffffff;
    }

    .dmc-calc-2pt-demo svg {
      display: block;
      width: 100%;
      height: 122px;
    }

    .dmc-calc-2pt-rules {
      margin: 0.4rem 0 0 0.95rem;
      padding: 0;
      color: #4a4a4a;
      font-size: 0.79rem;
      line-height: 1.35;
    }

    /* Results cards */
    .dmc-calc-results-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 0.75rem;
    }

    .dmc-calc-card {
      border: 1px solid #ddd;
      border-radius: 6px;
      padding: 0.75rem 0.9rem;
      background-color: #fafafa;
    }

    .dmc-calc-card h3 {
      margin: 0 0 0.3rem 0;
      font-size: 0.95rem;
    }

    .dmc-calc-card-value {
      font-size: 1.1rem;
      font-weight: 600;
      margin-bottom: 0.15rem;
    }

    .dmc-calc-card-sub {
      font-size: 0.8rem;
      color: #666;
    }

    /* Mode contribution bars */
    .dmc-calc-mode-bars {
      margin-top: 1rem;
      font-size: 0.85rem;
    }

    .dmc-calc-mode-bars h3 {
      margin: 0 0 0.5rem 0;
      font-size: 0.95rem;
    }

    .dmc-calc-mode-bars-body {
      display: flex;
      flex-direction: column;
      gap: 0.35rem;
    }

    .dmc-calc-mode-bar-row {
      display: grid;
      grid-template-columns: minmax(100px, 140px) 1fr minmax(56px, 68px);
      align-items: center;
      gap: 0.5rem;
    }

    .dmc-calc-mode-bar-label {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .dmc-calc-mode-bar-track {
      position: relative;
      height: 10px;
      border-radius: 999px;
      background-color: #eee;
      overflow: hidden;
    }

    .dmc-calc-mode-bar {
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      border-radius: 999px;
      background-color: #0074d9;
    }

    .dmc-calc-mode-bar-value {
      text-align: right;
      font-variant-numeric: tabular-nums;
      color: #444;
    }

    /* Sticky summary banner */
    #dmc-blc-summary-banner-container {
      display: flex;
      justify-content: flex-end;
      margin-bottom: 20px;
      position: sticky;
      top: 170px;
	  z-index: 60;
    }
    .dmc-calc-summary-banner {
      width: calc(100% - 1.4rem);
      margin: 0;
      padding: 0.45rem 0.7rem 0.55rem 0.7rem;
      border: 2px solid #0b5fc6;
      border-radius: 12px;
      background: linear-gradient(180deg, #f7fbff 0%, #edf4ff 100%);
      box-shadow: 0 8px 18px rgba(11, 95, 198, 0.18);
      display: flex;
      flex-direction: column;
      gap: 0.35rem 0.6rem;
      align-items: stretch;
      transition: transform 220ms ease, box-shadow 220ms ease;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-down {
      transform: translate(0, -8px);
      box-shadow: 0 4px 10px rgba(11, 95, 198, 0.14);
    }

    .dmc-calc-summary-banner-head {
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }

    .dmc-calc-summary-banner-title {
      flex: 1 1 auto;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #0b4a92;
      margin: 0;
      line-height: 1.15;
    }

    .dmc-calc-summary-toggle {
      flex: 0 0 auto;
      border: 1px solid #8fb3e0;
      border-radius: 999px;
      background: #ffffff;
      color: #225392;
      font-size: 0.72rem;
      font-weight: 700;
      letter-spacing: 0.02em;
      padding: 0.18rem 0.55rem;
      cursor: pointer;
      line-height: 1.2;
    }

    .dmc-calc-summary-toggle:hover,
    .dmc-calc-summary-toggle:focus-visible {
      border-color: #0b5fc6;
      color: #0b4a92;
      outline: none;
    }

    .dmc-calc-summary-banner-content {
      display: grid;
      grid-template-columns: repeat(3, minmax(220px, 1fr));
      gap: 0.35rem 0.6rem;
      align-items: center;
    }

    .dmc-calc-summary-pill {
      display: flex;
      flex-direction: column;
      gap: 0.08rem;
      background-color: #ffffff;
      border: 1px solid #d5deec;
      border-radius: 9px;
      padding: 0.28rem 0.45rem;
    }

    .dmc-calc-summary-pill-label {
      font-size: 0.74rem;
      color: #4f5f78;
      font-weight: 600;
    }

    .dmc-calc-summary-pill-value {
      font-size: 0.98rem;
      font-weight: 700;
      font-variant-numeric: tabular-nums;
      color: #1f2c42;
    }

    .dmc-calc-summary-pill-primary {
      border: 2px solid #ea8a15;
      background: linear-gradient(180deg, #fff9ef 0%, #fff2dc 100%);
      box-shadow: 0 2px 8px rgba(234, 138, 21, 0.18);
    }

    .dmc-calc-summary-pill-primary .dmc-calc-summary-pill-label {
      color: #8b4b00;
    }

    .dmc-calc-summary-pill-primary .dmc-calc-summary-pill-value {
      font-size: clamp(1.08rem, 2vw, 1.3rem);
      line-height: 1.1;
      color: #7a2e00;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed {
      transform: translate(0, 0);
      width: max-content;
      max-width: calc(100vw - 1.3rem);
      padding: 0.2rem 0.28rem;
      gap: 0.16rem;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-banner-title {
      display: none;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-banner-content {
      grid-template-columns: 1fr;
      gap: 0.25rem;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-pill-secondary {
      display: none;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-pill-primary {
      border-width: 1px;
      box-shadow: none;
      padding: 0.12rem 0.34rem;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-pill-primary .dmc-calc-summary-pill-label {
      display: none;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-pill-primary .dmc-calc-summary-pill-value {
      font-size: 0.86rem;
      color: #4f2b00;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed .dmc-calc-summary-toggle {
      font-size: 0.68rem;
      padding: 0.1rem 0.42rem;
    }

    .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed.dmc-calc-summary-banner-down {
      transform: translate(0, -8px);
    }

    /* Share section */
    .dmc-calc-share-row {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
      align-items: center;
    }

    .dmc-calc-share-row button {
      white-space: nowrap;
    }

    .dmc-calc-share-row input[type="text"] {
      flex: 1 1 220px;
      min-width: 0;
      padding: 0.3rem 0.4rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 0.85rem;
    }

    .dmc-calc-share-status {
      font-size: 0.8rem;
      color: #555;
      margin-top: 0.3rem;
    }

    /* Buttons */
    .dmc-calc-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 4px;
      border: 1px solid #0074d9;
      background-color: #0074d9;
      color: #fff;
      padding: 0.35rem 0.7rem;
      font-size: 0.85rem;
      cursor: pointer;
    }

    .dmc-calc-button.dmc-calc-secondary {
      background-color: #f5f5f5;
      border-color: #ccc;
      color: #333;
    }

    .dmc-calc-button:disabled {
      opacity: 0.6;
      cursor: default;
    }

    /* Explanation details */
    .dmc-calc-explainer {
      font-size: 0.9rem;
    }

    .dmc-calc-explainer summary {
      cursor: pointer;
      font-weight: 600;
    }

    .dmc-calc-explainer p {
      margin-top: 0.4rem;
      margin-bottom: 0.4rem;
    }

    /* Small helpers */
    .dmc-calc-muted {
      color: #666;
      font-size: 0.8rem;
    }

    .dmc-calc-warning {
      color: #a33;
      font-size: 0.85rem;
      margin-top: 0.45rem;
    }

    .dmc-calc-align-right {
      text-align: right;
    }

    .dmc-calc-collapsible {
      border: 1px solid #e0e0e0;
      border-radius: 6px;
      padding: 0.4rem 0.75rem 0.75rem 0.75rem;
      background: linear-gradient(180deg, #fafafa 0%, #fdfdfd 100%);
    }

    .dmc-calc-collapsible summary {
      cursor: pointer;
      list-style: none;
    }

    .dmc-calc-collapsible summary::-webkit-details-marker {
      display: none;
    }

    .dmc-calc-collapsible summary h2 {
      display: inline-block;
      margin: 0 0 0.35rem 0;
    }

    .dmc-calc-chem-curve {
      margin-top: 1.25rem;
      padding: 1rem;
      border: 1px solid #ddd;
      border-radius: 8px;
      background: linear-gradient(180deg, #fcfcfc 0%, #f5f6fa 100%);
    }

    .dmc-calc-chem-curve-header {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: flex-end;
      gap: 0.5rem;
    }

    .dmc-calc-chem-curve-header h3 {
      margin: 0;
      font-size: 1.05rem;
    }

    .dmc-calc-chem-curve canvas {
      display: block;
      width: 100%;
      height: 260px;
      min-height: 220px;
      margin-top: 0.75rem;
      border-radius: 4px;
      background-color: #fff;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
    }

    .dmc-calc-chem-curve-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 0.75rem;
      font-size: 0.85rem;
      color: #444;
    }

    .dmc-calc-chem-curve-note {
      margin-top: 0.4rem;
      font-size: 0.8rem;
      color: #666;
    }

    .dmc-calc-chem-curve-stats {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
      gap: 0.5rem 1rem;
      margin-top: 0.75rem;
      font-size: 0.85rem;
      color: #333;
    }

    .dmc-calc-chem-curve-stat-label {
      display: block;
      color: #666;
      font-size: 0.78rem;
      margin-bottom: 0.15rem;
    }

    .dmc-calc-chem-curve-stat-value {
      font-variant-numeric: tabular-nums;
    }

    @media (max-width: 640px) {
      .dmc-calc-root {
        margin: 1rem;
        padding: 1rem;
      }

      #dmc-blc-summary-banner-container {
        top: 90px;
      }

      .dmc-calc-summary-banner {
        width: calc(100% - 1.1rem);
        right: auto;
        bottom: auto;
        padding: 0.45rem 0.55rem 0.5rem 0.55rem;
        grid-template-columns: 1fr;
      }

      .dmc-calc-summary-banner-content {
        grid-template-columns: 1fr;
      }

      .dmc-calc-summary-banner-title {
        font-size: 0.68rem;
      }
      .dmc-calc-summary-banner.dmc-calc-summary-banner-collapsed {
        max-width: calc(100vw - 1rem);
      }
    }
.dmc-calc-section p code {
	padding: inherit;
	background-color: inherit;
	border-radius: inherit !important;
	color: inherit;
	font-size: inherit;
	box-decoration-break: inherit;
	-webkit-box-decoration-break: inherit;
}
  </style>
</head>
<body>
  <div id="battery-life-calculator" class="dmc-calc-root">
    <div id="dmc-blc-summary-banner-container">
      <div id="dmc-blc-summary-banner" class="dmc-calc-summary-banner" aria-label="Key results summary" data-collapsed="false">
        <div class="dmc-calc-summary-banner-head">
          <div class="dmc-calc-summary-banner-title">Final battery life estimate</div>
          <button type="button" id="dmc-blc-summary-toggle" class="dmc-calc-summary-toggle" aria-expanded="true" aria-controls="dmc-blc-summary-content">Collapse</button>
        </div>
        <div id="dmc-blc-summary-content" class="dmc-calc-summary-banner-content">
          <div class="dmc-calc-summary-pill dmc-calc-summary-pill-secondary">
            <span class="dmc-calc-summary-pill-label">Average power</span>
            <span class="dmc-calc-summary-pill-value" id="dmc-blc-summary-avg">&#8212; uW</span>
          </div>
          <div class="dmc-calc-summary-pill dmc-calc-summary-pill-secondary">
            <span class="dmc-calc-summary-pill-label">Usable pack energy</span>
            <span class="dmc-calc-summary-pill-value" id="dmc-blc-summary-energy">&#8212;</span>
          </div>
          <div class="dmc-calc-summary-pill dmc-calc-summary-pill-primary">
            <span class="dmc-calc-summary-pill-label">Life</span>
            <span class="dmc-calc-summary-pill-value" id="dmc-blc-summary-life">&#8212;</span>
          </div>
        </div>
      </div>
      </div>
    <header>
      <h2>Ultimate Online Battery Life Calculator for IoT, Embedded Systems, and Wearable Devices</h2>
      <p class="dmc-calc-subtitle">
        Explore battery life for embedded systems with multiple modes and power rails.
      </p>
    </header>

    <!-- Example configurations -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-examples-heading">
      <h2 id="dmc-blc-examples-heading">Example configurations</h2>
      <div class="dmc-calc-field">
        <span class="dmc-calc-unit">Each link reloads this page with that template.</span>
        <p class="dmc-calc-muted">Each example demonstrates a realistic device setup, so the diagram, mode rows, and results cards line up as a teachable reference. After loading one, tweak values to see how assumptions change the life estimate.</p>
        <label id="dmc-blc-example-links-label">Load an example template</label>
        <ul class="dmc-calc-example-links" aria-labelledby="dmc-blc-example-links-label">
          <li>
            <a id="dmc-blc-example-link-coin_tracker_direct" data-example-link="coin_tracker_direct" href="#">Coin-cell tracker (direct battery)</a>
            <p class="dmc-calc-example-blurb">A simple one-cell CR2032 design with no intermediate rails, so the block diagram shows Battery feeding each load directly. Use this to see how tiny idle current and very short, frequent BLE pulses combine, then compare with the rare long beeper event to understand which activity actually dominates life.</p>
          </li>
          <li>
            <a id="dmc-blc-example-link-aa_logger_buckboost" data-example-link="aa_logger_buckboost" href="#">2xAA remote logger (buck-boost)</a>
            <p class="dmc-calc-example-blurb">Two AA alkaline cells feed a 3V3 buck-boost rail in switching 2-point efficiency mode, so the diagram includes one converter stage between battery and loads. This example helps you inspect how light-load efficiency and converter overhead affect average power during long idle windows, short samples, and periodic radio uplink bursts.</p>
          </li>
          <li>
            <a id="dmc-blc-example-link-aaa_beacon_boost" data-example-link="aaa_beacon_boost" href="#">1xAAA sensor beacon (boost)</a>
            <p class="dmc-calc-example-blurb">A single AAA cell powers a 3V0 boost rail with 2-point efficiency, representing a common ultra-low-power beacon architecture. Look at the mode table to compare near-zero idle current, periodic sensing, and brief BLE transmit pulses, then check how boost efficiency at low current impacts the final battery-life estimate.</p>
          </li>
          <li>
            <a id="dmc-blc-example-link-lipo_wearable_multirail" data-example-link="lipo_wearable_multirail" href="#">LiPo wearable (multi-rail)</a>
            <p class="dmc-calc-example-blurb">This model uses a 1S LiPo pack with a 3V3 buck rail and cascaded 1V8 core plus 2V8 sensor rails, so the diagram demonstrates a realistic multi-rail wearable tree. Use it to see how cascaded conversion losses and mixed digital/radio/sensor activity shape average power across continuous sensing and bursty communication modes.</p>
          </li>
          <li>
            <a id="dmc-blc-example-link-smart_lock_motor_boost" data-example-link="smart_lock_motor_boost" href="#">LiPo smart lock (motor boost rail)</a>
            <p class="dmc-calc-example-blurb">A 1S LiPo supply drives low-power logic rails and a separate 5V boost rail for a high-current motor, which makes the block diagram and duty-cycle math more event-driven. This example is useful for learning how rare but heavy actuation pulses can outweigh long standby periods in total energy budget.</p>
          </li>
        </ul>
      </div>
    </section>

    <section class="dmc-calc-section" aria-labelledby="dmc-blc-project-heading">
      <h2 id="dmc-blc-project-heading">Project</h2>
      <div class="dmc-calc-battery-grid">
        <div class="dmc-calc-field">
          <label for="dmc-blc-project-name">Project / device name</label>
          <input id="dmc-blc-project-name" type="text" placeholder="Example: Soil sensor v2" />
          <span class="dmc-calc-unit">Optional, not used in calculations.</span>
        </div>
      </div>
      <div class="dmc-calc-share-row" style="margin-top:0.5rem;">
        <button type="button" id="dmc-blc-copy-link" class="dmc-calc-button" disabled aria-describedby="dmc-blc-share-status">
          Copy shareable link
        </button>
        <input
          id="dmc-blc-share-url"
          type="text"
          placeholder="Project name required to enable sharing."
          readonly
        />
      </div>
      <div id="dmc-blc-share-status" class="dmc-calc-share-status">
        Enter a project name to enable sharing.
      </div>
    </section>

<!-- Battery configuration -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-battery-heading">
      <h2 id="dmc-blc-battery-heading">Battery configuration</h2>
      <div class="dmc-calc-battery-grid">
        <div class="dmc-calc-field">
          <label for="dmc-blc-batt-chemistry">Battery chemistry</label>
          <select id="dmc-blc-batt-chemistry">
            <option value="">Generic flat (avg voltage)</option>
            <option value="generic_linear">Generic linear (min/max to 0 V)</option>
            <option value="alkaline">Alkaline (AA/AAA)</option>
            <option value="cr2032">Coin cell (CR2032)</option>
            <option value="liion">Li-ion (4.2-3.0 V)</option>
            <option value="lifepo4">LiFePO4 (3.6-2.5 V)</option>
            <option value="litc">Li-SOCl2 primary (3.6-2.5 V)</option>
          </select>
          <span class="dmc-calc-unit">Chemistry + min/max voltages control derating.</span>
        </div>

        <div class="dmc-calc-field">
          <label for="dmc-blc-num-cells">Number of cells (series)</label>
          <input id="dmc-blc-num-cells" type="number" min="1" step="1" />
          <span class="dmc-calc-unit">cells</span>
        </div>

        <div class="dmc-calc-field">
          <label for="dmc-blc-cell-capacity">Cell capacity</label>
          <input id="dmc-blc-cell-capacity" type="number" min="0" step="1" />
          <span class="dmc-calc-unit">mAh</span>
        </div>

        <div class="dmc-calc-field">
          <label for="dmc-blc-cell-voltage">Average cell voltage</label>
          <input id="dmc-blc-cell-voltage" type="number" min="0" step="0.0001" />
          <span class="dmc-calc-unit">V</span>
        </div>

        <div class="dmc-calc-field" data-chem-advanced>
          <label for="dmc-blc-batt-vmax">Cell max voltage (V)</label>
          <input id="dmc-blc-batt-vmax" type="number" min="0" step="0.01" />
          <span class="dmc-calc-unit">V/cell</span>
        </div>

        <div class="dmc-calc-field" data-chem-advanced>
          <label for="dmc-blc-batt-vmin">Cell min voltage (V)</label>
          <input id="dmc-blc-batt-vmin" type="number" min="0" step="0.01" />
          <span class="dmc-calc-unit">V/cell at cutoff</span>
        </div>
      </div>
      <p class="dmc-calc-muted">
        Pack energy is computed as: Pack_mWh = CellCapacity_mAh * AvgCellVoltage_V * NumCells.
      </p>
      <details open class="dmc-calc-collapsible" aria-labelledby="dmc-blc-chem-curve-summary">
        <summary><h2 id="dmc-blc-chem-curve-summary">Discharge curve &amp; pack stats</h2></summary>
        <div class="dmc-calc-chem-curve" aria-live="polite">
          <div class="dmc-calc-chem-curve-header">
            <div>
              <h3>Discharge curve preview</h3>
              <p class="dmc-calc-muted" style="margin: 0;">
                Normalized capacity (0% = fresh cell, 100% = fully discharged).
              </p>
            </div>
            <div class="dmc-calc-chem-curve-legend">
              <span id="dmc-blc-chem-curve-label">Select a chemistry to view its curve.</span>
              <span id="dmc-blc-chem-curve-stats"></span>
            </div>
          </div>
          <canvas
            id="dmc-blc-chem-curve"
            width="720"
            height="280"
            role="img"
            aria-label="Battery discharge curve visualization"
          ></canvas>
          <p id="dmc-blc-chem-curve-note" class="dmc-calc-chem-curve-note dmc-calc-muted"></p>
          <div class="dmc-calc-chem-curve-stats">
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Pack energy max (mWh / Wh)</span>
              <span id="dmc-blc-pack-energy-full" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Pack avg voltage</span>
              <span id="dmc-blc-pack-avg" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Pack max voltage</span>
              <span id="dmc-blc-pack-max" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Pack min voltage</span>
              <span id="dmc-blc-pack-min" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Pack energy usable (mWh / Wh)</span>
              <span id="dmc-blc-pack-energy" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
            <div>
              <span class="dmc-calc-chem-curve-stat-label">Usable capacity fraction</span>
              <span id="dmc-blc-pack-usable-fraction" class="dmc-calc-chem-curve-stat-value">&#8212;</span>
            </div>
          </div>
        </div>
      </details>
    </section>

    <!-- Rails definition -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-rails-heading">
      <details open class="dmc-calc-collapsible" aria-labelledby="dmc-blc-rails-heading">
        <summary><h2 id="dmc-blc-rails-heading">Power rails</h2></summary>
        <p class="dmc-calc-muted">
          Define each rail once, including its voltage, regulator model, and optional parent rail to
          model cascaded conversion. Use <strong>Switching (fixed)</strong> for a single efficiency point, <strong>Switching (2-point)</strong>
          for low/high efficiency versus current, and <strong>Linear (LDO)</strong> to enter quiescent current (Iq).
          Rails are treated as on by demand: Iq is applied only in modes where downstream load current is non-zero.
          The calculator also shows a nominal path efficiency back to the battery.
        </p>

        <div class="dmc-calc-table-wrapper">
          <table class="dmc-calc-table dmc-calc-rails-table" aria-describedby="dmc-blc-rails-heading">
            <thead>
              <tr>
                <th>Parent rail</th>
                <th>Rail name</th>
                <th>Volts</th>
                <th>Regulator</th>
                <th>Params</th>
                <th>Path Efficiency</th>
                <th>Notes</th>
                <th></th>
              </tr>
            </thead>
            <tbody id="dmc-blc-rails-tbody">
              <tr data-rail-row data-rail-id="battery">
                <td><select aria-label="Parent rail" data-rail-field="parent" disabled aria-disabled="true"><option value="">Battery (pack root)</option></select></td>
                <td><input type="text" value="Battery rail" aria-label="Rail name" readonly aria-readonly="true" data-rail-field="name" /></td>
                <td><input type="number" min="0" step="0.01" value="3.0" aria-label="Rail voltage" readonly aria-readonly="true" data-rail-field="voltage" /></td>
                <td>
                  <select id="eff-mode-battery" class="dmc-calc-rails-eff-mode-hidden" data-rail-field="eff-mode" aria-label="Regulator model" disabled aria-disabled="true">
                    <option value="switching-simple" selected></option>
                  </select>
                </td>
                <td class="dmc-calc-rails-eff-cell">
                  <span class="dmc-calc-muted">N/A</span>
                </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="Direct battery loads" aria-label="Rail notes" readonly aria-readonly="true" data-rail-field="notes" /></td>
                <td></td>
              </tr>
              <tr data-rail-row data-rail-id="sensor">
                <td><select aria-label="Parent rail" data-rail-field="parent"><option value="battery">Battery</option></select></td>
                <td><input type="text" value="Sensor rail" aria-label="Rail name" data-rail-field="name" /></td>
                <td><input type="number" min="0" step="0.01" aria-label="Rail voltage" data-rail-field="voltage" /></td>
                <td>
                  <select data-rail-field="eff-mode" aria-label="Regulator model">
                    <option value="switching-simple" selected>Switching (fixed eff.)</option>
                    <option value="switching-2pt">Switching (2-point eff.)</option>
                    <option value="linear">Linear (LDO)</option>
                  </select>
                </td>
                <td class="dmc-calc-rails-eff-cell">
                  <div class="dmc-calc-rails-eff-rows">
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-simple-only">
                      <input type="number" min="0" max="100" step="1" aria-label="Stage efficiency (%)" inputmode="numeric" data-rail-field="efficiency" />
                      <span>%</span>
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span class="dmc-calc-rails-eff-label">Low</span>
                      <input type="number" min="0" max="100" step="1" aria-label="Low current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-low-pct" />
                      <span>% @</span>
                      <input type="number" min="0" step="0.000001" aria-label="Low current point (mA)" placeholder="mA" data-rail-field="eff-low-current" />
                      <span>mA</span>
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span class="dmc-calc-rails-eff-label">High</span>
                      <input type="number" min="0" max="100" step="1" aria-label="High current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-high-pct" />
                      <span>% @</span>
                      <input type="number" min="0" step="0.000001" aria-label="High current point (mA)" placeholder="mA" data-rail-field="eff-high-current" />
                      <span>mA</span>
                    </div>
                  </div>
                </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="e.g., ADC, sensor bias" aria-label="Rail notes" data-rail-field="notes" /></td>
                <td>
                  <button type="button" class="dmc-calc-button dmc-calc-secondary" data-remove-rail disabled aria-label="Remove rail">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </td>
              </tr>
            <tr data-rail-row data-rail-id="transmitter">
              <td><select aria-label="Parent rail" data-rail-field="parent"><option value="battery">Battery</option></select></td>
              <td><input type="text" value="Transmitter rail" aria-label="Rail name" data-rail-field="name" /></td>
              <td><input type="number" min="0" step="0.01" aria-label="Rail voltage" data-rail-field="voltage" /></td>
              <td>
                <select data-rail-field="eff-mode" aria-label="Regulator model">
                  <option value="switching-simple" selected>Switching (fixed eff.)</option>
                  <option value="switching-2pt">Switching (2-point eff.)</option>
                  <option value="linear">Linear (LDO)</option>
                </select>
              </td>
              <td class="dmc-calc-rails-eff-cell">
                <div class="dmc-calc-rails-eff-rows">
                  <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-simple-only">
                    <input type="number" min="0" max="100" step="1" aria-label="Stage efficiency (%)" inputmode="numeric" data-rail-field="efficiency" />
                  </div>
                  <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                    <span>Low:</span>
                    <input type="number" min="0" max="100" step="1" aria-label="Low current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-low-pct" />
                    <span>@</span>
                    <input type="number" min="0" step="0.000001" aria-label="Low current point (mA)" placeholder="mA" data-rail-field="eff-low-current" />
                  </div>
                  <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                    <span>High:</span>
                    <input type="number" min="0" max="100" step="1" aria-label="High current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-high-pct" />
                    <span>@</span>
                    <input type="number" min="0" step="0.000001" aria-label="High current point (mA)" placeholder="mA" data-rail-field="eff-high-current" />
                  </div>
                </div>
              </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="e.g., PA boost" aria-label="Rail notes" data-rail-field="notes" /></td>
                <td>
                  <button type="button" class="dmc-calc-button dmc-calc-secondary" data-remove-rail aria-label="Remove rail">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </td>
              </tr>
              <tr data-rail-row data-rail-id="receiver">
                <td><select aria-label="Parent rail" data-rail-field="parent"><option value="battery">Battery</option></select></td>
                <td><input type="text" value="Receiver rail" aria-label="Rail name" data-rail-field="name" /></td>
                <td><input type="number" min="0" step="0.01" aria-label="Rail voltage" data-rail-field="voltage" /></td>
                <td>
                  <select data-rail-field="eff-mode" class="dmc-calc-rails-eff-mode" aria-label="Regulator model">
                    <option value="switching-simple" selected>Switching (fixed eff.)</option>
                    <option value="switching-2pt">Switching (2-point eff.)</option>
                    <option value="linear">Linear (LDO)</option>
                  </select>
                </td>
                <td class="dmc-calc-rails-eff-cell">
                  <div class="dmc-calc-rails-eff-rows">
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-simple-only">
                      <input type="number" min="0" max="100" step="1" aria-label="Stage efficiency (%)" inputmode="numeric" data-rail-field="efficiency" />
                      <span>%</span>
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>Low (% @ mA):</span>
                      <input type="number" min="0" max="100" step="1" aria-label="Low current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-low-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="Low current point (mA)" placeholder="mA" data-rail-field="eff-low-current" />
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>High (% @ mA):</span>
                      <input type="number" min="0" max="100" step="1" aria-label="High current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-high-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="High current point (mA)" placeholder="mA" data-rail-field="eff-high-current" />
                    </div>
                  </div>
                </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="e.g., LNA, RX path" aria-label="Rail notes" data-rail-field="notes" /></td>
                <td>
                  <button type="button" class="dmc-calc-button dmc-calc-secondary" data-remove-rail aria-label="Remove rail">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </td>
              </tr>
              <tr data-rail-row data-rail-id="core">
                <td><select aria-label="Parent rail" data-rail-field="parent"><option value="battery">Battery</option></select></td>
                <td><input type="text" value="Core rail" aria-label="Rail name" data-rail-field="name" /></td>
                <td><input type="number" min="0" step="0.01" aria-label="Rail voltage" data-rail-field="voltage" /></td>
                <td>
                  <select data-rail-field="eff-mode" class="dmc-calc-rails-eff-mode" aria-label="Regulator model">
                    <option value="switching-simple" selected>Switching (fixed eff.)</option>
                    <option value="switching-2pt">Switching (2-point eff.)</option>
                    <option value="linear">Linear (LDO)</option>
                  </select>
                </td>
                <td class="dmc-calc-rails-eff-cell">
                  <div class="dmc-calc-rails-eff-rows">
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-simple-only">
                      <input type="number" min="0" max="100" step="1" aria-label="Stage efficiency (%)" inputmode="numeric" data-rail-field="efficiency" />
                      <span>%</span>
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>Low:</span>
                      <input type="number" min="0" max="100" step="1" aria-label="Low current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-low-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="Low current point (mA)" placeholder="mA" data-rail-field="eff-low-current" />
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>High:</span>
                      <input type="number" min="0" max="100" step="1" aria-label="High current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-high-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="High current point (mA)" placeholder="mA" data-rail-field="eff-high-current" />
                    </div>
                  </div>
                </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="e.g., MCU core" aria-label="Rail notes" data-rail-field="notes" /></td>
                <td>
                  <button type="button" class="dmc-calc-button dmc-calc-secondary" data-remove-rail aria-label="Remove rail">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </td>
              </tr>
              <tr data-rail-row data-rail-id="aux">
                <td><select aria-label="Parent rail" data-rail-field="parent"><option value="battery">Battery</option></select></td>
                <td><input type="text" value="Aux rail" aria-label="Rail name" data-rail-field="name" /></td>
                <td><input type="number" min="0" step="0.01" aria-label="Rail voltage" data-rail-field="voltage" /></td>
                <td>
                  <select data-rail-field="eff-mode" class="dmc-calc-rails-eff-mode" aria-label="Regulator model">
                    <option value="switching-simple" selected>Switching (fixed eff.)</option>
                    <option value="switching-2pt">Switching (2-point eff.)</option>
                    <option value="linear">Linear (LDO)</option>
                  </select>
                </td>
                <td class="dmc-calc-rails-eff-cell">
                  <div class="dmc-calc-rails-eff-rows">
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-simple-only">
                      <input type="number" min="0" max="100" step="1" aria-label="Stage efficiency (%)" inputmode="numeric" data-rail-field="efficiency" />
                      <span>%</span>
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>Low:</span>
                      <input type="number" min="0" max="100" step="1" aria-label="Low current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-low-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="Low current point (mA)" placeholder="mA" data-rail-field="eff-low-current" />
                    </div>
                    <div class="dmc-calc-rails-eff-row dmc-calc-rails-eff-adv" style="display: none;">
                      <span>High:</span>
                      <input type="number" min="0" max="100" step="1" aria-label="High current efficiency (%)" inputmode="numeric" placeholder="%" data-rail-field="eff-high-pct" />
                      <span>@</span>
                      <input type="number" min="0" step="0.000001" aria-label="High current point (mA)" placeholder="mA" data-rail-field="eff-high-current" />
                    </div>
                  </div>
                </td>
                <td><span data-rail-effective>&#8212; %</span></td>
                <td><input type="text" placeholder="e.g., LEDs, misc" aria-label="Rail notes" data-rail-field="notes" /></td>
                <td>
                  <button type="button" class="dmc-calc-button dmc-calc-secondary" data-remove-rail aria-label="Remove rail">
                    <span aria-hidden="true">&times;</span>
                  </button>
                </td>
              </tr>
            </tbody>
          </table>
        </div>

        <div class="dmc-calc-modes-actions">
          <button type="button" id="dmc-blc-add-rail" class="dmc-calc-button">
            Add rail
          </button>
          <span class="dmc-calc-muted">
            Enter voltage and regulator parameters per rail so the calculator can translate per-mode currents into battery power.
          </span>
        </div>
      </details>
    </section>

    <!-- Loads definition -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-loads-heading">
      <details open class="dmc-calc-collapsible" aria-labelledby="dmc-blc-loads-heading">
        <summary><h2 id="dmc-blc-loads-heading">Loads (peripherals)</h2></summary>
        <p class="dmc-calc-muted">
          Define generic loads such as MCU, sensor, transmitter, or receiver. Each load is powered from one of the
          rails above and appears as a column in the modes table.
        </p>

        <div class="dmc-calc-table-wrapper">
        <table class="dmc-calc-table dmc-calc-loads-table" aria-describedby="dmc-blc-loads-heading">
          <thead>
            <tr>
              <th>Load name</th>
              <th>Rail</th>
              <th>Notes</th>
                <th></th>
              </tr>
            </thead>
            <tbody id="dmc-blc-loads-tbody">
              <!-- Initial loads are seeded from rails in JavaScript -->
            </tbody>
          </table>
        </div>

        <div class="dmc-calc-modes-actions">
          <button type="button" id="dmc-blc-add-load" class="dmc-calc-button">
            Add load
          </button>
          <span class="dmc-calc-muted">
          Loads inherit voltage and cascaded efficiency from their rail; change the rail to move a load between rails.
          </span>
        </div>
      </details>
    </section>

    <section class="dmc-calc-section" aria-labelledby="dmc-blc-topology-heading">
      <details open class="dmc-calc-collapsible" aria-labelledby="dmc-blc-topology-heading">
        <summary><h2 id="dmc-blc-topology-heading">Block diagram</h2></summary>
        <div class="dmc-calc-topology">
          <svg id="dmc-blc-topology-svg" role="img" aria-label="Power rails and loads topology"></svg>
          <p class="dmc-calc-muted" style="margin-top: 0.4rem;">
            Diagram auto-generates from your rails (columns) and loads (final column). Parent rails feed child rails and loads.
          </p>
        </div>
      </details>
    </section>

    <!-- Modes and loads -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-modes-heading">
      <details open class="dmc-calc-collapsible" aria-labelledby="dmc-blc-modes-heading">
        <summary><h2 id="dmc-blc-modes-heading">Modes, timing, and load currents</h2></summary>
        <p class="dmc-calc-muted">
          The <strong>first row (Idle)</strong> is always on and fills any time not used by other modes.
          Add additional modes such as Sensor sample, Transmitter burst, and Receiver listen by clicking &#8220;Add mode&#8221; below.
          Each mode specifies a current for each load during its active time; loads inherit voltage and efficiency from their rails above.
        </p>

      <div class="dmc-calc-table-wrapper">
        <table class="dmc-calc-table dmc-calc-modes-table" aria-describedby="dmc-blc-modes-heading">
          <thead id="dmc-blc-modes-thead"></thead>
          <tbody id="dmc-blc-modes-tbody"></tbody>
        </table>
      </div>

      <div class="dmc-calc-modes-actions">
        <button type="button" id="dmc-blc-add-mode" class="dmc-calc-button">
          Add mode
        </button>
        <span class="dmc-calc-muted">
          Modes share a single comparison period based on the longest configured period.
        </span>
      </div>
      <div id="dmc-blc-timing-warning" class="dmc-calc-warning" style="display:none;" role="status" aria-live="polite"></div>
      </details>
    </section>

    <!-- Results -->
    <section class="dmc-calc-section" aria-labelledby="dmc-blc-results-heading">
      <h2 id="dmc-blc-results-heading">Results</h2>
      <div class="dmc-calc-results-grid">
        <div class="dmc-calc-card">
          <h3>Average power</h3>
          <div class="dmc-calc-card-value" id="dmc-blc-avg-power-total">&#8212; uW</div>
          <div class="dmc-calc-card-sub">Time-weighted average across all modes.</div>
        </div>

        <div class="dmc-calc-card">
          <h3>Battery life (hours)</h3>
          <div class="dmc-calc-card-value" id="dmc-blc-life-hours">&#8212; h</div>
          <div class="dmc-calc-card-sub">Based on pack energy and average power.</div>
        </div>

        <div class="dmc-calc-card">
          <h3>Battery life (days / years)</h3>
          <div class="dmc-calc-card-value">
            <span id="dmc-blc-life-days">&#8212; days</span>,
            <span id="dmc-blc-life-years">&#8212; years</span>
          </div>
          <div class="dmc-calc-card-sub">Converted from hours for convenience.</div>
        </div>
      </div>
      <p class="dmc-calc-muted">
        Mode duty, average power, and contribution are shown per row in the modes table above. The chart
        below visualizes how much each mode contributes to the overall average power.
      </p>
      <div class="dmc-calc-mode-bars" aria-label="Mode contribution breakdown">
        <h3>Mode contributions</h3>
        <div id="dmc-blc-mode-bars-body" class="dmc-calc-mode-bars-body">
          <div class="dmc-calc-muted">
            Enter timing and currents above to see how each mode contributes to the total average power.
          </div>
        </div>
      </div>
    </section>

    <script id="dmc-blc-debug-payload" type="application/json" hidden></script>

<!-- Explanation -->
    <section class="dmc-calc-section">
      <div class="dmc-calc-explainer">
        <h2>How this calculator works (conceptually)</h2>
        <p><strong>Big picture</strong>: this is an estimator, not a simulator. It gives a defensible, first-order answer for &#8220;how long will my thing run?&#8221; and teaches how duty cycle, rails, and efficiency play together. Measure on hardware once you have a prototype.</p>
        <div class="dmc-calc-concepts-grid" style="margin-top:0.5rem;">
          <div class="dmc-calc-concept-card">
            <p class="dmc-calc-concept-name">1. Pack energy</p>
            <p class="dmc-calc-concept-detail">
              <em>Energy bucket</em> The model converts battery specs into one budget number:
              <code>Pack_mWh = CellCapacity_mAh * AvgCellVoltage_V * NumCells</code>. This is the full bucket before cutoff and
              chemistry derating.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>How usable energy is estimated</em> For named chemistries with valid min/max cell voltage, the model applies a
              chemistry profile to compute a usable fraction and then uses
              <code>UsablePackEnergy_mWh = Pack_mWh * usable_capacity_fraction</code>. If chemistry or cutoff data is missing, it
              falls back to <code>usable_capacity_fraction = 1</code> instead of guessing.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Philosophy</em> This is a first-order planning model, not an electrochemical simulator. We intentionally keep one
              average-voltage energy bucket so design tradeoffs are easy to compare and assumptions stay visible.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Example</em> Two 2500 mAh alkaline cells at 1.3 V average give
              <code>Pack_mWh = 2500 * 1.3 * 2 = 6500 mWh</code>. If cutoff/chemistry gives
              <code>usable_capacity_fraction = 0.8</code>, usable energy is <code>5200 mWh</code>.
            </p>
          </div>

          <div class="dmc-calc-concept-card">
            <p class="dmc-calc-concept-name">2. Duty cycle</p>
            <p class="dmc-calc-concept-detail">
              Comparison window = longest non-idle period. Duty = <code>active_ms / (period_s * 1000)</code>. Idle duty is
              whatever time remains after non-idle modes.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Example</em> If a sensor sample runs for 250 ms every 60 s, then
              <code>Duty_sample = 250 / 60000 = 0.00417 = 0.417%</code>. If uplink runs 1200 ms every 900 s, then
              <code>Duty_uplink = 1200 / 900000 = 0.133%</code>. Idle gets the remaining time.
            </p>
          </div>

          <div class="dmc-calc-concept-card">
            <p class="dmc-calc-concept-name">3. Rail efficiency</p>
            <p class="dmc-calc-concept-detail">
              <em>Switching (fixed)</em> means one fixed efficiency for that rail: <code>efficiency = eff_pct / 100</code>. If you enter 90%,
              the model assumes about 10% of converter input power is lost as heat at all loads. <em>Switching (2-point)</em> means you enter two
              points from the regulator datasheet <em>Efficiency vs Output Current</em> graph at your expected VIN/VOUT:
              <code>(I_low, Eff_low)</code> and <code>(I_high, Eff_high)</code>. Below <code>I_low</code> the model uses
              <code>Eff_low</code>, above <code>I_high</code> it uses <code>Eff_high</code>, and between them it interpolates in
              log(current) so light-load and heavy-load behavior are both represented. Some datasheets use the Greek symbol
              <code>&eta;</code> for efficiency. <em>Linear (LDO)</em> uses <code>VIN/VOUT</code> behavior plus quiescent current:
              <code>P_in = V_in * (I_out + I_q)</code>.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Why it matters</em> Efficiency loss becomes heat, and that heat comes from your battery budget. A converter that
              is 90% efficient needs about 11% more input power than the load uses. At low currents, many converters get worse, so
              sleep-heavy products can lose more life than expected if you use one optimistic efficiency number.
            </p>
            <div class="dmc-calc-2pt-demo" role="img" aria-label="Two-point efficiency behavior with logarithmic current response">
              <svg viewBox="0 0 300 122" preserveAspectRatio="xMidYMid meet" aria-hidden="true">
                <rect x="0" y="0" width="300" height="122" fill="#ffffff"></rect>
                <line x1="34" y1="16" x2="34" y2="94" stroke="#c9cfdb" stroke-width="1"></line>
                <line x1="34" y1="94" x2="286" y2="94" stroke="#c9cfdb" stroke-width="1"></line>
                <line x1="78" y1="16" x2="78" y2="94" stroke="#e1e6f0" stroke-width="1"></line>
                <line x1="144" y1="16" x2="144" y2="94" stroke="#e1e6f0" stroke-width="1"></line>
                <line x1="212" y1="16" x2="212" y2="94" stroke="#e1e6f0" stroke-width="1"></line>
                <path d="M42 77 C58 77, 67 77, 74 76 C94 72, 116 61, 136 50 C164 37, 192 32, 220 31 C246 31, 265 31, 278 31" fill="none" stroke="#0057b8" stroke-width="2.4"></path>
                <circle cx="74" cy="76" r="4" fill="#0057b8"></circle>
                <circle cx="220" cy="31" r="4" fill="#0057b8"></circle>
                <line x1="74" y1="16" x2="74" y2="94" stroke="#8a94a8" stroke-dasharray="4 3" stroke-width="1"></line>
                <line x1="220" y1="16" x2="220" y2="94" stroke="#8a94a8" stroke-dasharray="4 3" stroke-width="1"></line>
                <text x="54" y="107" font-size="10.5" fill="#4a4a4a">Low current</text>
                <text x="198" y="107" font-size="10.5" fill="#4a4a4a">High current</text>
                <text x="8" y="23" font-size="10" fill="#666">Efficiency (%)</text>
                <text x="204" y="118" font-size="10" fill="#666">Current (mA, log-like)</text>
              </svg>
            </div>
          </div>

          <div class="dmc-calc-concept-card">
            <p class="dmc-calc-concept-name">4. Power per mode</p>
            <p class="dmc-calc-concept-detail">
              <em>Path efficiency</em> Multiply stage efficiencies up the parent chain to get <code>PathEfficiency</code>.
              <em>Per load</em> compute rail power with
              <code>RailPower_uW = RailVoltage_V * LoadCurrent_mA * 1000</code>; battery-side power is
              <code>BatteryPower_uW = RailPower_uW / PathEfficiency</code>. <em>Per mode</em> sum battery-side load powers:
              <code>ModePower_uW = sum(BatteryPower_uW)</code>.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Why it matters</em> Cascaded regulators stack losses. If one stage is 90% and the next is 90%, the path is
              <code>0.9 * 0.9 = 0.81</code>, so only 81% of battery power reaches the load. This is why “just add another rail”
              can reduce battery life more than expected.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Analogy</em> Think of power as water moved through hoses. Each regulator is a hose section with a leak. One small
              leak might be fine, but several leaks in series mean much less water reaches the plant at the end.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Example</em> A 3.3 V rail load at 2 mA is <code>3.3 * 2 * 1000 = 6600 uW</code>. If regulator path efficiency
              is 85%, battery-side power is <code>6600 / 0.85 = 7765 uW</code>.
            </p>
          </div>

          <div class="dmc-calc-concept-card">
            <p class="dmc-calc-concept-name">5. Time weighting &amp; life</p>
            <p class="dmc-calc-concept-detail">
              <em>Weighting</em> <code>ModeAveragePower_uW = ModePower_uW * DutyFraction</code>; total
              <code>TotalAveragePower_uW = sum(ModeAveragePower_uW)</code>. <em>Life</em>
              <code>Life_h = UsablePackEnergy_mWh * 1000 / TotalAveragePower_uW</code>; UI also shows days/years.
            </p>
            <p class="dmc-calc-concept-detail">
              <em>Example</em> If sleep is 100 uW at 99% duty and active is 50,000 uW at 1% duty, then
              <code>TotalAveragePower_uW = (100 * 0.99) + (50000 * 0.01) = 599 uW</code>. With 6000 mWh usable energy,
              <code>Life_h = 6000 * 1000 / 599 = 10017 h</code> (about 417 days).
            </p>
          </div>
        </div>
<div class="dmc-calc-concepts-grid">
        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Battery chemistry &amp; capacity</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            The chemistry (alkaline, Li-ion, coin cell, etc.) sets the usable voltage range and how the cell behaves as it discharges.
            Capacity (mAh) tells you how much charge the battery can deliver at a gentle load.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            The same device can run for weeks on a tiny coin cell or years on a larger primary lithium pack. Chemistry also affects
            self‑discharge, low‑temperature behavior, and how much of the cell’s capacity is usable at higher currents.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Pick a chemistry that roughly matches your cell type. Use datasheet or application‑note values for capacity and voltage.
            Remember this tool assumes “average” voltage; it does not simulate detailed discharge curves.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            For long life, bigger is not always better. A slightly larger cell that lets your converter operate in a sweet spot
            (good efficiency, enough headroom) often buys more life than just stacking cells at random.
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Pack voltage &amp; rails</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            Pack voltage is the battery side. Rails are the local supply voltages your circuits actually use (3.3 V digital, 5 V sensor
            bias, 1.8 V core, and so on). Regulators connect the pack to each rail.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            Every time you convert from the pack to a rail you lose some power in the regulator. Cascaded rails multiply those losses.
            A “simple” rail with 90% efficiency wastes 10% of its input power as heat.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Define one row per regulated rail. Use <strong>Switching (fixed eff.)</strong> when you only know one converter efficiency,
            <strong>Switching (2-point eff.)</strong> when data sheets give light-load and heavy-load points, and
            <strong>Linear (LDO)</strong> when you know VIN, VOUT, and quiescent current (Iq).
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            Avoid unnecessary rails and unnecessary cascades. For example, powering a low‑current MCU from a linear regulator off a
            switching pre‑regulator can be fine, but putting a linear on top of another linear wastes a lot of energy.
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">2-point efficiency model</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            Real DC‑DC converters are not flat. They are usually less efficient at very light load, peak somewhere in the middle,
            and droop again near the current limit. Measuring or estimating the full curve is hard.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            Many IoT devices spend most of their life sipping microamps, then wake up to tens of milliamps briefly. A single
            “typical” efficiency value hides how different those regimes are.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Enter a “Low” point (efficiency and current) and a “High” point. The calculator interpolates between them on a log
            current axis so you get a reasonable effective efficiency for each mode’s load current without a full curve.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            When choosing converters, pay attention to efficiency near your dominant operating currents, not just the headline peak.
            A part that is fantastic at 500 mA but poor at 10 µA may be the wrong choice for a sleepy sensor node.
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Modes &amp; duty cycle</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            A mode is a named behavior: “Idle,” “Sense,” “Transmit,” “OTA update,” and so on. Each mode has a period (how often it
            happens) and an active time (how long it lasts when it happens).
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            Average power is dominated by the product of power and duty cycle. A very expensive‑looking transmit burst that happens
            for 2 ms once per minute can cost less energy than a “tiny” background current that flows all the time.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Enter realistic periods and active times for each behavior. You can select timing units per row
            (ms, s, m, h, d), and the duty column is computed for you from the effective values.
            OTA‑style events can be modeled with long periods (hours, days, months) and finite active times.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            Design your firmware so that the system spends most of its life in the lowest‑power mode possible. Shorten active time,
            reduce how often expensive modes run, and move work into batch operations instead of frequent small bursts.
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Idle mode &amp; background current</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            “Idle” is the mode where nothing interesting happens: MCU in sleep, radios off, only keep‑alive circuits running.
            The calculator treats idle specially and fills any time that is not used by other modes.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            In many IoT designs, idle dominates energy use. Shaving microamps off idle current can extend life more than tweaking
            a high‑power burst that only happens occasionally.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            The first mode row is fixed as Idle and cannot be removed. Put your sleep/background currents in that row;
            its timing is auto-computed as whatever time remains after non-idle modes.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            Turn off unneeded clocks and peripherals, use deep‑sleep states where possible, and make sure regulators are still
            efficient at your idle currents. Datasheet “off currents” for sensors and radios are often surprisingly high.
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Loads &amp; current estimates</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            Loads are the things that draw current on each rail: MCU, radio, sensor front‑end, LEDs, USB, buzzers, and so on. Each
            load can be active or mostly off depending on the mode.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            Mode current is rarely just “one number.” Splitting by load lets you see which pieces dominate energy use, and how
            moving a load to a different rail or changing hardware affects the whole system.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Create a load per major block and assign it to a rail. For each mode, enter the current that block draws while the
            mode is active. Use data sheets, evaluation boards, or quick bench measurements as a starting point.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to optimize</em>
            Look for loads that are on in many modes but do not always need to be. Can a sensor be duty‑cycled? Can LEDs flash more
            briefly? Can a radio use a lower TX power in some modes?
          </p>
        </div>

        <div class="dmc-calc-concept-card">
          <p class="dmc-calc-concept-name">Estimator vs. real hardware</p>
          <p class="dmc-calc-concept-detail">
            <em>What it is</em>
            A structured way to do the back‑of‑the‑envelope math you would otherwise keep in a spreadsheet or notebook. It does not
            know about temperature, aging, or detailed battery curves.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>Why it matters</em>
            The goal is to be “right enough” to compare designs and guide experiments: choose between chemistries, rail topologies,
            firmware strategies, and component options before you build hardware.
          </p>
          <p class="dmc-calc-concept-detail">
            <em>How to use it here</em>
            Explore “what if?” questions: What if the radio wakes up twice as often? What if I change the sensor regulator from an
            LDO to a buck? How much life do I lose if my idle current doubles?
          </p>
          <p class="dmc-calc-concept-detail">
            <em>What to verify</em>
            Once you have a prototype, measure currents for each mode and update the model. If estimates and measurements disagree
            by a lot, that is a great learning opportunity—look for missing loads, sleep bugs, and efficiency assumptions.
          </p>
        </div>
      </div>
    </section>
  </div>



<div class="wp-block-group alignwide has-custom-light-blue-background-color has-background is-layout-flow wp-container-core-group-is-layout-dbd34961 wp-block-group-is-layout-flow" style="border-radius:20px;margin-top:var(--wp--preset--spacing--50);margin-bottom:var(--wp--preset--spacing--50);padding-top:var(--wp--preset--spacing--50);padding-right:0;padding-bottom:var(--wp--preset--spacing--50);padding-left:0">
<div class="wp-block-columns alignwide are-vertically-aligned-center is-layout-flex wp-container-core-columns-is-layout-43efaee5 wp-block-columns-is-layout-flex" style="padding-right:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)">
<div class="wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:85%">
<h3 class="wp-block-heading has-text-align-left" id="h-have-an-upcoming-project-dmc-can-help-you-take-the-next-step"><strong>Ready to Maximize Battery Performance?</strong> See How DMC Can Get You Started.</h3>



<p class="has-text-align-left wp-block-paragraph" id="h-need-help-turning-ideas-into-outcomes-automation-project-to-the-next-level-contact-us-today-to-learn-more-about-our-solutions-and-how-we-can-help-you-achieve-your-goals">DMC can help optimize battery-powered products with system design. Learn more about how our <a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming/" data-type="page" data-id="431">Embedded</a> team can help with your battery functions.</p>
</div>



<div class="wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow" style="flex-basis:15%">
<div class="wp-block-buttons is-horizontal is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-2236275c wp-block-buttons-is-layout-flex">
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-base-contrast-color has-text-color has-link-color wp-element-button" href="https://static.dmcinfo.com/contact/">Contact Us</a></div>
</div>
</div>
</div>
</div>
<p>The post <a href="https://static.dmcinfo.com/blog/41922/battery-life-calculator/">Battery Life Calculator</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>MOSFET Power Loss Calculator</title>
		<link>https://static.dmcinfo.com/blog/17021/mosfet-power-loss-calculator/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Mon, 27 Nov 2023 09:10:29 +0000</pubDate>
				<category><![CDATA[Circuit Design]]></category>
		<category><![CDATA[Embedded Development & Programming]]></category>
		<category><![CDATA[Low-Power Embedded Design]]></category>
		<category><![CDATA[MOSFET]]></category>
		<category><![CDATA[online calculator]]></category>
		<category><![CDATA[Power Dissipation]]></category>
		<category><![CDATA[Power loss]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/17021/mosfet-power-loss-calculator/</guid>

					<description><![CDATA[<p>Online MOSFET Power Loss/Dissipation Calculator and Guide for Engineers In the world of power electronics, understanding and minimizing power losses in Metal-Oxide-Semiconductor Field-Effect Transistors (MOSFETs) is crucial for optimizing efficiency and performance. This guide explains the basics of calculating various types of power losses in MOSFETs, including conduction, switching, reverse recovery, deadtime, and gate charge [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/17021/mosfet-power-loss-calculator/">MOSFET Power Loss Calculator</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<style>
    table input[type="number"],
    table select,
    table input[type="text"] {
      font-size: 14px;
      padding: 4px 6px;
      min-width: 90px;
    }
    #share-tools {
      margin: 12px 0 20px 0;
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }
    #project_name,
    #share_button,
    #share_link {
      font-size: 14px;
      padding: 4px 6px;
      height: 28px;
      box-sizing: border-box;
    }
    #project_name {
      min-width: 240px;
    }
    #share_link {
      flex: 1 1 260px;
      min-width: 260px;
      max-width: 520px;
    }
    #project-name-row {
      margin: 8px 0 12px 0;
      display: flex;
      gap: 8px;
      align-items: center;
      flex-wrap: wrap;
    }
    #loss-bar-container {
      margin: 14px 0 6px 0;
      width: 100%;
      max-width: 1100px;
    }
    #loss-bar {
      display: flex;
      height: 20px;
      border: 1px solid #ccc;
      border-radius: 4px;
      overflow: hidden;
      background: #f5f5f5;
    }
    .loss-segment {
      height: 100%;
      min-width: 0;
    }
    #loss-legend {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 16px;
      margin-top: 6px;
      font-size: 12px;
    }
    .loss-legend-item {
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .loss-swatch {
      width: 12px;
      height: 12px;
      border-radius: 2px;
      display: inline-block;
    }
    #thermal-container {
      margin: 18px 0 10px 0;
      width: 100%;
    }
    #thermal-table {
      border: 1px solid #ccc;
      border-collapse: collapse;
      width: 100%;
    }
    #thermal-table th,
    #thermal-table td {
      border: 1px solid #ccc;
      padding: 6px;
      text-align: left;
      vertical-align: middle;
    }
    #thermal-table input,
    #thermal-table select {
      padding: 4px 6px;
      font-size: 14px;
      min-width: 90px;
    }
    #thermal-table .help {
      font-size: 14px;
      color: #444;
    }
    #thermal-status {
      font-weight: 600;
    }
    #main-table,
    #thermal-table {
      width: 100%;
      box-sizing: border-box;
    }
    /* Keep main and thermal tables aligned */
    col.col-param { width: 22%; }
    col.col-value { width: 22%; }
    col.col-units { width: 15%; }
    /* Consistent cell styling across both tables */
    #main-table th,
    #main-table td,
    #thermal-table th,
    #thermal-table td {
      padding: 6px;
      text-align: left;
      vertical-align: middle;
      border: 1px solid #ccc;
      font-size: 18px;
      font-family: inherit;
    }
    /* Definition blocks as cards */
    .param-block {
      margin: 12px 0;
      padding: 12px 16px;
      border: 1px solid #ddd;
      border-radius: 20px;
      background: #fafafa;
    }
    /* Parameter name at the top of each card */
    .param-name {
      margin: 0 0 6px 0;
      font-weight: 600;
      font-size: 15px;
    }
    /* A row: label on left, text on right */
    .param-detail {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      margin: 6px 0;
      font-size: 16px;
      line-height: 1.5;
    }
    /* Left column: fixed width, bold label */
    .param-detail em {
      font-style: normal;
      font-weight: 600;
      color: #333;
      flex: 0 0 130px;
      text-align: right;
    }
    /* Right column: fill remaining width */
    .param-detail span {
      flex: 1;
    }
    /* Calculation blocks styled similarly to cards */
    .calculation-block {
      margin: 16px 0;
      padding: 12px 16px;
      border: 1px solid #ddd;
      border-radius: 20px;
      background: #fdfdfd;
    }
    .calculation-block h4 {
      margin-top: 0;
      margin-bottom: 8px;
    }
    .formula {
      display: inline-block;
      margin: 4px 0;
      padding: 4px 8px;
      font-weight: 600;
      font-family: Consolas, "Courier New", monospace;
      font-size: 14px;
      border-radius: 3px;
      background: #f3f3f3;
    }
    /* Consistent heading spacing in definitions section */
    h3.wp-block-heading {
      margin-top: 24px;
      margin-bottom: 8px;
    }
    h4.wp-block-heading {
      font-size: 16px;
      margin-top: 0;
      margin-bottom: 6px;
    }
    @media (max-width: 600px) {
      table input[type="number"],
      table select,
      table input[type="text"] {
        font-size: 8px;
        padding: 2px 4px;
        min-width: 40px;
      }
      #main-table th,
        #main-table td,
        #thermal-table th,
        #thermal-table td {
          padding: 4px;
          font-size: 8px;
        }
        #thermal-table .help {
          font-size: 8px;
        }
        #thermal-table input, #thermal-table select {
          padding: 2px 4px;
          font-size: 8px;
          min-width: 40px;
        }
    }
  </style>
<div id="calc-container">
<h2 class="wp-block-heading">Online MOSFET Power Loss/Dissipation Calculator and Guide for Engineers</h2>

<p>In the world of power electronics, understanding and minimizing power losses in Metal-Oxide-Semiconductor Field-Effect Transistors (MOSFETs) is crucial for optimizing efficiency and performance. This guide explains the basics of calculating various types of power losses in MOSFETs, including conduction, switching, reverse recovery, deadtime, and gate charge losses.</p>

<h3 class="wp-block-heading">MOSFET Power Loss Calculator <span id="share_status" style="margin-left: 8px; font-size: 0.9em; color: #555;"></span></h3>
<div class="calc-inner">
<div id="project-name-row">
  <label for="project_name"><strong>Project Name:</strong></label>
  <input id="project_name" oninput="handleProjectNameInput()" type="text" maxlength="30" placeholder="Required for sharing" />
  <button id="share_button" type="button" onclick="copyShareLink()" disabled>Copy shareable link</button>
  <input aria-label="Shareable link" id="share_link" readonly type="text" style="flex:1 1 260px; max-width: 520px;" />
</div>
<div id="loss-bar-container">
  <div><strong>Power Loss Breakdown (largest to smallest)</strong></div>
  <div id="loss-bar">
    <div id="seg_cond" class="loss-segment" style="background:#d62728; width: 16.6%;"></div>
    <div id="seg_sw" class="loss-segment" style="background:#ff7f0e; width: 16.6%;"></div>
    <div id="seg_rr" class="loss-segment" style="background:#f2c94c; width: 16.6%;"></div>
    <div id="seg_dt" class="loss-segment" style="background:#2ca02c; width: 16.6%;"></div>
    <div id="seg_gate" class="loss-segment" style="background:#17becf; width: 16.6%;"></div>
    <div id="seg_coss" class="loss-segment" style="background:#1f77b4; width: 16.6%;"></div>
  </div>
  <div id="loss-legend">
    <span id="legend_cond" class="loss-legend-item"><span class="loss-swatch" style="background:#d62728;"></span><span class="loss-label-text">Conduction</span></span>
    <span id="legend_sw" class="loss-legend-item"><span class="loss-swatch" style="background:#ff7f0e;"></span><span class="loss-label-text">Switching</span></span>
    <span id="legend_rr" class="loss-legend-item"><span class="loss-swatch" style="background:#f2c94c;"></span><span class="loss-label-text">Reverse Recovery</span></span>
    <span id="legend_dt" class="loss-legend-item"><span class="loss-swatch" style="background:#2ca02c;"></span><span class="loss-label-text">Deadtime</span></span>
    <span id="legend_gate" class="loss-legend-item"><span class="loss-swatch" style="background:#17becf;"></span><span class="loss-label-text">Gate Charge</span></span>
    <span id="legend_coss" class="loss-legend-item"><span class="loss-swatch" style="background:#1f77b4;"></span><span class="loss-label-text">Output Capacitance</span></span>
  </div>
</div>
</div>
<!-- Table with input fields and loss calculations -->
  <table id="main-table" border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse: collapse; width: 100%;">
  <colgroup>
    <col class="col-param">
    <col class="col-value">
    <col class="col-units">
    <col>
  </colgroup>
  <tbody>
    <tr>
    <th style="text-align: left"><strong>Parameter</strong></th>
    <th style="text-align: left"><strong>Value</strong></th>
    <th style="text-align: left"><strong>Units</strong></th>
    <th style="text-align: left"><strong>Description</strong></th>
    </tr>
    <tr>
    <td>Vbus</td>
    <td><input id="v_bus" onchange="calculateLosses()" type="number" value="24" /></td>
    <td>Volts</td>
    <td>Bus voltage</td>
    </tr>
    <tr>
    <td>Current</td>
    <td><input id="current" onchange="calculateLosses()" type="number" value="10" /></td>
    <td>Amps</td>
    <td>Current</td>
    </tr>
    <tr>
    <td>f_sw</td>
    <td><input id="f_sw" onchange="calculateLosses()" type="number" value="24" /></td>
    <td><select id="f_sw_unit" onchange="calculateLosses()"><option value="1e3">kHz</option><option value="1e0">Hz</option> </select></td>
    <td>Switching frequency</td>
    </tr>
    <tr>
    <td>Vgate_drive</td>
    <td><input id="v_gate_drive" onchange="calculateLosses()" type="number" value="10" /></td>
    <td>Volts</td>
    <td>Gate drive voltage</td>
    </tr>
    <tr>
    <td>Rds(on)</td>
    <td><input id="rdson" onchange="calculateLosses()" type="number" value="2.8" /></td>
    <td><select id="t_rdson_unit" onchange="calculateLosses()"><option value="1e-3">mOhms</option><option value="1">Ohms</option> </select></td>
    <td>Drain-to-source on resistance</td>
    </tr>
    <tr>
    <td>Qg</td>
    <td><input id="q_g" onchange="calculateLosses()" type="number" value="38" /></td>
    <td><select id="q_g_unit" onchange="calculateLosses()"><option value="1e-9">nC</option><option value="1e-6">&micro;C</option> </select></td>
    <td>Gate charge total</td>
    </tr>
    <tr>
    <td>Td(on)</td>
    <td><input id="t_d_on" onchange="calculateLosses()" type="number" value="120" /></td>
    <td><select id="t_d_on_unit" onchange="calculateLosses()"><option value="1e-9">ns</option><option value="1e-6">&micro;s</option> </select></td>
    <td>Turnon delay time</td>
    </tr>
    <tr>
    <td>Tr</td>
    <td><input id="t_rise" onchange="calculateLosses()" type="number" value="22" /></td>
    <td><select id="t_rise_unit" onchange="calculateLosses()"><option value="1e-9">ns</option><option value="1e-6">&micro;s</option> </select></td>
    <td>Rise time</td>
    </tr>
    <tr>
    <td>Td(off)</td>
    <td><input id="t_d_off" onchange="calculateLosses()" type="number" value="120" /></td>
    <td><select id="t_d_off_unit" onchange="calculateLosses()"><option value="1e-9">ns</option><option value="1e-6">&micro;s</option> </select></td>
    <td>Turn-off delay</td>
    </tr>
    <tr>
    <td>Tf</td>
    <td><input id="t_fall" onchange="calculateLosses()" type="number" value="6" /></td>
    <td><select id="t_fall_unit" onchange="calculateLosses()"><option value="1e-9">ns</option><option value="1e-6">&micro;s</option> </select></td>
    <td>Fall time</td>
    </tr>
    <tr>
    <td>Qrr</td>
    <td><input id="q_rr" onchange="calculateLosses()" type="number" value="12" /></td>
    <td><select id="q_rr_unit" onchange="calculateLosses()"><option value="1e-9">nC</option><option value="1e-6">&micro;C</option> </select></td>
    <td>Reverse recovery charge</td>
    </tr>
    <tr>
    <td>Vsd</td>
    <td><input id="v_fv" onchange="calculateLosses()" type="number" value="1.0" /></td>
    <td>Volts</td>
    <td>Body diode Forward Voltage</td>
    </tr>
    <tr>
    <td>Coss</td>
    <td><input id="c_oss" onchange="calculateLosses()" type="number" value="150" /></td>
    <td><select id="c_oss_unit" onchange="calculateLosses()"><option value="1e-12">pF</option><option value="1e-9">nF</option> </select></td>
    <td>Output capacitance of the MOSFET</td>
    </tr>
    <tr>
    <td>Conduction Loss (P_cond)</td>
    <td id="p_cond">&nbsp;</td>
    <td>Watts</td>
    <td>Power loss due to conduction</td>
    </tr>
    <tr>
    <td>Switching Loss (P_sw)</td>
    <td id="p_sw">&nbsp;</td>
    <td>Watts</td>
    <td>Power loss during switching</td>
    </tr>
    <tr>
    <td>Reverse Recovery Loss (P_rr)</td>
    <td id="p_rr">&nbsp;</td>
    <td>Watts</td>
    <td>Power loss due to reverse recovery of the body diode</td>
    </tr>
    <tr>
    <td>Deadtime Loss (P_dt)</td>
    <td id="p_dt">&nbsp;</td>
    <td>Watts</td>
    <td>Power loss during deadtime</td>
    </tr>
    <tr>
    <td>Gate Charge Loss (P_gate)</td>
    <td id="p_gate">&nbsp;</td>
    <td>Watts</td>
    <td>Power loss due to gate charge</td>
    </tr>
    <tr>
    <td><em><strong>Total MOSFET Power Loss</strong></em></td>
    <td id="total_loss">&nbsp;</td>
    <td><em><strong>Watts</strong></em></td>
    <td><em><strong>Total power loss in MOSFET</strong></em></td>
    </tr>
    <!-- <tr>
        <td>Gate Driver Power Loss (P_driver)</td>
        <td id="p_driver">&nbsp;</td>
        <td>Watts</td>
        <td>Power loss due to driving the gate</td>
      </tr> -->
  </tbody>
  </table>
<div id="thermal-container">
  <div><strong>Thermal Check (does not affect power loss calculations)</strong></div>
  <p style="margin: 6px 0 4px 0; font-size: 13px;">
    The thermal section does a quick “what will my junction temperature be?” check using the total power loss you calculated. You supply the thermal resistances and ambient temp; it multiplies total loss by the chosen R&theta;, adds ambient, and shows ΔT, estimated Tj, and whether you’re under your limit.
  </p>
  <p style="margin: 0 0 8px 0; font-size: 13px;">
    Not sure which numbers to use? R&theta;JA comes straight from the MOSFET datasheet and assumes the part is soldered to the datasheet&#8217;s test PCB (usually no custom heatsink). R&theta;JC is also from the datasheet (junction to the case). R&theta;CA is your own path from case to ambient; your heatsink, board, and airflow. If you don’t have a heatsink model, pick R&theta;JA. If you do, choose R&theta;JC + R&theta;CA so the heatsink path is included.
  </p>
  <table id="thermal-table" style="width: 100%;">
    <colgroup>
      <col class="col-param">
      <col class="col-value">
      <col class="col-units">
      <col>
    </colgroup>
    <tbody>
      <tr>
        <th style="text-align: left;"><strong>Parameter</strong></th>
        <th style="text-align: left;"><strong>Value</strong></th>
        <th style="text-align: left;"><strong>Units</strong></th>
        <th style="text-align: left;"><strong>Description / Help</strong></th>
      </tr>
      <tr>
        <td>Mode</td>
        <td>
          <select id="thermal_mode" onchange="updateThermalMode(); calculateThermal(lastTotalLoss);">
            <option value="ja">Use RθJA (datasheet)</option>
            <option value="jc">Use RθJC + RθCA</option>
          </select>
        </td>
        <td>&#8211;</td>
        <td class="help">JA = datasheet junction-to-ambient (often bare PCB). JC+CA = datasheet junction-to-case plus your heatsink/board path.</td>
      </tr>
      <tr>
        <td>RθJA</td>
        <td><input id="theta_ja" type="number" value="35" onchange="calculateThermal(lastTotalLoss)" /></td>
        <td>°C/W</td>
        <td class="help">Datasheet Junction-to-Ambient. Soldered to PCB, no custom heatsink model.</td>
      </tr>
      <tr>
        <td>RθJC</td>
        <td><input id="theta_jc" type="number" value="1.5" onchange="calculateThermal(lastTotalLoss)" /></td>
        <td>°C/W</td>
        <td class="help">Datasheet Junction-to-Case.</td>
      </tr>
      <tr>
        <td>RθCA</td>
        <td><input id="theta_ca" type="number" value="10" onchange="calculateThermal(lastTotalLoss)" /></td>
        <td>°C/W</td>
        <td class="help">Case-to-Ambient for your heatsink/board/airflow.</td>
      </tr>
      <tr>
        <td>T<sub>amb</sub></td>
        <td><input id="t_amb" type="number" value="25" onchange="calculateThermal(lastTotalLoss)" /></td>
        <td>°C</td>
        <td class="help">Ambient temperature around the MOSFET.</td>
      </tr>
      <tr>
        <td>T<sub>J,limit</sub></td>
        <td><input id="t_j_limit" type="number" value="125" onchange="calculateThermal(lastTotalLoss)" /></td>
        <td>°C</td>
        <td class="help">Chosen max junction temperature (125 to 150°C typical).</td>
      </tr>
      <tr>
        <td>ΔT</td>
        <td><span id="delta_t">&#8211;</span></td>
        <td>°C</td>
        <td class="help">Temperature rise from total loss × thermal resistance.</td>
      </tr>
      <tr>
        <td>Estimated T<sub>J</sub></td>
        <td><span id="t_j">&#8211;</span></td>
        <td>°C</td>
        <td class="help">T<sub>amb</sub> + ΔT. First-order estimate.</td>
      </tr>
      <tr>
        <td>Rθ used</td>
        <td><span id="theta_used">&#8211;</span></td>
        <td>°C/W</td>
        <td class="help">The active path (JA or JC+CA) used for the estimate.</td>
      </tr>
      <tr>
        <td>Status</td>
        <td colspan="3"><span id="thermal-status" style="color: #444;">Enter values to estimate junction temperature.</span></td>
      </tr>
    </tbody>
  </table>
</div>

<h2 class="wp-block-heading">&nbsp;</h2>

<h2 class="wp-block-heading">Parameter Definitions &amp; Loss Formulas</h2>

<h3 class="wp-block-heading">Electrical Parameters</h3>

<div class="param-block">
  <p class="param-name"><strong>Vbus</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The bus or supply voltage applied across the MOSFET and its load. It is the electrical &#8220;push&#8221; driving power through the system.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>A power stage needs a voltage source to move energy. Vbus sets the maximum voltage the MOSFET must block and switch.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher Vbus reduces current for the same power which lowers conduction loss. At the same time, higher Vbus increases switching loss because the MOSFET spends time switching with both voltage and current present. It also stores more energy in the MOSFET internal capacitances that must be charged and discharged every cycle, and MOSFETs rated for higher voltage usually have worse on resistance and higher cost.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Higher Vbus improves conduction efficiency but raises switching stress. Lower Vbus helps switching efficiency but increases current. Choose Vbus based on topology, switching frequency, and power level.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Pick MOSFETs with enough voltage headroom, minimize stray inductance in layout, and select a switching frequency that balances conduction and switching losses.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Current</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The current flowing through the MOSFET when it is on. This is the MOSFET main job, passing load current from drain to source.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The MOSFET forms the controlled conduction path that sends energy to the load.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Conduction loss rises with the square of current. Higher current increases temperature rise and stresses the package, and layout resistance becomes more important as current climbs.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Your system voltage and power requirements set the current. The MOSFET must be chosen to handle this current without excessive heating.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use thicker copper, shorten high current paths, parallel MOSFETs when needed, or increase Vbus to reduce required current.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>f_sw</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The switching frequency. It is how many times per second the MOSFET turns on and off.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Switching allows the converter to control voltage and power. The frequency sets how quickly regulation can respond.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher frequency shrinks magnetics which saves size, but higher frequency increases switching loss because the MOSFET transitions more often and increases heating and EMI.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Frequency is a major efficiency lever. Use the lowest frequency that still meets your size, noise, and control requirements.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use MOSFETs with fast transitions, improve layout to reduce ringing, and use a gate driver with enough current for your chosen frequency.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Vgate_drive</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The gate to source voltage applied by the gate driver. It controls how strongly the MOSFET turns on.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>A MOSFET channel forms only when the gate is charged. Higher gate voltage strengthens the channel.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher gate drive reduces on resistance. Very high gate drive increases gate charge loss and can damage the gate if it exceeds limits, and too low gate drive prevents full enhancement which increases heating.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Use the recommended gate drive voltage from the datasheet. More is not always better.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use a gate driver capable of delivering enough current, ensure clean gate traces, and follow safe operating limits for the MOSFET.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Rds(on)</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The drain to source resistance when the MOSFET is fully on. It is an unavoidable resistive component of the channel.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The channel is made of doped silicon and has finite resistance. Larger silicon area reduces this resistance.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Lower Rds(on) reduces conduction loss directly. Larger die area that gives low resistance often increases gate charge and capacitance, which can increase switching loss, and Rds(on) increases as temperature rises.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Lower Rds(on) is great for high current or low frequency designs. At higher frequency you balance Rds(on) with switching performance.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Choose MOSFETs with balanced Rds(on) and gate charge, keep the device cool, and use the recommended gate drive voltage.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Qg</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The total gate charge needed per switching cycle. It tells you how much effort it takes to turn the MOSFET on and off.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The gate behaves like a capacitor. Moving charge in and out shifts the device state.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher Qg slows switching if the driver cannot supply enough current and increases gate drive loss. Reducing Qg often increases on resistance.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Low Qg is helpful at high frequency. For low frequency converters it is less critical.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use a strong gate driver, keep gate traces short, and choose MOSFETs with a good balance of Qg and Rds(on).</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Td(on) and Td(off)</strong></p>
  <p class="param-detail">
  <em>What they are</em>
  <span>The delays before the MOSFET begins turning on or off after the gate signal changes.</span>
</p>
  <p class="param-detail">
  <em>Why they exist</em>
  <span>Internal capacitances and the structure of the gate region create brief delays.</span>
</p>
  <p class="param-detail">
  <em>How they affect performance</em>
  <span>Long delays increase deadtime which forces the body diode to conduct. Excessive delay reduces efficiency and raises diode stress.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Shorter delays improve efficiency in synchronous converters.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize them</em>
  <span>Use a faster gate driver, ensure clean signals, and avoid unnecessary gate trace length.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Tr and Tf</strong></p>
  <p class="param-detail">
  <em>What they are</em>
  <span>The rise and fall times during switching transitions. These define how long the MOSFET spends in the region where both voltage and current are present.</span>
</p>
  <p class="param-detail">
  <em>Why they exist</em>
  <span>Gate charge, driver strength, and internal capacitances limit how fast the MOSFET can transition.</span>
</p>
  <p class="param-detail">
  <em>How they affect performance</em>
  <span>Longer transition times increase switching loss. Very fast transitions reduce loss but can cause noise and ringing.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>You want transitions that are fast enough for efficiency but not so fast that EMI or overshoot becomes a problem.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize them</em>
  <span>Tune gate resistance, use proper PCB layout, and pick MOSFETs with suitable switching characteristics.</span>
</p>
</div>

<div class="param-block">
  <p class="param-name"><strong>Qrr</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The reverse recovery charge of the MOSFET body diode. It is the leftover charge that must be removed when the diode stops conducting.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The diode stores charge while it conducts. That charge does not disappear instantly when current reverses.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher Qrr causes current spikes and additional heating and hurts efficiency in fast switching applications.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Low Qrr is important in synchronous converters and high frequency designs.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Choose MOSFETs with optimized body diodes or move to devices with inherently low Qrr such as superjunction or wide bandgap parts.</span>
</p>

</div>

<div class="param-block">
  <p class="param-name"><strong>Vsd</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The forward voltage drop of the MOSFET body diode when it conducts.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The diode is built into the MOSFET structure and conducts during deadtime or reverse current events.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher Vsd increases loss during deadtime and the diode heats up more at high current or long deadtime intervals.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Low Vsd is helpful when the diode conducts often, but Qrr typically matters more at high frequency.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use MOSFETs with optimized diode behavior and minimize deadtime.</span>
</p>

</div>

<div class="param-block">
  <p class="param-name"><strong>Coss</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The output capacitance between drain and source. It stores energy that must be moved during switching.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The MOSFET internal structure forms parasitic capacitors.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher Coss increases energy loss each time the MOSFET switches, affects switching speed and voltage overshoot, and Coss loss rises quickly with higher bus voltage.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Low Coss is valuable in high voltage, high frequency applications.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use MOSFETs designed for low capacitance, reduce switching frequency, and keep layout inductance low.</span>
</p>

</div>

<h3 class="wp-block-heading">Thermal Parameters</h3>

<div class="param-block">
  <p class="param-name"><strong>R&theta;JA</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The junction-to-ambient thermal resistance from the datasheet. It tells you how many degrees the silicon junction will rise for each watt of power the MOSFET dissipates on the specified test PCB with no special heatsink.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Any real device has to dump its heat into the surrounding air. The package, solder, and PCB copper form a thermal path that resists heat flow, similar to how an electrical resistor resists current.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>A higher R&theta;JA means the junction gets hotter for the same power loss, reducing safety margin and lifetime. A lower R&theta;JA keeps the device cooler and lets you safely run more current or accept higher losses.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>R&theta;JA is most accurate when your mounting and PCB look like the datasheet test conditions. In dense layouts with many hot parts or different airflow, the real effective thermal resistance can be worse.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use wider copper areas, thermal vias, thicker copper, and avoid trapping hot air around the device. If R&theta;JA alone is not low enough, move to a package that can connect to a heatsink and use the R&theta;JC + R&theta;CA path instead.</span>
</p>
 
</div>

<div class="param-block">
  <p class="param-name"><strong>R&theta;JC</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The junction-to-case thermal resistance from the datasheet. It describes how easily heat flows from the silicon junction into the package case or exposed pad that touches your heatsink or PCB.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Between the silicon and the outside world there are die attach materials, leadframe, and package plastic, all of which slow heat flow and add thermal resistance.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Lower R&theta;JC means the junction tracks closer to the case temperature, so a good heatsink can keep the die much cooler. High R&theta;JC limits how effective your heatsink or copper plane can be.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>R&theta;JC is the key number when you plan to mount the MOSFET on a heatsink or heavy copper area. It lets you estimate junction temperature starting from measured or simulated case temperature.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Choose packages with low R&theta;JC (for example power packages with exposed pads), mount them with good thermal interface material, and follow layout recommendations so the thermal pad is fully soldered.</span>
</p>
 
</div>

<div class="param-block">
  <p class="param-name"><strong>R&theta;CA</strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The case-to-ambient thermal resistance for your specific cooling path: heatsink, PCB copper, thermal interface material, and airflow.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Heat leaving the case must travel through metal, interface material, and surrounding air. Each of these adds resistance to heat flow, just like resistors in series.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Lower R&theta;CA means the case runs closer to ambient temperature for a given power loss, giving the junction more headroom. Poor heatsinking (high R&theta;CA) quickly pushes junction temperature toward its limit.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Combined with R&theta;JC, it sets the effective junction-to-ambient resistance of your custom design (R&theta;JA &approx; R&theta;JC + R&theta;CA). It drives decisions about heatsink size, airflow, and board copper area.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Use larger or more efficient heatsinks, add airflow, choose good thermal interface materials, and design PCBs with solid copper areas and thermal vias under the device.</span>
</p>
 
</div>

<div class="param-block">
  <p class="param-name"><strong>T<sub>amb</sub></strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The ambient air temperature around the MOSFET, usually the air just outside the board or heatsink rather than room temperature measured far away.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Heat can only flow into something cooler. The temperature of the surrounding air sets the starting point for how far the junction can rise before reaching its limit.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Higher ambient temperature raises junction temperature for the same power loss and thermal resistance, reducing safety margin. Cooler ambient gives you more headroom for power or lifetime.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>You must use realistic ambient assumptions for your product environment, not just 25&nbsp;&deg;C lab conditions. Enclosures, nearby hot components, and limited airflow all make the effective ambient hotter.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Improve airflow, separate hot parts, avoid enclosing the MOSFET in small sealed spaces, and consider derating current or power for worst-case ambient conditions.</span>
</p>
 
</div>

<div class="param-block">
  <p class="param-name"><strong>T<sub>J,limit</sub></strong></p>
  <p class="param-detail">
  <em>What it is</em>
  <span>The maximum junction temperature you are willing to allow, often chosen below the absolute maximum rating in the datasheet.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>Semiconductor reliability and lifetime drop sharply as temperature rises. The datasheet absolute maximum is a do-not-exceed value, not a comfortable operating point.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>A higher chosen T<sub>J,limit</sub> lets you run more loss or current but reduces lifetime margin. A lower T<sub>J,limit</sub> improves reliability but may require a better MOSFET or stronger cooling.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Picking T<sub>J,limit</sub> is a design trade-off between efficiency, cost, and reliability. Safety standards or company guidelines may define the maximum allowed junction temperature for long-life products.</span>
</p>
  <p class="param-detail">
  <em>Practical ways to optimize it</em>
  <span>Start from datasheet limits and application requirements, then adjust MOSFET selection and cooling so the estimated Tj under worst-case conditions stays below your chosen limit with some margin.</span>
</p>
 
</div>

<h3 class="wp-block-heading">Power Loss Calculations</h3>

<div class="calculation-block">
<h4 class="wp-block-heading">Conduction Loss (P_cond)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Losses when the MOSFET is fully on and simply carrying current. This is the resistive heating from Rds(on).</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The MOSFET channel behaves like a small resistor when on, so any current through it creates I&sup2;R heating.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>For a simple case with constant current:<br />
  <span class="formula"><code>P_cond = Current^2 &times; Rds(on)</code></span><br />
  In real converters you often use RMS current and include duty cycle. The calculator can account for that behind the scenes if extended.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Grows with the square of current, so higher current hurts a lot. Increases with temperature because Rds(on) rises as the device heats up, and tends to dominate loss in low frequency, high current designs.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Conduction loss is often the first thing to check in high current systems. It pushes you toward lower Rds(on), better cooling, or higher Vbus to reduce current.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Choose MOSFETs with suitable Rds(on), keep them cool so resistance stays low, and use thick copper and short traces to avoid extra resistive loss.</span>
</p>
</div>

<div class="calculation-block">
<h4 class="wp-block-heading">Overlap Switching Loss (P_sw)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Losses while the MOSFET is turning on and off. In this time the device sees both significant voltage and current.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The MOSFET cannot jump instantly from off to on. During each transition it passes through a region where it is partially on and the product of voltage and current creates heat.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>A common approximation for hard switching is:<br />
  <span class="formula"><code>P_sw = 0.5 &times; Vbus &times; Current &times; (Tr + Tf) &times; f_sw</code></span><br />
  Where Tr and Tf are the rise and fall times. This calculator also adds a capacitance related term consistent with the Coss model below.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Increases linearly with bus voltage, current, and frequency, and increases with longer rise and fall times. It becomes dominant in many high frequency converters.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Once switching loss dominates, simply lowering Rds(on) does not help much. You need faster switching devices, stronger gate drive, or lower frequency.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Use a strong gate driver, keep gate loops tight, tune gate resistance to balance speed and EMI, and avoid unnecessarily high switching frequencies.</span>
</p>
</div>

<div class="calculation-block">
<h4 class="wp-block-heading">Reverse Recovery Loss (P_rr)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Loss caused by the body diode inside the MOSFET when it turns off and dumps its stored charge.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>When the diode conducts, charge accumulates in its junction. When current reverses, that charge must be removed which causes a brief extra current spike and extra heating.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>A common approximation is:<br />
  <span class="formula"><code>P_rr = Qrr &times; Vbus &times; f_sw</code></span></span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Grows with bus voltage and switching frequency, shows up as current spikes and ringing that stress components and cause EMI, and matters much more in fast synchronous converters than in slow or diode based designs.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Reverse recovery can quietly dominate losses at high frequency even when Rds(on) looks good on paper. Low Qrr becomes a key selection parameter.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Choose MOSFETs with low Qrr body diodes, consider wide bandgap devices for very high frequency, and keep loop inductance low to reduce overshoot during recovery.</span>
</p>
</div>

<div class="calculation-block">
<h4 class="wp-block-heading">Deadtime Loss (P_dt)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Loss when neither MOSFET in a half bridge is on and the body diode conducts during deadtime.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>You must insert a small deadtime so that high side and low side are never on at the same time. During this time, current has to flow somewhere, usually through the body diode.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>In a simple synchronous half bridge, an approximation is:<br />
  <span class="formula"><code>P_dt = 2 &times; Vsd &times; Current &times; (Td(on) + Td(off)) &times; f_sw</code></span><br />
  The factor of 2 accounts for both edges in one full switching period.</span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Increases with diode forward drop, current, deadtime, and frequency, and shows up directly as heat in the MOSFET and extra stress on the diode.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>Too much deadtime wastes energy in the diode. Too little risks shoot through. There is a sweet spot that keeps efficiency high and the converter safe.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Use gate drivers that provide adjustable deadtime, minimize propagation delay mismatch, and choose MOSFETs with good body diode behavior if the diode will conduct often.</span>
</p>
</div>

<div class="calculation-block">
<h4 class="wp-block-heading">Gate Charge Loss (P_gate)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Losses in the gate driver from charging and discharging the MOSFET gate every cycle.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The gate is capacitive. Moving charge Qg at a voltage Vgate_drive every cycle consumes energy that ends up in the driver and the MOSFET gate network.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>Each full cycle charges and discharges the gate once, so:<br />
  <span class="formula"><code>P_gate = 2 &times; Qg &times; Vgate_drive &times; f_sw</code></span></span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Grows with Qg, gate drive voltage, and frequency. It does not heat the MOSFET much directly but adds to system power loss and driver heating and limits how many devices you can drive from one controller.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>At very high frequency or in multi phase systems, gate drive loss is no longer negligible and it influences both MOSFET and driver selection.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Pick MOSFETs with a good balance of Qg and Rds(on), keep gate drive voltage at the recommended level, and use drivers that can handle the required total gate charge.</span>
</p>
</div>

<div class="calculation-block">
<h4 class="wp-block-heading">Output Capacitance Loss (P_coss)</h4>

<p class="param-detail">
  <em>What it represents</em>
  <span>Loss from charging and discharging the MOSFET output capacitance every switching cycle.</span>
</p>
  <p class="param-detail">
  <em>Why it exists</em>
  <span>The MOSFET drain to source capacitance stores energy at Vbus. Each time you switch, that stored energy is moved around and usually ends up as heat.</span>
</p>
<p class="param-detail">
  <em>Formula</em>
  <span>A common approximation is:<br />
  <span class="formula"><code>P_coss = 0.5 &times; Coss &times; Vbus^2 &times; f_sw</code></span></span>
</p>
  <p class="param-detail">
  <em>How it affects performance</em>
  <span>Grows quickly with bus voltage because it scales with V&sup2; and increases linearly with switching frequency. It can become a dominant loss term in high voltage, high frequency converters.</span>
</p>
  <p class="param-detail">
  <em>Design implications</em>
  <span>At higher voltages, Coss performance can matter more than Qg. Selecting a MOSFET with low output capacitance can give a significant efficiency gain.</span>
</p>
<p class="param-detail">
  <em>Practical tips</em>
  <span>Use MOSFETs optimized for low Coss at your operating voltage, keep switching frequency reasonable, and minimize parasitic inductance that interacts with Coss to cause ringing.</span>
</p>

</div>

<h2 class="wp-block-heading">Summary</h2>

<p>This guide provides an introduction to the power dissipation characteristics in MOSFETs under various operating conditions. These calculations are helpful for anyone looking to understand the efficiency and performance of MOSFET-based power electronic systems.</p>

<p><strong>Learn more about DMC&apos;s <a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming">Embedded Development and Embedded Programming</a> expertise.&nbsp;</strong></p>
</div>
<p>The post <a href="https://static.dmcinfo.com/blog/17021/mosfet-power-loss-calculator/">MOSFET Power Loss Calculator</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>4 Tips for Launching a Product on Emerging Cellular Networks</title>
		<link>https://static.dmcinfo.com/blog/20846/4-tips-for-launching-a-product-on-emerging-cellular-networks/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Fri, 04 Oct 2019 14:51:46 +0000</pubDate>
				<category><![CDATA[Application Development]]></category>
		<category><![CDATA[Embedded Development & Programming]]></category>
		<category><![CDATA[IoT]]></category>
		<category><![CDATA[Low-Power Embedded Design]]></category>
		<category><![CDATA[Cellular Networks]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/20846/4-tips-for-launching-a-product-on-emerging-cellular-networks/</guid>

					<description><![CDATA[<p>The major cellular network providers (AT&amp;T, Verizon, T-Mobile) have launched or are&#160;in the process of launching upgrades to their LTE networks that will enable the deployment of millions of new, previously&#160;impractical IoT&#160;solutions.&#160;LTE-M (aka CAT-M1) and NB-IoT&#160;networks are designed specifically for low-power, low-cost, low-bandwidth&#160;devices. By reducing the&#160;bandwidth, carriers can&#160;offer connectivity at increasingly lower monthly costs. Devices [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/20846/4-tips-for-launching-a-product-on-emerging-cellular-networks/">4 Tips for Launching a Product on Emerging Cellular Networks</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">The major cellular network providers (AT&amp;T, Verizon, T-Mobile) have launched or are&nbsp;in the process of launching upgrades to their LTE networks that will enable the deployment of millions of new, previously&nbsp;impractical IoT&nbsp;solutions.&nbsp;LTE-M (aka CAT-M1) and NB-IoT&nbsp;networks are designed specifically for <a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming/low-power-embedded-design">low-power</a>, low-cost, low-bandwidth&nbsp;devices. By reducing the&nbsp;bandwidth, carriers can&nbsp;offer connectivity at increasingly lower monthly costs. Devices using cellular modules may cost as little as $1&nbsp;monthly.</p>



<p class="wp-block-paragraph">These new networks are the future of&nbsp;IoT. However, as this writing, many of these networks still have a lot of kinks to work out. Cellular module vendors are rapidly developing and lunching modules for these networks. These modules are all new and so is the network, so&nbsp;challenges launching a product on one of these networks are to be expected.</p>



<h2 class="wp-block-heading" id="h-what-to-do">What to Do</h2>



<p class="wp-block-paragraph"><strong>1. Know your Module Vendor</strong><br>
When selecting a cellular module <a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming/embedded-systems-platforms">vendor</a> make sure they have a good support network. With new network deployments, there will be a LOT of updates happening in the background. The cell providers will be making adjustments and so will the module vendors. It&#8217;s important to understand the level of support you will get from the module vendor if your device happens to uncover a bug or incompatibility between the module and the network, or worse, between the module and a specific cell tower.</p>



<p class="wp-block-paragraph"><img decoding="async" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/ublox-SARA-R4.png" alt="SARA-R4 by ublox"> <img decoding="async" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Simcon-SIM7000X.png" alt="SIM7000X by Simcon"> <img decoding="async" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/nordic-nRF9160.png" alt="nRF9160 by Nordic"><br> <em>ublox SARA-R4 series, <a href="https://www.simcom.com/product/SIM7000G.html" target="_blank" rel="noreferrer noopener">SIMCom SIM7000X</a>, and <a href="https://www.nordicsemi.com/Products/Low-power-cellular-IoT/nRF9160?utm_term=nordic%20nrf9160&amp;utm_campaign=NRF91+series&amp;utm_source=adwords&amp;utm_medium=ppc&amp;hsa_tgt=kwd-669404695330&amp;hsa_grp=65550591524&amp;hsa_src=g&amp;hsa_net=adwords&amp;hsa_mt=b&amp;hsa_ver=3&amp;hsa_ad=319485577104&amp;hsa_acc=1116845495&amp;hsa_kw=nordic%20nrf9160&amp;hsa_cam=1658684085&amp;gclid=Cj0KCQjw3JXtBRC8ARIsAEBHg4kAtSLOubBGs_G5mjbB44UesNpvOxYqSkBeQ982zXuCBjHqHQdq5AgaAqrbEALw_wcB" target="_blank">Nordic nRF9160</a></em><br> <br> <strong>2. Understand the Module Power Requirements</strong><br> Most of these cellular module vendors provide a lot of marketing material about the low power requirements of their modules. These low power modules promise battery-powered cellular connectivity with years of battery life. It&#8217;s true, these modules have very low average currents while operating. The important thing to understand is that they also have relatively high peak current demands, which means you need to select your battery and design your power circuitry carefully. You won&#8217;t see any cellular IoT devices running on coin cells anytime soon.</p>



<p class="wp-block-paragraph">Lithium Thionyl Chloride is popular cell chemistry for super long-life Wi-Fi or Bluetooth IoT devices, but most of the batteries made with this chemistry fail to provide the high peak current required by the cellular modules. Spiral wound Lithium Thionyl Chloride batteries use the same chemistry but provide higher peak current (by increasing the electrode surface area), however these batteries may still not meet the peak current demands.</p>



<p class="wp-block-paragraph"><img decoding="async" alt="Spiral bound lithium battery diagram" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/spiral-bound-lithium-battery.png"><br>
<em>Spiral wound Lithium Thionyl Chloride batteries</em></p>



<p class="wp-block-paragraph">Instead, you may need to consider hybrid batteries&nbsp;like <a href="https://xenoenergy.com/xlc_capacitor" target="_blank" rel="noreferrer noopener">these</a>&nbsp;from Xeno Energy which consist of a Lithium Thionyl Chloride cell and a parallel supercapacitor. The supercapacitor can provide high peak currents while exhibiting very low leakage.&nbsp; Although the cost is higher for this battery topology, it provides the performance needed for long life cellular IoT devices.&nbsp;</p>



<p class="wp-block-paragraph"><img decoding="async" alt="Hybrid battery graphic" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/hybrid-battery-emerging-cellular-networks.png"><br>
<em>Hybrid battery</em><br>
<br>
<strong>3. Test Your Module in a Wide Variety of Conditions</strong><br>
These modules contain closed-source vendor-supplied firmware. The operation of the module may not be fully documented. Part of your testing protocol should include adding attenuators to the cellular antenna (to simulate poor cellular reception) and observing how the module functions with reduced signal strength.</p>



<p class="wp-block-paragraph">Modules draw significantly more average current when operating at this reduced signal level. Not knowing this ahead of time can be problematic, especially if your product advertises a minimum battery life expectancy.&nbsp;The actual battery life will largely depend on your connection to the cellular network. The total energy required to transmit a message from your device to the backend server can vary significantly depending on your signal strength and the number of retries required.&nbsp;</p>



<p class="wp-block-paragraph"><img decoding="async" alt="Add attenuators to the cellular antenna for testing" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/emerging-celular-networks-attenuator.jpg"><br>
<em>Add attenuators to the cellular antenna to test at a reduced signal strength</em><br>
<br>
<strong>4.&nbsp;Expect and Plan Time for Network Issues</strong><br>
These networks are going to be great, but until they are fully stable your product launch is going to go slower than you hoped. Add extra time in your launch schedule to account for these unknowns and extend your engineering budget to account for the time required to work through these issues.&nbsp;</p>



<p class="wp-block-paragraph">Keep in mind that different cell towers may contain different vendor hardware.&nbsp;Each of these vendors may be interpreting the CAT-M1/LTE-M specification differently and you may encounter situations where the firmware in your device performs better on some towers than others. If you encounter issues like this,&nbsp;move your device to a different location to&nbsp;see if it picks up a different tower and starts working. Eventually, these issues will be worked out by the carriers and module providers, but you should initially be prepared to work through these situations during your testing and product rollout.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</p>



<p class="wp-block-paragraph"><em><img decoding="async" alt="Two cell towers" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/emerging-cellular-networks-cell-towers.jpg"><br>
The&nbsp;firmware in your device may perform better on some cell towers than others due to hardware differences</em></p>



<p class="wp-block-paragraph"><strong>Learn more about DMC&#8217;s <a href="https://static.dmcinfo.com/services/application-development/iot-solutions">IoT solutions</a>.&nbsp;</strong></p>
<p>The post <a href="https://static.dmcinfo.com/blog/20846/4-tips-for-launching-a-product-on-emerging-cellular-networks/">4 Tips for Launching a Product on Emerging Cellular Networks</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Low Cost Function Generator Amplifier DIY</title>
		<link>https://static.dmcinfo.com/blog/24248/low-cost-function-generator-amplifier-diy/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Wed, 07 Jun 2017 15:04:40 +0000</pubDate>
				<category><![CDATA[Embedded Development & Programming]]></category>
		<category><![CDATA[DIY]]></category>
		<category><![CDATA[Signal Generator Amplifier]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/24248/low-cost-function-generator-amplifier-diy/</guid>

					<description><![CDATA[<p>Introduction A majority of function generators are only capable of driving a couple of hundred milliamps, which is fine for most applications. If you want&#160;more output current, you can shell out $400 dollars for a professional signal generator amplifier, or you can do what I did and hack one together for under $40. A signal [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/24248/low-cost-function-generator-amplifier-diy/">Low Cost Function Generator Amplifier DIY</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<h2 id="h-introduction" class="wp-block-heading">Introduction</h2>



<p class="wp-block-paragraph">A majority of function generators are only capable of driving a couple of hundred milliamps, which is fine for most applications. If you want&nbsp;more output current, you can shell out $400 dollars for a professional signal generator amplifier, or you can do what I did and hack one together for under $40.</p>



<p class="wp-block-paragraph">A signal generator is an indispensable tool for developing and testing electronic designs. You may find yourself wishing yours could output more current. You could test your power supply design by feeding in a noisy supply voltage, or you could see how it will handle a specific amount of input ripple. If you do this sort of thing regularly, you may want to invest in professional equipment. But, if you are on a budget, or only need this sort of thing occasionally, then keep reading.</p>



<h2 id="h-backstory" class="wp-block-heading">Backstory</h2>



<p class="wp-block-paragraph">When I first started learning electronics in grade school, I had dreams of being able to build anything I wanted. After purchasing components in single quantity from <em>Digi-Key</em> for my first few projects, I learned a disheartening lesson. </p>



<p class="wp-block-paragraph"><em>It almost always costs more to make something yourself than to buy a finished product.</em></p>



<p class="wp-block-paragraph">It was then I wrote Tim’s Golden Rule of Building Electronics:</p>



<p class="wp-block-paragraph"><strong>“I shall not build what can be bought unless mine shall be better or cheaper.”</strong></p>



<p class="wp-block-paragraph">So, before embarking on this project, I checked to see if there were any low-cost units on the market. The least expensive option I could find was the <a href="https://siglentna.com/product/spa1010-10-watt-amplifier/">Siglent SPA1010</a> at just under $400. This unit would work for most cases, but only has a max output current of 1.1Amps, which just wasn’t enough for me.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196df4aa&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196df4aa" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/First-Picture-Resized.jpg" alt="Screenshot of Siglent SPA1010 purchase page"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph"><em>Figure 1 – Siglent SPA1010</em><br>
&nbsp;</p>



<h2 id="h-signal-generator-amplifier-diy" class="wp-block-heading">Signal Generator Amplifier DIY</h2>



<p class="wp-block-paragraph">Unable to find a low-cost option, I resolved myself to designing my own signal generator amplifier.</p>



<p class="wp-block-paragraph">I hoped that I could design the amplifier around a high-power OP Amp. Searching for the highest output&nbsp;OP Amp on Digi-Key revealed the OPA541 and OPA549.</p>



<p class="wp-block-paragraph">The OPA541 can handle +/- 35V rails, whereas the OP549 can only handle +/- 30V rails.</p>



<p class="wp-block-paragraph">Since <strong>More Voltage = More Better</strong>, I went with OPA541.</p>



<p class="wp-block-paragraph">I felt good about this selection, and I felt even better when I heard on their podcast that the guys at <a href="https://macrofab.com/blog/super-simple-power-supply-ssps-design-part-1/">Macrofab</a> were designing a power supply using this same OP Amp. Now, I just needed to whip up a schematic and layout a PCB (with a monster heatsink) to handle the OPA541.</p>



<p class="wp-block-paragraph"><em>Wait, Tim! Don’t forget about your golden rule!</em></p>



<p class="wp-block-paragraph">Before embarking on my design, I decided to see if there were any breakout boards available for the OPA541 (preferably with a heatsink). I couldn’t find anything from the usual suspects (<a href="http://adafruit.com/">Adafruit</a>, <a href="http://sparkfun.com/">Sparkfun</a>, etc.), but I did find something on <a href="https://www.aliexpress.com/">Aliexpress</a>.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196df6f9&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196df6f9" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Second-Picture.jpg" alt="OPA541 Module on AliExpress"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Like most things on Aliexpress, it looked too-good-to-be-true. I found an OPA541 breakout board with free shipping for $35. The OPA541 alone costs almost <a href="https://www.digikey.com/product-detail/en/texas-instruments/OPA541APG3/296-36130-5-ND/1572778">$22 from Digi-Key</a> in single quantity. So, I ordered one plus a few SMA to BNC cables for $3 each.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196df80e&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196df80e" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Third-Picture.jpg" alt="OPA541 Module on Digi-Key website"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph"><em>Figure 2 – The OPA541 cost almost $22 in singles</em></p>



<p class="wp-block-paragraph"><em></em></p>



<p class="wp-block-paragraph"><em>Figure 3 – Inexpensive SMA to BNC cables</em></p>



<p class="wp-block-paragraph">A few weeks later, the unit arrived and looked to be as advertised.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196df977&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196df977" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Fifth-Picture.jpg" alt="Birds-eye view of OPA541 Module"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196dfa65&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196dfa65" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Sixth-Picture.jpg" alt="Side view of OPA541 Module"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">As expected, the amplifier came with zero documentation. The circuit looked simple, so I knew I could reverse engineer it if necessary. Instead, I decided to power it up and see what happened. It was immediately apparent that it used capacitive AC coupling because it only amplified AC signals while ignoring any DC offset applied.</p>



<p class="wp-block-paragraph">Having nothing to lose, I sent a message to the seller on Aliexpress asking for a schematic. I got back a one-word reply “email.”</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196dfb93&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196dfb93" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Seventh-Picture.jpg" alt="Chinese file sharing website"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">I sent him my email address, and he sent me a link and a password to a Chinese file-sharing site which yielded a PDF schematic of the device. Awesome!</p>



<figure class="wp-block-image size-full"><img fetchpriority="high" decoding="async" width="1534" height="865" src="https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic.png" alt="original schematic of function generator amplifier" class="wp-image-33070" srcset="https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic.png 1534w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-300x169.png 300w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-1024x577.png 1024w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-768x433.png 768w" sizes="(max-width: 1534px) 100vw, 1534px" /><figcaption class="wp-element-caption"><em>*Click to enlarge</em></figcaption></figure>



<p class="wp-block-paragraph">I noticed values for many components were not correct, so I marked up the schematic to show the actual values. The schematic is a little messy by my standards, but it was easy to see how it works. It is a two-stage amplifier. Both stages are set up as non-inverting with the first having a gain of 3 and the second a gain of 11 for a total gain of 33.</p>



<figure class="wp-block-image size-full"><img decoding="async" width="1314" height="810" src="https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-marked-up.png" alt="function generator amplifier original schematic marked up" class="wp-image-33071" srcset="https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-marked-up.png 1314w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-marked-up-300x185.png 300w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-marked-up-1024x631.png 1024w, https://static.dmcinfo.com/wp-content/uploads/2025/06/function-generator-amplifier-original-schematic-marked-up-768x473.png 768w" sizes="(max-width: 1314px) 100vw, 1314px" /><figcaption class="wp-element-caption"><em>*Click to enlarge</em></figcaption></figure>



<p class="wp-block-paragraph">The <strong>most insane thing I discovered</strong> was that the first stage OP Amp is an OPA445, a high voltage OP Amp that costs over <a href="https://www.digikey.com/product-detail/en/texas-instruments/OPA445AU/OPA445AU-ND/301298">$10 in single quantity</a>!</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196dfd64&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196dfd64" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Eleventh-Picture.jpg" alt="OP Amp from Digi-Key"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">This, plus the OP541 (which costs $21), means I got $31 in chips alone for $35. Assuming these parts are legit, that’s a good deal in my book. Even if the OP Amps are counterfeit, the PCB, heatsink, and connectors are still worth $35 when considering that my alternative was to design and make my own from scratch.</p>



<p class="wp-block-paragraph"><br>
<em>Figure 4 &#8211;&nbsp;OP Amp for OPA541 Module</em></p>



<p class="wp-block-paragraph">Below are side-by-side comparisons of the parts from China and ones purchased directly from Digi-Key. They don’t look&nbsp;identical, so I’m not sure if the parts from China are genuine.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196dfeb2&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196dfeb2" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twelfth-Picture-Resized.jpg" alt="Difference in OP Amps OPA541 module from Digi-Key and from China"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196dff97&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196dff97" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Thirteenth-Picture-Resized.jpg" alt="Difference in OP Amps OPA541 module from Digi-Key and from China"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">There are two variants of the OPA541AP. One has a G3 suffix. Perhaps this explains the difference between the packages.</p>



<p class="wp-block-paragraph"><strong>If anyone knows more about these ICs, please feel free to write in the comments.</strong></p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e00c7&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e00c7" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Fourteenth-Picture.jpg" alt="Options for OPA541 modules from Texas Instruments"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">To allow the device to amplify DC, I replaced C4 and C5 with 0 Ohm resistors. See below where I <span style="background-color: rgb(245, 246, 245);">removed</span><span style="background-color: rgb(245, 246, 245);">&nbsp;</span><span style="background-color: rgb(245, 246, 245);">C4</span><span style="background-color: rgb(245, 246, 245);">&nbsp;</span>enabling me to solder a 0 Ohm resistor in its place.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e01d5&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e01d5" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Fifteenth-Picture.jpg" alt="Image of OPA541 with replaced C4 and C5 Ohm resistors to allow for DC current"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<h2 id="h-other-changes" class="wp-block-heading"><br>
Other Changes</h2>



<p class="wp-block-paragraph">I changed the overall gain to 10 to simplify the mental math required.</p>



<p class="wp-block-paragraph">To change the gains, I did the following:</p>



<ul class="wp-block-list">
<li>R2 changed to 10k. Since R1 was already 10k, this set the first stage gain to 2. [1+10k/10k = 2]</li>



<li>R4 changed to 2.55k, and R7 changed to 10.2k which set the second stage gain to 5. [1+10.2k/2.55k = 5]</li>



<li>Upgraded the main Sanyo brand capacitors with Panasonic 63V rated caps because the original caps were only rated for 35 volts despite the schematic calling for a 50-volt rating.</li>
</ul>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e037b&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e037b" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Sixteenth-Picture.jpg" alt="Upgraded main 34V Sanyo brand capacitors to Panasonic 63V capacitors"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>



<h2 id="h-final-schematic" class="wp-block-heading">Final Schematic</h2>


<div>Below is the final schematic including all of my modifications.</div>


<figure class="wp-block-image size-full"><img decoding="async" width="800" height="486" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/OPA541-Final-Schematic-Thumbnail-1.jpg" alt="DIY Function Generator Amplifier Schematic" class="wp-image-24267" srcset="https://static.dmcinfo.com/wp-content/uploads/2025/05/OPA541-Final-Schematic-Thumbnail-1.jpg 800w, https://static.dmcinfo.com/wp-content/uploads/2025/05/OPA541-Final-Schematic-Thumbnail-1-300x182.jpg 300w, https://static.dmcinfo.com/wp-content/uploads/2025/05/OPA541-Final-Schematic-Thumbnail-1-768x467.jpg 768w" sizes="(max-width: 800px) 100vw, 800px" /><figcaption class="wp-element-caption"><em>*Click to enlarge</em></figcaption></figure>



<h2 id="h-testing" class="wp-block-heading"><br>
Testing</h2>



<p class="wp-block-paragraph">With the modifications complete, it was time to test the performance.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e052f&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e052f" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Seventeenth-Picture.jpg" alt="Modified OPA541 module"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">I connected the amplifier to our Rigol DP832 and configured the DP832 to provide +/-30 volts as shown in the diagram below.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e063c&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e063c" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Eighteenth-Picture.jpg" alt="Amplifier connected to Rigol DP832 with configured DP832 providing +/- 30 volts"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">For the first test, I fed in a constant DC signal voltage of 2.5 volts. As expected, the amplifier output a constant voltage of 25 volts thanks to our 10x gain. We fed the output to our BK Precision 8600 programmable load and set it to pull 2.9 Amps, which is close to the maximum of 3 Amps for our Rigol DP832 Power Supply. We were able to source over 72 Watts to the programmable load! Sweet!</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e074a&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e074a" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Nineteeth-Picture.jpg" alt="BK Precision 8600 pulling 2.9 Amps"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Our power supply was running close to its maximum output of 3 Amps and supplying 87.7 Watts. Since it was providing 87.7 Watts and our load is pulling 72.3 Watts, the amplifier would have been dissipating the difference between those two values, or 15.4 Watts.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e0857&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e0857" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twentieth-Picture.jpg" alt="Rigol DP832 Power Supply supplying 87.7 Watts"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">The thermal image (and the burn on my hand from touching the OPA541) confirms the amp was getting hot.</p>



<figure class="wp-block-image"><img decoding="async" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twenty-First-Picture.jpg" alt="Thermal Image of OPA541 temperature increase"/></figure>



<p class="wp-block-paragraph">It got hot but was still operating below its 125˚C limit as shown in the datasheet snippet below:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e09ba&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e09ba" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twenty-Second-Picture.jpg" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">To minimize heat dissipation, we have to remember to set our power supply voltage just a few volts above our desired max voltage output from the amplifier. Doing so will reduce the voltage differential and hence&nbsp;reduce the power dissipated by the amp.</p>



<p class="wp-block-paragraph">Next, I connected two 12v automotive light bulbs in series to act as a load and connect&nbsp;our differential Oscilloscope probe across the load.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e0ae7&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e0ae7" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twenty-Third-Picture.jpg" alt="Two 12v automotive light bulbs in series to act as a load connect differential Oscilloscope probes"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">I then connected the function generator and set up a 1kHz sine wave set to 2.5 volts peak to peak.&nbsp;</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e0bee&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e0bee" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twenty-Fourth-Picture.jpg" alt="Function generator set up to 1kHz"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>



<p class="wp-block-paragraph">The Oscilloscope shows a ~25-volt peak sine wave at 1kHz as expected.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e0d17&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e0d17" class="wp-block-image wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Twenty-Sixth-Picture.jpg" alt="Picture of Oscilloscope showing 25 volt peak at 1kHz"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Below is a video showing the same setup but at 0.5Hz instead.</p>



<h2 id="h-conclusion" class="wp-block-heading"><iframe loading="lazy" allowfullscreen="" frameborder="0" height="500" scrolling="no" src="https://www.youtube.com/embed/Zy8LhpA_Mfk" width="100%"><!--cke_bookmark_198S--><!--cke_bookmark_198E--></iframe><br>
<br>
Conclusion</h2>



<p class="wp-block-paragraph">Overall, I’m quite pleased with my $40 investment. A few weeks of waiting followed by a few minutes of soldering yielded a nice addition to the test bench. It will come in handy for testing future electronic designs.</p>



<p class="wp-block-paragraph">Learn More About&nbsp;<a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming">DMC&#8217;s Embedded Development and Embedded Programming Services</a>&nbsp;or <a href="https://static.dmcinfo.com/contact">Contact Us</a> to start developing a solution that works.</p>
<p>The post <a href="https://static.dmcinfo.com/blog/24248/low-cost-function-generator-amplifier-diy/">Low Cost Function Generator Amplifier DIY</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>The Product Development Process: How to Bring Your Product to Market</title>
		<link>https://static.dmcinfo.com/blog/25824/the-product-development-process-how-to-bring-your-product-to-market/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Tue, 15 Mar 2016 15:45:38 +0000</pubDate>
				<category><![CDATA[Circuit Design]]></category>
		<category><![CDATA[Embedded Development & Programming]]></category>
		<category><![CDATA[Product Development]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[UI/UX]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/25824/the-product-development-process-how-to-bring-your-product-to-market/</guid>

					<description><![CDATA[<p>Have you ever had a product design idea? Our engineers created this overview of the product development process to&#160;demystify how to bring your product to market.&#160; Learn more about DMC&apos;s Custom Software and Hardware Development services.</p>
<p>The post <a href="https://static.dmcinfo.com/blog/25824/the-product-development-process-how-to-bring-your-product-to-market/">The Product Development Process: How to Bring Your Product to Market</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p class="wp-block-paragraph">Have you ever had a product design idea?</p>

<p class="wp-block-paragraph">Our engineers created this overview of the product development process to&nbsp;demystify how to bring your product to market.&nbsp;</p>

<p class="wp-block-paragraph"><iframe loading="lazy" allowfullscreen="" frameborder="0" height="360" src="https://www.youtube.com/embed/jS-rD6HuxIk?rel=0" width="640"></iframe></p>

<p class="wp-block-paragraph"><strong>Learn more about DMC&apos;s <a href="https://static.dmcinfo.com/services/embedded-development-and-embedded-programming">Custom Software and Hardware Development</a> services.</strong></p>
<p>The post <a href="https://static.dmcinfo.com/blog/25824/the-product-development-process-how-to-bring-your-product-to-market/">The Product Development Process: How to Bring Your Product to Market</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Informational Webinar 11/12: Changing Machinery, Changing Software</title>
		<link>https://static.dmcinfo.com/blog/27084/informational-webinar-11-12-changing-machinery-changing-software/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Wed, 05 Nov 2014 10:47:56 +0000</pubDate>
				<category><![CDATA[Announcements]]></category>
		<category><![CDATA[PLC]]></category>
		<category><![CDATA[Siemens PLC]]></category>
		<category><![CDATA[Special Events]]></category>
		<category><![CDATA[Hardware]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/27084/informational-webinar-11-12-changing-machinery-changing-software/</guid>

					<description><![CDATA[<p>Join John Sullivan in conjunction with Siemens for a complimentary 45-minute educational webinar focused on converting industrial equipment from one vendor&#8217;s tools to another. The webinar will be held on Wednesday, November 12 (1 p.m. CDT) and will be targeted toward those interested in software conversions for machinery. A variety of business demands can require a company [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/27084/informational-webinar-11-12-changing-machinery-changing-software/">Informational Webinar 11/12: Changing Machinery, Changing Software</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">Join <a href="/about/employee-bios/john-sullivan">John Sullivan</a> in conjunction with Siemens for a complimentary 45-minute educational webinar focused on converting industrial equipment from one vendor&#8217;s tools to another. The webinar will be held on <strong>Wednesday, November 12 (1 p.m. CDT)</strong> and will be targeted toward those interested in software conversions for machinery.</p>



<p class="wp-block-paragraph">A variety of business demands can require a company to convert their industrial equipment from one vendor’s gear to another supplier’s tools. The most common reasons for conversion include: improving market position, maintaining and keeping up with corporate standards, pursuing new business opportunities or increasing financial advantages. In any of these instances, software is likely the biggest area of concern during transition. Nonetheless, conversions can be managed effectively when companies plan their conversion strategy well.&nbsp;</p>



<p class="wp-block-paragraph">In light of these concerns, John will talk about three different approaches to converting software code for a company that is adapting their industrial equipment from one vendor’s to another&#8217;s.</p>



<p class="wp-block-paragraph"><strong>Benefits of Attending:</strong></p>



<ul class="wp-block-list">
<li>Learn the advantages of converting industrial equipment and software</li>



<li>Understand pitfalls and areas of concern in order to ensure a smooth transition&nbsp;</li>



<li>Delve into three strategies for converting software and learn the pros and cons of each approach</li>



<li>Explore conversion tools available to help you speed up the conversion process</li>



<li>Find out when a systems integrator can bring value to your conversion</li>



<li>Discover how to choose the right SI to meet your unique needs</li>
</ul>



<p class="wp-block-paragraph"><strong>Presenter Bio:</strong></p>



<p class="wp-block-paragraph"><img decoding="async" alt="" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/john_sullivan.jpg">John Sullivan holds a B.S. in Mechanical Engineering from Rose-Hulman Institute of Technology with a certificate in robotics. He is a Licensed Professional Engineer in the State of Illinois, and is a Certified Siemens Solution Partner, LabVIEW Developer, and Microsoft Certified Professional (MCP). John&#8217;s previous work experience includes Solar Turbines and General Electric-Aviation. He enjoys athletics of all kinds, including rugby, volleyball, and running, as well as outdoor activities such as backpacking and skiing.</p>



<p class="wp-block-paragraph"><strong>Register for Changing Machinery, Changing Software</strong>.</p>
<p>The post <a href="https://static.dmcinfo.com/blog/27084/informational-webinar-11-12-changing-machinery-changing-software/">Informational Webinar 11/12: Changing Machinery, Changing Software</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>View DMC&#8217;s 2014 Siemens Automation Summit Presentations</title>
		<link>https://static.dmcinfo.com/blog/27442/view-dmcs-2014-siemens-automation-summit-presentations/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Tue, 08 Jul 2014 13:12:15 +0000</pubDate>
				<category><![CDATA[HMI and SCADA]]></category>
		<category><![CDATA[Manufacturing Automation & Intelligence]]></category>
		<category><![CDATA[PLC]]></category>
		<category><![CDATA[Siemens PLC]]></category>
		<category><![CDATA[Special Events]]></category>
		<category><![CDATA[WinCC]]></category>
		<category><![CDATA[WinCC OA]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/27442/view-dmcs-2014-siemens-automation-summit-presentations/</guid>

					<description><![CDATA[<p>DMC attended the annual Siemens Automation Summit last month, held&#160;June 23 &#8211; 26, 2014. We enjoyed four days of learning and networking with new friends at Walt Disney World&#8217;s Contemporary Resort in Orlando, FL. The week kicked off with Monday night&#8217;s popular Connect Event. This casual cocktail event allowed attendees to build their network using [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/27442/view-dmcs-2014-siemens-automation-summit-presentations/">View DMC&#8217;s 2014 Siemens Automation Summit Presentations</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">DMC attended the annual Siemens Automation Summit last month, held&nbsp;June 23 &#8211; 26, 2014. We enjoyed four days of learning and networking with new friends at Walt Disney World&#8217;s Contemporary Resort in Orlando, FL.</p>



<p class="wp-block-paragraph">The week kicked off with Monday night&#8217;s popular Connect Event. This casual cocktail event allowed attendees to build their network using a mobile-friendly app or website developed by DMC and Prism Systems to connect and share contact information. Attendees also got a preview of the cool Anki DRIVE racetracks that would be at the Siemens Solution Partner booth for the rest of the event. Attendees could choose to race their friends using conventional iPads or Siemens Mobile Panels developed by DMC to control the Bluetooth racetrack.</p>



<p class="wp-block-paragraph">The rest of the week involved unique presentations, training classes, technology demonstrations, and finished off with a keynote by Eric Alexander and an after party at the Expedition Everest theme park!</p>



<p class="wp-block-paragraph">DMC led four presentations throughout the week. Due to the great response, we&#8217;ve made the presentation slideshows available. Feel free to <strong><a href="/contact">contact DMC</a></strong> with any questions regarding this content.</p>



<p class="wp-block-paragraph"><strong><a href="https://www.slideshare.net/DMCChicago/siemens-summit-2014-getting-the-most-out-of-win-cc-oa?qid=a3a142b6-2d5e-4ab9-bfdd-dcd94c50aebc&amp;v=qf1&amp;b=&amp;from_search=1" target="_blank">Getting the Most Out of WinCC OA</a> &#8211; Kristie Shea</strong><br> Explore some of the unique benefits of the Siemens Open Architecture SCADA platform and learn about specific projects where these object-oriented tools were used to meet demanding requirements without changing a single line of PLC code. Based on a project&#8217;s requirements, learn how to best choose between the three different Siemens SCADA offerings: WinCC OA, WinCC V7 or WinCC TIA Professional.</p>



<p class="wp-block-paragraph"><strong><a href="https://www.slideshare.net/DMCChicago/siemens-summit-2014-dmc-best-practices-working-with-solution-partners" target="_blank">Best Practices for Selecting and Working with a Solution Partner</a> &#8211; Tim Jager&nbsp;</strong><br>
Get an insider&#8217;s view on how to best work with solution partners to maximize your return on investment. Learn when to use an integrator and how to choose the right integrator.&nbsp;</p>



<p class="wp-block-paragraph"><strong><a href="https://www.slideshare.net/DMCChicago/sully-siemens-summit-2014-utilizing-siemens-best-practices-when-leveraging-existing-rockwell-code?qid=a3a142b6-2d5e-4ab9-bfdd-dcd94c50aebc&amp;v=qf1&amp;b=&amp;from_search=2" target="_blank">Utilizing Siemens Best Practices When Leveraging Existing Rockwell Code</a> &#8211; John Sullivan</strong><br> Are you in the process of switching to Siemens hardware from Rockwell, but already have a working Rockwell program? Some people try to copy it over directly and miss out on the great opportunity that Siemens provides to make your code more flexible and reliable.</p>



<p class="wp-block-paragraph"><strong><a href="https://www.slideshare.net/DMCChicago/dmc-siemens-summit-presentation-by-alex-krejcie" target="_blank">Extending S7 PLC Capabilities by Leveraging the Unique Strengths of the WinAC Platform</a>&nbsp;<br>
&#8211; Alex Krejcie</strong><br>
Automation applications often have specific hardware and software requirements that pose integration challenges for system designers. The WinAC RTX platform is commonly used to provide deterministic real-time algorithm processing in a PC environment. See how DMC has been able to reduce application costs through hardware simplification and quicker development time by leveraging the unique capabilities of the WinAC platform.</p>


<div class="video-embed-container"><iframe src="//www.youtube.com/embed/cDlfYWYxg38?showinfo=0">&amp;lt;!&#8211;{cke_protected}{C}%3C!%2D%2Dcke_bookmark_195S%2D%2D%3E&#8211;&amp;gt;&amp;lt;!&#8211;{cke_protected}{C}%3C!%2D%2Dcke_bookmark_195E%2D%2D%3E&#8211;&amp;gt;</iframe></div><p>The post <a href="https://static.dmcinfo.com/blog/27442/view-dmcs-2014-siemens-automation-summit-presentations/">View DMC&#8217;s 2014 Siemens Automation Summit Presentations</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>DMC Joins Siemens SIMATIC IT Partner Program</title>
		<link>https://static.dmcinfo.com/blog/27455/dmc-joins-siemens-simatic-it-partner-program/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Mon, 23 Jun 2014 10:37:38 +0000</pubDate>
				<category><![CDATA[Announcements]]></category>
		<category><![CDATA[Manufacturing Automation & Intelligence]]></category>
		<category><![CDATA[MES]]></category>
		<category><![CDATA[PLC]]></category>
		<category><![CDATA[Siemens PLC]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/27455/dmc-joins-siemens-simatic-it-partner-program/</guid>

					<description><![CDATA[<p>DMC is proud to announce its affiliation with the Siemens SIMATIC IT Partner Program. SIMATIC IT Partners offer value added services helping customers realize solutions tailored to their unique business environments in order to maximize the efficiency of MES installations. We&#8217;re excited to join a community of technical experts with industry specific know-how who are recognized [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/27455/dmc-joins-siemens-simatic-it-partner-program/">DMC Joins Siemens SIMATIC IT Partner Program</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">DMC is proud to announce its affiliation with the <a href="http://w3.siemens.com/mcms/mes/en/serviceandsupport/valueaddedservices/Pages/Default.aspx" target="_blank" rel="noreferrer noopener">Siemens SIMATIC IT Partner Program</a>. SIMATIC IT Partners offer value added services helping customers realize solutions tailored to their unique business environments in order to maximize the efficiency of MES installations.</p>



<p class="wp-block-paragraph">We&#8217;re excited to join a community of technical experts with industry specific know-how who are recognized as high-level consultants dedicated to helping customers achieve their business goals. SIMATIC IT Partners are proficient in attaining production process transparency, identifying requirements, and developing, maintaining, and implementing leading MES solutions based on SIMATIC IT.</p>



<p class="wp-block-paragraph">The SIMATIC IT partnership is a strong compliment to DMC’s long-standing position as a Siemens Automation Solution Partner. We have successfully implemented hundreds of project solutions using <a href="/services/manufacturing-automation-and-intelligence/plc-programming/siemens-s7-plc-programming">Siemens PLCs</a> and in all aspects of the SIMATIC development environment.&nbsp;</p>



<p class="wp-block-paragraph">“With experience in both Siemens SIMATIC IT and Automation, our engineers and consultants are uniquely qualified to implement effective solutions bridging automation, Manufacturing Execution Systems (MES), and Enterprise Resource Planning (ERP) systems,” said DMC Senior Project Engineer, Kevin Ferrigno.</p>



<p class="wp-block-paragraph">DMC&#8217;s SIMATIC IT Partnership status is a formal recognition of our dedication to providing our clients superior MES solutions.</p>
<p>The post <a href="https://static.dmcinfo.com/blog/27455/dmc-joins-siemens-simatic-it-partner-program/">DMC Joins Siemens SIMATIC IT Partner Program</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Siemens S7-1200 Web Server Tutorial &#8211; From Getting Started to HTML5 User Defined Pages</title>
		<link>https://static.dmcinfo.com/blog/28315/siemens-s7-1200-web-server-tutorial-from-getting-started-to-html5-user-defined-pages/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Wed, 03 Jul 2013 13:17:22 +0000</pubDate>
				<category><![CDATA[Manufacturing Automation & Intelligence]]></category>
		<category><![CDATA[PLC]]></category>
		<category><![CDATA[Siemens PLC]]></category>
		<category><![CDATA[Hardware]]></category>
		<category><![CDATA[How To]]></category>
		<category><![CDATA[HTML and CSS]]></category>
		<category><![CDATA[Scripting]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/28315/siemens-s7-1200-web-server-tutorial-from-getting-started-to-html5-user-defined-pages/</guid>

					<description><![CDATA[<p>This is a brief tutorial on getting started with the Siemens embedded web server in the S7-1200 and S7-1500. &#160;Using the concepts explained below, you can create a simple web page or a fully featured HTML5 web app.&#160; Getting Started Step 1:&#160; Turn on the web server. &#160;To do this, navigate to the web server [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/28315/siemens-s7-1200-web-server-tutorial-from-getting-started-to-html5-user-defined-pages/">Siemens S7-1200 Web Server Tutorial &#8211; From Getting Started to HTML5 User Defined Pages</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">This is a brief tutorial on getting started with the Siemens embedded web server in the <a href="/services/manufacturing-automation-and-intelligence/plc-programming/siemens-s7-plc-programming">S7-1200 and S7-1500</a>. &nbsp;Using the concepts explained below, you can create a simple web page or a fully featured HTML5 web app.&nbsp;</p>


<div>
<hr />


<h2 id="h-getting-started" class="wp-block-heading">Getting Started</h2>



<p class="wp-block-paragraph"><strong>Step 1:</strong>&nbsp; Turn on the web server. &nbsp;To do this, navigate to the web server menu in the device configuration page and check the box to enable the web server.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5274&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5274" class="wp-block-image aligncenter size-large wp-lightbox-container"><img decoding="async" width="1024" height="944" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/EnableWebserver-1024x944.png" alt="EnableWebserver" class="wp-image-28281" srcset="https://static.dmcinfo.com/wp-content/uploads/2025/05/EnableWebserver-1024x944.png 1024w, https://static.dmcinfo.com/wp-content/uploads/2025/05/EnableWebserver-300x276.png 300w, https://static.dmcinfo.com/wp-content/uploads/2025/05/EnableWebserver-768x708.png 768w, https://static.dmcinfo.com/wp-content/uploads/2025/05/EnableWebserver.png 1185w" sizes="(max-width: 1024px) 100vw, 1024px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph"><strong>Step 2:</strong> Download your project to your PLC and browse to its IP address using your web browser. &nbsp;You will see the default Siemens PLC Web server.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e53b5&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e53b5" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Default-Pages-1.png" alt="Siemens s7-1200 Web Server"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">You can view the <strong>Diagnostic Buffer</strong>. &nbsp;This is really helpful.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e556d&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e556d" class="wp-block-image aligncenter size-large wp-lightbox-container"><img decoding="async" width="1024" height="510" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DiagnosticBuffer-1024x510.png" alt="S7DiagnosticBuffer" class="wp-image-28283" srcset="https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DiagnosticBuffer-1024x510.png 1024w, https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DiagnosticBuffer-300x149.png 300w, https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DiagnosticBuffer-768x383.png 768w, https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DiagnosticBuffer.png 1094w" sizes="(max-width: 1024px) 100vw, 1024px" /><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;The variable status page allows you to view and modify PLC tags. &nbsp;This is great for debugging, but be careful. &nbsp;You will be directly editing PLC values!</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5690&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5690" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/S7VariableStatus.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">If your PLC is configured to save data logs, you can easily download the log files from the Data Logs page and open them in Excel.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e57a1&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e57a1" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/S7DataLogs.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">The default website is perfect for troubleshooting and looks great on a tablet.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e58b0&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e58b0" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/S7iPad.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-user-pages" class="wp-block-heading">User Pages</h2>



<p class="wp-block-paragraph">Before enabling User-defined pages in the PLC, we need to create an HTML file for our user page. &nbsp;Create a text file called <em>&#8220;index.htm&#8221;</em> and save it to a folder on your computer (i.e. <em>&#8220;C:\UserPages&#8221;</em>).</p>



<p class="wp-block-paragraph">&nbsp;</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5a2b&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5a2b" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/HelloWorld.png" alt="" style="width:774px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">The file contents should look like this:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!DOCTYPE html>
&lt;html lang="en">
&lt;head>
    &lt;meta charset="utf-8">
    &lt;title>My Title&lt;/title>
&lt;/head>
&lt;body>
    Hello World
&lt;/body>
&lt;/html></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">lang</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;en&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">My Title</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    Hello World</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph"><span style="line-height: 1.5;">Now we can enable the user pages and use this file we created. To enable user pages, navigate to the <strong>device configuration -&gt; Web server -&gt; User-defined Web pages</strong>. &nbsp;Set the HTML Directory to the folder you created and the Default HTML page to the file you created. &nbsp;Then click Generate Blocks to compile the user page:&nbsp;</span></p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5b82&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5b82" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/EnablingUSerPages.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">You will notice that the &#8220;Generate Blocks&#8221; function creates two new data blocks in your project, and you may be wondering what these are for. &nbsp;</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5c91&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5c91" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/DB334.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-fragments" class="wp-block-heading">Fragments</h2>



<p class="wp-block-paragraph">Fragments are the name given to each file in your user pages folder. Initially, we just created a single &#8220;index.htm&#8221; file, but let&#8217;s suppose you had several files in this folder. &nbsp;It would look something like this:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5de6&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5de6" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/FragmentsFolder.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">When you click the <strong>&#8220;Generate Blocks&#8221;</strong> button, the compiler takes all of these files and copies each byte into an array in the element of the Fragment data blocks. &nbsp;The first Fragment DB starts at DB334. An array is dimensioned for each file.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e5ef9&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e5ef9" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/FragmentsCompiledToDataBlock.png" alt="" style="width:952px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Below you can see how each byte from the file is packed into the array:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e600b&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e600b" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/FilesASCIIValuesSavedAsArrays.png" alt="" style="width:692px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">As you add more files to your folder, you may exceed the maximum number of bytes that can be contained in a data block, when this happens, another sequential data block is created. You can include HTML files, JavaScript, CSS Files, and even image files. &nbsp;They will all get converted into data block fragments:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e611c&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e611c" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/DBsCreatedAsRequired.png" alt="" style="width:589px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-www-function" class="wp-block-heading">WWW Function</h2>



<p class="wp-block-paragraph">In order for user pages to work, you have to call the WWW Function in your project. &nbsp;Recall the DBs created by the &#8220;Generate Blocks&#8221; function. We already know that DB334 stores the fragments. &nbsp;DB333 is used in conjunction with the WWW Function to control the retrieval and delivery of the fragments:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e626c&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e626c" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/DB333.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Insert the WWW Function into your code. &nbsp;Compile and download your project.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6377&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6377" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/WWW_FunctionBlock.png" alt="" style="width:672px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">This function process requests from the browser and synchronizes the data in the User Pages. &nbsp;It handles retrieving the correct fragment from the Fragment data blocks as shown below:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6482&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6482" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/WWW-Fragment-Retrieval.png" alt="" style="width:818px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">If you browse to the IP Address of your PLC, you will see the main Siemens Web server login page. &nbsp;There is a link on the left for User Pages. &nbsp;The name in the hyperlink matches the Application name you specified in the User-defined Pages config screen in TIA Portal:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e658e&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e658e" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/User-Pages-Hyperlink.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">If you click this link, you will see your Hello World page:&nbsp;</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6697&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6697" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/User-Pages-Hello-World.png" alt="" style="width:742px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">The format of the User-defined web page URL is as follows. I&#8217;m not sure what &#8220;awp&#8221; means, but it is a required part of the URL:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e67a4&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e67a4" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/URL-Structure.png" alt="" style="width:686px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>


<hr />


<h2 id="h-reading-plc-data" class="wp-block-heading">Reading PLC Data</h2>



<p class="wp-block-paragraph">In order to read PLC data we need to modify our file to include a special reference to the tag we are trying to read. &nbsp;First create a data block called &#8220;webdata&#8221; and add define an integer variable called &#8220;counter.&#8221; &nbsp;In your PLC, add some code to make this increment around every second:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e68d3&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e68d3" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/CounterVariable.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Download your project and then go online with the PLC to verify that the value is incrementing:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e69d9&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e69d9" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Counter.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Now modify your &#8220;index.htm&#8221; as follows:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!DOCTYPE html>

&lt;html>
    &lt;head>
        &lt;meta charset="utf-8">
        &lt;title>My Title&lt;/title>
    &lt;/head>

    &lt;body>
        :="webdata".counter:
    &lt;/body>
&lt;/html></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">My Title</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        :=&quot;webdata&quot;.counter:</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph">Notice the tag name is prefixed with &#8220;:=&#8221; and suffixed with &#8220;:&#8221; &nbsp;This is the key to injecting variables into the user page. When the page is rendered it will replace the token with the actual PLC tag value.</p>



<p class="wp-block-paragraph">&nbsp;</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6b3d&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6b3d" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/PLC-Tag-Token.png" alt="" style="width:589px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Next, click the &#8220;Generate Blocks&#8221; button in the Webserver config and download the program to the PLC. &nbsp;When you browse to the user page, you will see the counter value update when the page is refreshed. &nbsp;<span style="text-decoration: underline;">Notice how the page flickers when refreshed.</span>&nbsp; This can be annoying if you are trying to make your web page look and feel like a traditional HMI.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6c45&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6c45" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/TagDisplay.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Below is an example of how annoying these page refreshes can be. &nbsp;If you have an image on your page it will flicker as the page is refreshed. &nbsp;In the example below, the page is automatically refreshed by adding a specific meta-tag to the HTML header.</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(1 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;head>
    &lt;meta charset="utf-8">

    &lt;meta http-equiv="refresh" content="1">
    &lt;!-- meta tag refreshes page every second -->

    &lt;title>DMC Demo - Auto Refresh&lt;/title>
&lt;/head></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">http-equiv</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;refresh&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">content</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;1&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">&lt;!-- meta tag refreshes page every second --&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">DMC Demo - Auto Refresh</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6d66&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6d66" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/annoyingPageRefresh.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-reading-data-using-javascript" class="wp-block-heading">Reading Data Using Javascript</h2>



<p class="wp-block-paragraph">To avoid the annoying page flickering, we need to employ some JavaScript to read the data and refresh the screen in the background. &nbsp;</p>



<p class="wp-block-paragraph">To demonstrate this, the first step is to move the PLC tags from our main page to a new page. &nbsp;The new page will not contain any HTML, it will just be a simple HTML file with a single tag reference. &nbsp;Create a new file and name it something like &#8220;IOCounter.htm&#8221; (I am prefixing the name with &#8220;IO&#8221; to remind myself that this file is used for data Input and Output). &nbsp;The contents of your original &#8220;index.htm&#8221; should be modified as shown below. &nbsp;Notice that we moved the tag reference&nbsp;<span style="text-align: center; line-height: 1.5;"><em style="font-weight: bold;">:=&#8221;webdata&#8221;.counter: </em>to a new file called &#8220;IOCounter.htm&#8221; and replaced it with a label with the id=&#8221;counter.&#8221;</span>&nbsp; We also included the popular JavaScript library JQuery. &nbsp;You will need to download <a href="http://jquery.com/download/">JQuery</a> and copy it to your &#8220;UserFiles&#8221; directory. &nbsp;My &#8220;UserFiles&#8221; directory looks like this:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e6ed2&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e6ed2" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/IOCounterUserPagesFolder.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>



<p class="wp-block-paragraph"><strong>IOCounter.htm</strong></p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(1 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>:= "webdata".counter:</textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #D4D4D4">:= &quot;webdata&quot;.counter:</span></span></code></pre></div>



<p class="wp-block-paragraph"><strong>Index.htm:</strong></p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!DOCTYPE html>
&lt;html lang="en">
&lt;head>
    &lt;meta charset="utf-8">
    &lt;title>Javascript Example&lt;/title>

    -2.0.2.min.js">&lt;/script>
&lt;/head>

&lt;body>
    &lt;label id="counter">0&lt;/label>
&lt;/body>

&lt;script type="text/javascript">
    $(document).ready(function () {

        $.ajaxSetup({
            cache: false
        });

        setInterval(function () {

            $.get("IOCounter.htm", function (result) {
                $('#counter').text(result.trim());
            });

        }, 1000);

    });
&lt;/script>
&lt;/html></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">lang</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;en&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Javascript Example</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    -2.0.2.min.js&quot;&gt;</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">label</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">id</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;counter&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">0</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">label</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">script</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;text/javascript&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #9CDCFE">document</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">ready</span><span style="color: #D4D4D4">(</span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> () {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">$</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">ajaxSetup</span><span style="color: #D4D4D4">({</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">cache:</span><span style="color: #D4D4D4"> </span><span style="color: #569CD6">false</span></span>
<span class="line"><span style="color: #D4D4D4">        });</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #DCDCAA">setInterval</span><span style="color: #D4D4D4">(</span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> () {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">$</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">get</span><span style="color: #D4D4D4">(</span><span style="color: #CE9178">&quot;IOCounter.htm&quot;</span><span style="color: #D4D4D4">, </span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> (</span><span style="color: #9CDCFE">result</span><span style="color: #D4D4D4">) {</span></span>
<span class="line"><span style="color: #D4D4D4">                </span><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #CE9178">&apos;#counter&apos;</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">text</span><span style="color: #D4D4D4">(</span><span style="color: #9CDCFE">result</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">trim</span><span style="color: #D4D4D4">());</span></span>
<span class="line"><span style="color: #D4D4D4">            });</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        }, </span><span style="color: #B5CEA8">1000</span><span style="color: #D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    });</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph">The JavaScript function above retrieves the current tag value by requesting the contents of the file &#8220;IOCounter.htm&#8221; and then using this value to set the text of the Label with id=&#8221;counter.&#8221; &nbsp;This code runs automatically every second using the JavaScript <a href="http://www.w3schools.com/jsref/met_win_setinterval.asp">setInterval</a> function. &nbsp;The process is illustrated below:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e706f&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e706f" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/IOCounterDiagram.png" alt="" style="width:838px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">In the simple example above, we placed a single tag value in the file &#8220;IOCounter.htm&#8221;.  A more advanced option would be to put several tags in this file and format the text into a JSON structure.  This would allow you to update several tags on the screen using just one external data file.  Be careful though, <strong>as you add more tags to an HTML page, the page loading time increases. </strong></p>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-modifying-plc-tags-from-the-browser" class="wp-block-heading">Modifying PLC Tags From the Browser</h2>



<p class="wp-block-paragraph">A user web page would not be very helpful without allowing the user to modify PLC values. The following HTML page illustrates the simplest way of editing PLC tag values. &nbsp;The special comment field (AWP_In_Variable)&nbsp;at the top tells the PLC which tags are allowed to be modified. &nbsp;You will not be able to edit the tag values unless you include this comment for each tag.</p>



<p class="wp-block-paragraph">First create a new variable in the <strong>&#8220;webdata&#8221; DB:</strong></p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7200&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7200" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/myIntDeclaration.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">Then modify &#8220;index.htm&#8221; as follows:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!-- AWP_In_Variable Name='"webdata".myInt' -->

&lt;!DOCTYPE html>
&lt;html lang="en">
&lt;head>
    &lt;meta charset="utf-8">
    &lt;title>My Title&lt;/title>
&lt;/head>

&lt;body>

    := "webdata".myInt :

    &lt;form method="post">
        &lt;input
            name='"webdata".myInt'
            type="text" />

        &lt;button type="submit">
            Save
        &lt;/button>
    &lt;/form>

&lt;/body>
&lt;/html></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #6A9955">&lt;!-- AWP_In_Variable Name=&apos;&quot;webdata&quot;.myInt&apos; --&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">lang</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;en&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">My Title</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    := &quot;webdata&quot;.myInt :</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">form</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">method</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;post&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">input</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">name</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&apos;&quot;webdata&quot;.myInt&apos;</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;text&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #808080">/&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">button</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;submit&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">            Save</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">button</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">form</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph">The PLC will not allow you to modify values unless you are logged in. &nbsp;Make sure to log in before navigating to the editor page you just created. &nbsp;The default user name is <em>admin</em> and the default password is blank so you can leave that field empty.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7345&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7345" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/Login.png" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">After you have logged-in, browse to the page and go online with the PLC. &nbsp;You should be able to edit the tag value using the web page you just created. &nbsp;Notice how the page flickers when the save button is pressed. This is because a post-back is occurring and the page gets refreshed.</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e744d&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e744d" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/SimpleTagEditor.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>



<p class="wp-block-paragraph">In order to update PLC tags without experiencing the post-back, we can use some more JavaScript to update the value in the background. &nbsp;First, we need to create another HTML file and move our tag reference to it.</p>



<p class="wp-block-paragraph">In order to illustrate this, create a new variable in the &#8220;webdata&#8221; DB called <em>triangleWave. </em>&nbsp;Then write some code to make this value count up to 100 and then back down to -100, or whatever logic you like. &nbsp;Next create a new file called &#8220;IOtriangleWave.htm&#8221; that looks like this:</p>



<p class="wp-block-paragraph"><strong>&#8220;IOtriangleWave.htm&#8221;</strong></p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(1 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!-- AWP_In_Variable Name='"webdata".triangleWave' -->:="webdata".triangleWave:</textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #6A9955">&lt;!-- AWP_In_Variable Name=&apos;&quot;webdata&quot;.triangleWave&apos; --&gt;</span><span style="color: #D4D4D4">:=&quot;webdata&quot;.triangleWave:</span></span></code></pre></div>



<p class="wp-block-paragraph">The comment field tells the PLC that the triangleWave variable is editable and the&nbsp;<strong><em>:=&#8221;webdata&#8221;.triangleWave:&nbsp;</em></strong>&nbsp;allows us to query the current value of the variable by requesting the contents of &#8220;IOtriangleWave.htm&#8221;.</p>



<p class="wp-block-paragraph">Now modify &#8220;index.htm&#8221; as follows:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!-- AWP_In_Variable Name='"webdata".triangleWave' -->

&lt;!DOCTYPE html>
&lt;html lang="en">
&lt;head>
    &lt;meta charset="utf-8">
    &lt;title>JavaScript Example&lt;/title>

    &lt;script src="jquery-2.0.2.min.js">&lt;/script>
&lt;/head>

&lt;body>

    &lt;!-- Value updated automatically -->
    &lt;label id="triangleWave">
        := "webdata".triangleWave :
    &lt;/label>

    &lt;br>

    &lt;input id="setvar" type="text" />

    &lt;!-- Modify PLC variable without page refresh -->
    &lt;button id="btnModify">
        Modify
    &lt;/button>

    &lt;p>
        &lt;img
            src="logo-DMC.png"
            alt="DMC Logo">
    &lt;/p>

&lt;/body>

&lt;script type="text/javascript">

$(document).ready(function () {

    // Prevent browser caching
    $.ajaxSetup({
        cache: false
    });

    // Read PLC value every second
    setInterval(function () {

        $.get(
            "IOtriangleWave.htm",
            function (result) {

                $("#triangleWave").text(result);

            }
        );

    }, 1000);

    // Write PLC value
    $("#btnModify").click(function () {

        var url = "IOtriangleWave.htm";
        var name = '"webdata".triangleWave';
        var value = $("#setvar").val();

        var data =
            escape(name) + "=" + value;

        $.post(
            url,
            data,
            function (result) {
            }
        );

    });

});

&lt;/script>

&lt;/html></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #6A9955">&lt;!-- AWP_In_Variable Name=&apos;&quot;webdata&quot;.triangleWave&apos; --&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">lang</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;en&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">JavaScript Example</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">script</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;jquery-2.0.2.min.js&quot;</span><span style="color: #808080">&gt;&lt;/</span><span style="color: #569CD6">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">&lt;!-- Value updated automatically --&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">label</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">id</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;triangleWave&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        := &quot;webdata&quot;.triangleWave :</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">label</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">br</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">input</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">id</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;setvar&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;text&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #808080">/&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">&lt;!-- Modify PLC variable without page refresh --&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">button</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">id</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;btnModify&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        Modify</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">button</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">p</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">img</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;logo-DMC.png&quot;</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">alt</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;DMC Logo&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">p</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">body</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">script</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;text/javascript&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #9CDCFE">document</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">ready</span><span style="color: #D4D4D4">(</span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> () {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">// Prevent browser caching</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #9CDCFE">$</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">ajaxSetup</span><span style="color: #D4D4D4">({</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">cache:</span><span style="color: #D4D4D4"> </span><span style="color: #569CD6">false</span></span>
<span class="line"><span style="color: #D4D4D4">    });</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">// Read PLC value every second</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #DCDCAA">setInterval</span><span style="color: #D4D4D4">(</span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> () {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">$</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">get</span><span style="color: #D4D4D4">(</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #CE9178">&quot;IOtriangleWave.htm&quot;</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> (</span><span style="color: #9CDCFE">result</span><span style="color: #D4D4D4">) {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">                </span><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #CE9178">&quot;#triangleWave&quot;</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">text</span><span style="color: #D4D4D4">(</span><span style="color: #9CDCFE">result</span><span style="color: #D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">            }</span></span>
<span class="line"><span style="color: #D4D4D4">        );</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    }, </span><span style="color: #B5CEA8">1000</span><span style="color: #D4D4D4">);</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #6A9955">// Write PLC value</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #CE9178">&quot;#btnModify&quot;</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">click</span><span style="color: #D4D4D4">(</span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> () {</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #569CD6">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">url</span><span style="color: #D4D4D4"> = </span><span style="color: #CE9178">&quot;IOtriangleWave.htm&quot;</span><span style="color: #D4D4D4">;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #569CD6">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">name</span><span style="color: #D4D4D4"> = </span><span style="color: #CE9178">&apos;&quot;webdata&quot;.triangleWave&apos;</span><span style="color: #D4D4D4">;</span></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #569CD6">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">value</span><span style="color: #D4D4D4"> = </span><span style="color: #DCDCAA">$</span><span style="color: #D4D4D4">(</span><span style="color: #CE9178">&quot;#setvar&quot;</span><span style="color: #D4D4D4">).</span><span style="color: #DCDCAA">val</span><span style="color: #D4D4D4">();</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #569CD6">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">data</span><span style="color: #D4D4D4"> =</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #DCDCAA">escape</span><span style="color: #D4D4D4">(</span><span style="color: #9CDCFE">name</span><span style="color: #D4D4D4">) + </span><span style="color: #CE9178">&quot;=&quot;</span><span style="color: #D4D4D4"> + </span><span style="color: #9CDCFE">value</span><span style="color: #D4D4D4">;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">$</span><span style="color: #D4D4D4">.</span><span style="color: #DCDCAA">post</span><span style="color: #D4D4D4">(</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">url</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">data</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #569CD6">function</span><span style="color: #D4D4D4"> (</span><span style="color: #9CDCFE">result</span><span style="color: #D4D4D4">) {</span></span>
<span class="line"><span style="color: #D4D4D4">            }</span></span>
<span class="line"><span style="color: #D4D4D4">        );</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    });</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">});</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph">We also added an image to the file to show that the data is being read and written without any flickering or page refreshes:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7644&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7644" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/SaveDataNoPostback.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>


<hr />


<h2 id="h-server-side-logic-string-variables" class="wp-block-heading">Server Side Logic &#8211; String Variables</h2>



<p class="wp-block-paragraph">Full-featured web servers have powerful server-side engines that can dynamically generate HTML pages. The Siemens PLC has a small embedded server, but there are still a few server-side things that can be done.</p>



<p class="wp-block-paragraph">Up to this point, we have been experimenting with integer tag values. If you embed a string tag into your page and include some HTML formatting in the string value, it will render as HTML. &nbsp;Notice below that the string value is not displaying the exact values typed, but rather rendering as HTML:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7793&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7793" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/stringserverdata.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>



<p class="wp-block-paragraph">Below are the HTML values that were assigned to the string tag above:</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;font size="30" color="green">GREEN&lt;/font>

&lt;font size="40" color="red">RED&lt;/font>

&lt;ol>
    &lt;li>Message 1&lt;/li>
    &lt;li>Message 2&lt;/li>
    &lt;li>Message 3&lt;/li>
&lt;/ol>

&lt;ol>
    &lt;li>&lt;font color="blue">Information&lt;/font>&lt;/li>
    &lt;li>&lt;font color="orange">Warning&lt;/font>&lt;/li>
    &lt;li>&lt;font color="red">Error&lt;/font>&lt;/li>
&lt;/ol></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;</span><span style="color: #F44747">font</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">size</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;30&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">color</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;green&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">GREEN</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">font</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #F44747">font</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">size</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;40&quot;</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">color</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;red&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">RED</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">font</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">ol</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Message 1</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Message 2</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Message 3</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">ol</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">ol</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;&lt;</span><span style="color: #F44747">font</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">color</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;blue&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Information</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">font</span><span style="color: #808080">&gt;&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;&lt;</span><span style="color: #F44747">font</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">color</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;orange&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Warning</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">font</span><span style="color: #808080">&gt;&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;&lt;</span><span style="color: #F44747">font</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">color</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;red&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">Error</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">font</span><span style="color: #808080">&gt;&lt;/</span><span style="color: #569CD6">li</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;/</span><span style="color: #569CD6">ol</span><span style="color: #808080">&gt;</span></span></code></pre></div>



<h2 id="h-server-side-logic-delayed-delivery" class="wp-block-heading">Server Side Logic &#8211; Delayed Delivery</h2>



<p class="wp-block-paragraph">Another technique that is very powerful for performing server-side logic is <strong>Delayed Delivery</strong>. &nbsp;This is a technique that uses the WWW Function (in conjunction with DB333) to make the web-server wait before returning a requested page to the user. This allows the PLC to ensure that tag values are properly updated before being rendered on the web page. &nbsp;A typical example would be a recipe editor web page. &nbsp;The user selects a recipe from a dropdown box (which will cause a post-back and a page refresh). &nbsp;We must ensure that the new recipe values have been loaded into the PLC tags before refreshing the page. &nbsp;Normally the compiler automatically assigns a fragment number for each user-generated file. &nbsp;In order to control the delivery of pages (i.e. fragments), we must specify a fragment number in the HTML file as shown below:<span style="line-height: 1.5;">&nbsp;</span></p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(1 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!-- AWP_Start_Fragment Name="Control" Type="manual" ID="2" --></textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #6A9955">&lt;!-- AWP_Start_Fragment Name=&quot;Control&quot; Type=&quot;manual&quot; ID=&quot;2&quot; --&gt;</span></span></code></pre></div>



<p class="wp-block-paragraph">Adding this special comment to the top of your HTML file tells the compiler to use fragment #2 for this file. &nbsp;You can specify the fragment number by setting the ID field to the desired number.&nbsp;</p>



<p class="wp-block-paragraph">Now that we know our file will be fragment #2, we can control the delivery of the page to the browser. &nbsp;Below is a typical rung of ladder logic for implementing the delayed delivery of the page. &nbsp;In my example, the &#8220;continue&#8221; bit does not become true until the recipe loading is complete. &nbsp;In my case, the loading of a recipe required several PLC scans, so I needed to delay the page delivery until the recipe was loaded. &nbsp;Note that the PLC can support several simultaneous connections. &nbsp;If your application will support several simultaneous browser connections, you will have to replicate the code below for each index of the arrays shown. &nbsp;Currently only index 1 is handled in the code below. &nbsp;</p>


<div>


<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7976&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7976" class="wp-block-image aligncenter is-resized wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/DelayedDelivery.png" alt="" style="width:876px;height:auto"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>


</div>


<p class="wp-block-paragraph">Below is an example showing the recipe loading screen. &nbsp;The user selects a recipe from the drop-down which causes a PLC tag to be changed and the browser waits for a post-back from the web server. The PLC detects this change and starts loading the recipe (which takes several PLC scans). &nbsp;The web-server waits for the continue bit to be set before returning the page (fragment) is delayed until the recipe is loaded. &nbsp;This ensures that the tag values injected into the HTML page will be updated with the correct values before being sent to the browser. &nbsp;Below is a demonstration of this in action:</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7a82&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7a82" class="wp-block-image aligncenter wp-lightbox-container"><img decoding="async" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2025/05/RecipeEditor.gif" alt=""/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>



<p class="wp-block-paragraph">&nbsp;</p>


<hr />


<h2 id="h-conclusion" class="wp-block-heading">Conclusion</h2>



<p class="wp-block-paragraph">Knowing the basics and a few advanced tricks will enable you to create fully featured web pages served from a Siemens PLC. If you are comfortable with JavaScript, you can do some pretty amazing things and make a web page that looks and feels as good as a traditional HMI. &nbsp; Below is a simple example showing graphing, gauges, user input, and pop-up alerts. This looks and feels like a native app when running on my iPad or Android tablet. <strong>Click on the image below to see it in action.</strong> &nbsp;Happy coding!</p>



<figure data-wp-context="{&quot;imageId&quot;:&quot;6abf2196e7c7f&quot;}" data-wp-interactive="core/image" data-wp-key="6abf2196e7c7f" class="wp-block-image aligncenter size-full wp-lightbox-container"><img decoding="async" width="892" height="900" data-wp-class--hide="state.isContentHidden" data-wp-class--show="state.isContentVisible" data-wp-init="callbacks.setButtonStyles" data-wp-on--click="actions.showLightbox" data-wp-on--load="callbacks.setButtonStyles" data-wp-on--pointerdown="actions.preloadImage" data-wp-on--pointerenter="actions.preloadImageWithDelay" data-wp-on--pointerleave="actions.cancelPreload" data-wp-on-window--resize="callbacks.setButtonStyles" src="https://static.dmcinfo.com/wp-content/uploads/2013/07/S7WebserverDemo.gif" alt="" class="wp-image-33821"/><button
			class="lightbox-trigger"
			type="button"
			aria-haspopup="dialog"
			data-wp-bind--aria-label="state.thisImage.triggerButtonAriaLabel"
			data-wp-init="callbacks.initTriggerButton"
			data-wp-on--click="actions.showLightbox"
			data-wp-style--right="state.thisImage.buttonRight"
			data-wp-style--top="state.thisImage.buttonTop"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 12 12">
				<path fill="#fff" d="M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z" />
			</svg>
		</button></figure>


<div>&nbsp;</div>


<p class="wp-block-paragraph">EDIT: Below is a simple example of how to use the gauges shown in the demo above. &nbsp;The example below references the <strong>IOTriangleWave.htm</strong> that we created above.&nbsp;</p>



<div class="wp-block-kevinbatdorf-code-block-pro cbp-has-line-numbers" data-code-block-pro-font-family="Code-Pro-JetBrains-Mono" style="font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--cbp-line-number-color:#D4D4D4;--cbp-line-number-width:calc(2 * 0.6 * .875rem);line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)"><span style="display:flex;align-items:center;padding:16px 0 0 16px;width:100%;text-align:left;background-color:#1e1e1e"><span style="background:#c7c7c7;padding:0.3rem 0.5rem 0.2rem;border-radius:1rem;font-size:0.8em;line-height:1;height:1.25rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;color:#1e1e1e">HTML</span></span><span role="button" tabindex="0" style="color:#D4D4D4;display:none" aria-label="Copy" class="code-block-pro-copy-button"><pre class="code-block-pro-copy-button-pre" aria-hidden="true"><textarea class="code-block-pro-copy-button-textarea" tabindex="-1" aria-hidden="true" readonly>&lt;!DOCTYPE html>
&lt;html>
&lt;head>
    &lt;meta charset="utf-8">
    &lt;title>DMC Gage Demo&lt;/title>

    2.0.2.min.js">&lt;/script>
    js/raphael.2.1.0.min.js">&lt;/script>
    &lt;script src="js/justgage.1.0.1d>

&lt;body>

    &lt;div id="g1">&lt;/div>
    &lt;div id="g2">&lt;/div>

    &lt;script type="text/javascript">

    $(document).ready(function () {

        var g1 = new JustGage({
            id: "g1",
            value: getRandomInt(-100, 100),
            min: -100,
            max: 100,
            title: "Triangle Wave",
            label: "Value"
        });

        var g2 = new </textarea></pre><svg xmlns="http://www.w3.org/2000/svg" style="width:24px;height:24px" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path class="with-check" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5"></path><path class="without-check" stroke-linecap="round" stroke-linejoin="round" d="M16.5 8.25V6a2.25 2.25 0 00-2.25-2.25H6A2.25 2.25 0 003.75 6v8.25A2.25 2.25 0 006 16.5h2.25m8.25-8.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-7.5A2.25 2.25 0 018.25 18v-1.5m8.25-8.25h-6a2.25 2.25 0 00-2.25 2.25v6"></path></svg></span><pre class="shiki dark-plus" style="background-color: #1E1E1E" tabindex="0"><code><span class="line"><span style="color: #808080">&lt;!</span><span style="color: #569CD6">DOCTYPE</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">html</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #808080">&lt;</span><span style="color: #569CD6">head</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">meta</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">charset</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;utf-8&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">DMC Gage Demo</span><span style="color: #808080">&lt;/</span><span style="color: #569CD6">title</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    2.0.2.min.js&quot;&gt;</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    js/raphael.2.1.0.min.js&quot;&gt;</span><span style="color: #808080">&lt;/</span><span style="color: #F44747">script</span><span style="color: #808080">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">script</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">src</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;js/justgage.1.0.1d&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #CE9178">&lt;body&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #CE9178">    &lt;div id=&quot;</span><span style="color: #9CDCFE">g1</span><span style="color: #F44747">&quot;</span><span style="color: #808080">&gt;</span><span style="color: #D4D4D4">&lt;/</span><span style="color: #9CDCFE">div</span><span style="color: #D4D4D4">&gt;</span></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">div</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">id</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;g2&quot;</span><span style="color: #808080">&gt;&lt;/</span><span style="color: #569CD6">div</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    </span><span style="color: #808080">&lt;</span><span style="color: #569CD6">script</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">type</span><span style="color: #D4D4D4">=</span><span style="color: #CE9178">&quot;text/javascript&quot;</span><span style="color: #808080">&gt;</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">    $(document).ready(function () </span><span style="color: #569CD6">{</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">g1</span><span style="color: #D4D4D4"> = </span><span style="color: #569CD6">new</span><span style="color: #D4D4D4"> </span><span style="color: #DCDCAA">JustGage</span><span style="color: #D4D4D4">({</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">id:</span><span style="color: #D4D4D4"> </span><span style="color: #CE9178">&quot;g1&quot;</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">value:</span><span style="color: #D4D4D4"> </span><span style="color: #DCDCAA">getRandomInt</span><span style="color: #D4D4D4">(-</span><span style="color: #B5CEA8">100</span><span style="color: #D4D4D4">, </span><span style="color: #B5CEA8">100</span><span style="color: #D4D4D4">),</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">min:</span><span style="color: #D4D4D4"> -</span><span style="color: #B5CEA8">100</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">max:</span><span style="color: #D4D4D4"> </span><span style="color: #B5CEA8">100</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">title:</span><span style="color: #D4D4D4"> </span><span style="color: #CE9178">&quot;Triangle Wave&quot;</span><span style="color: #D4D4D4">,</span></span>
<span class="line"><span style="color: #D4D4D4">            </span><span style="color: #9CDCFE">label:</span><span style="color: #D4D4D4"> </span><span style="color: #CE9178">&quot;Value&quot;</span></span>
<span class="line"><span style="color: #D4D4D4">        });</span></span>
<span class="line"></span>
<span class="line"><span style="color: #D4D4D4">        </span><span style="color: #9CDCFE">var</span><span style="color: #D4D4D4"> </span><span style="color: #9CDCFE">g2</span><span style="color: #D4D4D4"> = </span><span style="color: #569CD6">new</span><span style="color: #D4D4D4"> </span></span></code></pre></div>


<div id="radePasteHelper" style="position: absolute; left: -10000px; border: 0px solid red; top: 3900px; width: 1px; height: 1px; overflow: hidden;"> </div>


<p class="wp-block-paragraph">Also, <a href="https://static.dmcinfo.com/wp-content/uploads/2025/06/S7HTML5_1.zip">here is a link</a> to a zip file of the project examples. Enjoy!</p>



<p class="wp-block-paragraph"><strong>Learn more about DMC&#8217;s <a href="/services/manufacturing-automation-and-intelligence/plc-programming/siemens-s7-plc-programming">Siemens S7 PLC programming expertise</a></strong><strong>. <a href="/contact">Contact us</a> to get started on your next PLC programming project.</strong></p>



<p class="wp-block-paragraph"></p>
<p>The post <a href="https://static.dmcinfo.com/blog/28315/siemens-s7-1200-web-server-tutorial-from-getting-started-to-html5-user-defined-pages/">Siemens S7-1200 Web Server Tutorial &#8211; From Getting Started to HTML5 User Defined Pages</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Farewell Kingsbury</title>
		<link>https://static.dmcinfo.com/blog/29544/farewell-kingsbury/</link>
		
		<dc:creator><![CDATA[Tim Jager]]></dc:creator>
		<pubDate>Sun, 01 May 2011 13:02:04 +0000</pubDate>
				<category><![CDATA[Announcements]]></category>
		<category><![CDATA[Chicago]]></category>
		<category><![CDATA[Culture]]></category>
		<category><![CDATA[Special Events]]></category>
		<guid isPermaLink="false">https://static.dmcinfo.com/blog/29544/farewell-kingsbury/</guid>

					<description><![CDATA[<p>This past Friday (April 29th), we started and&#8230;&#8230;several hours later&#8230;.finished our move from 1333 Kingsbury to 2222 Elston. It was pretty crazy as we (and a team of movers) dismantled the place and hauled everything to the new building. I took a video of the aftermath. Even though the place looks totally trashed, It was [&#8230;]</p>
<p>The post <a href="https://static.dmcinfo.com/blog/29544/farewell-kingsbury/">Farewell Kingsbury</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p class="wp-block-paragraph">This past Friday (April 29th), we started and&#8230;&#8230;several hours later&#8230;.finished our move from 1333 Kingsbury to 2222 Elston. It was pretty crazy as we (and a team of <a href="https://bobsmuscles4hire.com/" target="_blank" rel="noreferrer noopener">movers</a>) dismantled the place and hauled everything to the new building. I took a video of the aftermath. Even though the place looks totally trashed, It was a really good space for DMC over the past 7 years. Kingsbury was definitely the Millennium Falcon of offices: <em>&#8220;She may not look like much, but she&#8217;s got it where it counts..&#8221; </em>A lot of really smart, dedicated, and talented people worked some truly amazing projects in there. Farewell 1333.</p>


<p><iframe loading="lazy" width="640" height="360" src="https://www.youtube.com/embed/i8mT6tQASBk" frameborder="0" allowfullscreen></iframe></p><p>The post <a href="https://static.dmcinfo.com/blog/29544/farewell-kingsbury/">Farewell Kingsbury</a> appeared first on <a href="https://static.dmcinfo.com/">DMC, Inc.</a>.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
