This SVG example demonstrates how to create a cubic chain path with visible control points.

CubicChainPathWithControlPoints.svg

<svg width="470" height="220" xmlns="http://www.w3.org/2000/svg">
  <g transform="translate(10,10)">
    <path d="M0,100 C0,0 150,0 150,100
      S300,200 300,100
      S450,0 450,100" fill="none" stroke="black" stroke-width="3"/>
    <!-- Control Points -->
    <g fill="none" stroke="#666666" stroke-width="1">
      <path d="M0,100 0,0" />
      <path d="M150,100 L150,0" />
      <path d="M300,200 L300,100" />
      <path d="M450,0 L450,100" />
    </g>
    <g fill="#666666" >
      <circle cx="0" cy="100" r="4"/>
      <circle cx="0" cy="0" r="4"/>
      <circle cx="150" cy="0" r="4"/>
      <circle cx="150" cy="100" r="4"/>
      <circle cx="300" cy="200" r="4"/>
      <circle cx="300" cy="100" r="4"/>
      <circle cx="450" cy="0" r="4"/>
      <circle cx="450" cy="100" r="4"/>
    </g>
    <!-- Implied Control Points -->
    <g opacity=".25">
      <g stroke="#00FF00" stroke-width="1" fill="none">
        <path d="M150,100 L150,200"/>
        <path d="M300,100 L300,0"/>
      </g>
      <g fill="#00FF00" >
        <circle cx="150" cy="200" r="4"/>
        <circle cx="300" cy="0" r="4"/>
      </g>
    </g>
  </g>
</svg>

Output