D3 Examples - Transition Tutorial

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>D3 Graphic</title>
  <style>
    .axis path,
    .axis line {
        fill: none;
        stroke: black;
        shape-rendering: crispEdges;
    }
    .axis text {
        font-family: sans-serif;
        font-size: 11px;
    }   
  </style>
</head>
<body>
 
  <div class="container">
    <h2>Scale</h2>
​
​
    <div id="scale"></div>
  </div>
​
  <div class="container">
     <h2>Transition</h2>
     <p>Click on the shape to see the transition </p>
     <div id="chart1"></div>
  </div>
 
​
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<script src="script_trans.js"></script>
</body>
</html>
    
Transition Tutorial

Student

My notes:
