Old school D3 from simpler times

All examples By author By category About

kmix27

Full window Github gist

skully

Built with blockbuilder.org

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>

<body>
<svg width='960' height='500'>
  
  <g>
  <circle cx=275 
          cy=130 
          r=75 />
    
  <circle cx=275 
          cy=130 
          r=21 
          fill=red />
    
  <circle cx=281
          cy=124
          r=5
          fill='black'
          stroke='white' />
    
  <circle cx=505 
          cy=130 
          r=75 />
    
  <circle cx=505 
          cy=130
          r=10
          fill=white />
    
  <circle cx=508
          cy=127
          r=2 
          fill=black />
    
  <rect x=314 
        y=343 
        width=20 
        height=97 />
    
  <rect x=354 
        y=343 
        width=20 
        height=97 />
    
  <rect x=399 
        y=343 
        width=20 
        height=97 />
    
  <rect 
        x=444 
        y=343 
        width=20 
        height=97 />
    
  <path 
        d= "M 145 18 C 135 289 304 148 264 482"
        fill='none'
        stroke='black'
        stroke-width='4px'/>
    
    <path 
          d= "M 634 21 C 609 299 472 152 500 482" 
          fill='none' 
          stroke='black'
          stroke-width='4px'
          />
  
  	<g transform=translate(358,239)scale(.6)>
    
  	<path 
        d='M0,25 L25,0 L50,25 L75,0 L100,25 L50,75 Z' 
        fill="steelblue"/>
    
  	</g>   
  </g>
            </svg>
  
</body>

https://d3js.org/d3.v4.min.js