Tryit Editor v1.4

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Sample</title>
    <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
    <style>
      svg { width: 380px; height: 300px; border: 1px solid black; }
      .line { fill: none; stroke: black; }
      .axis text {
        font-family: sans-serif;
        font-size: 11px;
      }
      .axis path,
      .axis line {
        fill: none;
        stroke: black;
      }
      .itemA { stroke: #000; }
      .itemB { stroke: #666; }
      .itemC { stroke: #ccc; }
    </style>
  </head>
  <body>
    <h1>折れ線グラフ</h1>
    <svg id="myGraph"></svg>
    <div>
      <button id="prev">前へ</button>
      <button id="next">次へ</button>
    </div>
    <script src="js/sample.js"></script>
  </body>
</html>
処理結果: