added ref-table to example

[tech-radar.git] / examples / default.html
diff --git a/examples/default.html b/examples/default.html

index 9292e47..b1ad51c 100644 (file)
--- a/examples/default.html
+++ b/examples/default.html
@@ -6,73 +6,13 @@
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700' rel='stylesheet' type='text/css'>
    <script src="../bower_components/chance/chance.js"></script>
    <script src="../bower_components/d3/d3.min.js"></script>
-  <script src="../src/namespaces.js"></script>
-  <script src="../src/util/fib.js"></script>
-  <script src="../src/models/cycle.js"></script>
-  <script src="../src/models/blip.js"></script>
-  <script src="../src/models/quadrant.js"></script>
-  <script src="../src/models/radar.js"></script>
-  <script src="../src/graphing/radar.js"></script>
-  <style>
-    body {
-      font: 11px 'Open Sans';
-    }
-    svg {
-      padding: 20px;
-    }
-    svg circle:nth-child(1) {
-      fill: #eaeaea;
-    }
-    svg circle:nth-child(2) {
-      fill: #dadada;
-    }
-    svg circle:nth-child(3) {
-      fill: #cacaca;
-    }
-    svg circle:nth-child(4) {
-      fill: #bababa;
-    }
-    svg text.blip-text {
-      font-size: 9px;
-      font-style: italic;
-      fill: #fff;
-    }
-    svg text.line-text {
-      font-weight: bold;
-      text-transform: uppercase;
-      fill: #000;
-    }
-
-    svg text.tools,
-    svg text.techniques,
-    svg text.platforms,
-    svg text.languages-frameworks {
-      font-weight: bold;
-      text-transform:uppercase;
-      font-size: 16px;
-    }
-    svg line {
-      stroke: rgba(255, 255, 255, 0.3);
-    }
-    svg circle.tools,
-    svg circle.techniques,
-    svg circle.platforms,
-    svg circle.languages-frameworks,
-    svg path.tools,
-    svg path.techniques,
-    svg path.platforms,
-    svg path.languages-frameworks {
-      stroke: #fff;
-    }
-    svg .tools { fill: #83AD78 }
-    svg .techniques { fill: #3DB5BE }
-    svg .platforms { fill: #E88744 }
-    svg .languages-frameworks { fill: #8D2145 }
-  </style>
+  <script src="../dist/tech-radar.min.js"></script>
+  <link href="../dist/base.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <div id="radar">
    </div>
+  <div id="ref-table"></div>
  </body>
  <script>
    var adopt = new tr.models.Cycle('Adopt', 0);
@@ -194,7 +134,9 @@
    radar.setThirdQuadrant(platformsQuadrant);
    radar.setFourthQuadrant(languageFramework);
  
-  var radarGraph = new tr.graphing.Radar(800, radar);
+  var radarGraph = new tr.graphing.Radar(1080, radar);
    radarGraph.init('#radar').plot();
+  var refTable = new tr.graphing.RefTable(radar);
+  refTable.init('#ref-table').render();
  </script>
  </html>