Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Fitbit NightScout">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <svg id="page" class="portrait-view">
  
    <rect x="0" y="0" width="100%" height="100%" />
    
    <text id="myTime" x="5%" y="20%" fill="grey" style='font-family:Arial' font-size="46" font-weight="bold">00:00</text>
  
    <text id="mySgv" x="60%" y="20%" fill="grey" style='font-family:Arial' font-size="46" font-weight="bold">---</text>
    <text id="myDir" x="85%" y="20%" fill="grey" style='font-family:Arial' font-size="46" font-weight="bold">-</text>
    
    <svg x="0%" y="30%" width="100%" height="70%">
      <rect id="graph" x="5%" y="0" width="90%" height="95%" stroke="grey"/>
      
      <line x1="5%" y1="30%" x2="95%" y2="30%" stroke="#333333"/>
      <line x1="5%" y1="70%" x2="95%" y2="70%" stroke="#333333"/>
           
      <circle class="sgv" cx="34" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="46" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="58" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="70" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="82" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="94" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="106" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="118" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="130" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="142" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="154" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="166" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="178" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="190" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="202" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="214" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="226" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="238" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="250" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="262" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="274" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="286" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="298" cy="88" r="4" fill="grey" />
      <circle class="sgv" cx="310" cy="88" r="4" fill="grey" />
      
      
    </svg>
    
  </svg>  
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
NiVZ78pro
0viewers