D3 Examples - Radar Chart

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
  <title>Radar Chart - Update Polygon</title>
​
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js" charset-"utf-8"></script>
​
    <style type="text/css">
    /* line 137, ../sass/radarChart.scss */
    body {
      overflow: hidden;
      margin: 0;
      font-size: 14px;
      font-family: "proxima_nova_reg", sans-serif;
    }
​
    body .edit-btn {
      position: absolute;
      left: 100px;
      top: 50px;
      height: 20px;
      background-color: #a8a8a8;
      color: white;
      border-radius: 40px;
      padding: 8px 16px 7px 13px;
      cursor: default;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      opacity: 1;
      visibility: visible;
    }
​
    /* line 271, ../sass/radarChart.scss */
    #chart {
      position: absolute;
      left: 100px;
    }
​
    /* line 493, ../sass/radarChart.scss */
    .yaxis, .xaxis {
      font: 10px sans-serif;
      width: 100px;
    }
​
    /* line 498, ../sass/radarChart.scss */
    .yaxis path,
    .yaxis line,
    .yaxis tick {
      fill: none;
      stroke: black;
      shape-rendering: crispEdges;
    }
​
    /* line 507, ../sass/radarChart.scss */
    .xaxis path,
    .xaxis line {
      fill: none;
      stroke: black;
      stroke-dasharray: 10,10;
      shape-rendering: crispEdges;
    }
​
    body .update-value {
      position: absolute;
      left: 505px;
      top: 365px;
      width: 65px;
      height: 65px;
      background-color: #a8a8a8;
      color: white;
      border-radius: 50%;
      cursor: default;
      opacity: 0;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      z-index: 9;
  }
​
  </style>
​
  </head>
  <body>
​
    <div id="body">
      <div id="chart"></div>
        <div class="edit-btn">Edit Data Set</div>
        <div class="update-value"></div>
    </div>
​
    <script type="text/javascript" src="data.js"></script>
    <script type="text/javascript" src="radarChart.js"></script>
    <script type="text/javascript" src="script.js"></script>
  </body>
</html>
    