diff options
| author | Peter Wu <peter@lekensteyn.nl> | 2014-05-21 15:20:33 +0200 |
|---|---|---|
| committer | Peter Wu <peter@lekensteyn.nl> | 2014-05-21 15:20:33 +0200 |
| commit | 28641ec5e1a5e819f92c715ba297d2cf2305941f (patch) | |
| tree | dabebe0a9a7613f28dd91abc8fe6dd778a874cea /bubble.html | |
| parent | 0334aa5e0051b59ce4050fd306b26119466e2991 (diff) | |
| download | d3viz-28641ec5e1a5e819f92c715ba297d2cf2305941f.tar.gz | |
Better names / title
Diffstat (limited to 'bubble.html')
| -rw-r--r-- | bubble.html | 150 |
1 files changed, 0 insertions, 150 deletions
diff --git a/bubble.html b/bubble.html deleted file mode 100644 index 697a65d..0000000 --- a/bubble.html +++ /dev/null @@ -1,150 +0,0 @@ -<!doctype html> -<html> -<head> -<meta charset="utf-8"> -<title>D3 demo</title> -</head> -<style> -html, body { - padding: 0; - margin: 0; -} -#map { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; -} -#map svg { - display: block; - width: 100%; - height: 100%; -} -/* style for info panel */ -#infobox { - border-radius: 10px; - background-color: #f0f0f0; - width: 240px; - height: 340px; - position: fixed; - left: 6px; - top: 6px; - opacity: .5; - z-index: 2; /* show above the map */ - display: flex; - flex-direction: column; -} -#infobox:hover { - opacity: 1; -} -#infobox .draggable { - background-color: #cfcfcf; - width: 100%; - height: 20px; - border-top-left-radius: 10px; - border-top-right-radius: 10px; - cursor: move; -} -#infobox .content { - flex: 1; /* fill remaining space */ - overflow: auto; - margin: 6px 3px; -} -#infobox .status, #infobox .status li { - margin: 0; - padding: 0; - /* hide too large text unless you hover over it */ - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; -} -#infobox .status li:hover { - overflow: visible; - white-space: normal; -} -#infobox:not(.user-locked) .not-auto { - display: none; -} -#infobox .zoom-level:after { - content: "%"; -} -/* user info */ -#infobox .user-info { - /* initially there is no user to show info about */ - display: none; -} -#infobox .user-info .user-stats, -#infobox .user-info .user-stats li { - padding: 0; - margin: 0; -} -#infobox .user-info .name { - margin: 0; - padding: 0; -} -/* style for svg contents */ -.node { - stroke: #fff; - stroke-width: 0.5px; -} -.node.spam { - fill: orange; -} -.node.ham { - fill: green; -} -.node.neighbor { - fill: #fcc; -} -.node.selected { - fill: #f00; -} -.link { - stroke: #999; - stroke-opacity: .6; - /* fill none to prevent arcs lines being too thick */ - fill: none; -} -.arrow-head { - fill-opacity: .6; -} -.link.neighbor { - stroke: #f99; -} -</style> -<body> - -<div id="infobox"> - <div class="draggable"></div> - <div class="content"> - <ul class="status"> - <li>Total nodes: <span class="node-count"></span> - <li>Total edges: <span class="edge-count"></span> - <li>Zoom: <span class="zoom-level"></span> (scroll to zoom) - <li>User info does <span class="not-auto">not</span> follow the - mouse (double-click node to toggle) - </ul> - <div class="user-info"> - <h2 class="name"></h2> - <ul class="user-stats"> - <li>User ID: <span class="userid"></span> - <li>Tweets: <span class="tweet-count"></span> - <li>Spam: <span class="spam-status"></span> - <li>Relations (<span class="relations-from-count"></span> + - <span class="relations-to-count"></span>): - </ul> - <ul class="relations-from"></ul> - <ul class="relations-to"></ul> - </div> - </div> -</div> - -<div id="map"></div> - -<script src="lib/d3.js"></script> -<script src="js/collision.js"></script> -<script src="js/preprocess.js"></script> -<script src="js/bubble.js"></script> -</body> -</html> |