Bubble charts encode data in the area of circles. Although less perceptually-accurate than bar charts, they can pack hundreds of values into a small space. Implementation based on work by Jeff Heer. Data shows the Flare class hierarchy, also courtesy Jeff Heer.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta name="description" content="Generic starter Cytoscape graph"> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/cytoscape/2.4.4/cytoscape.min.js"></script> | |
<meta charset="utf-8"> | |
<title>JS Bin</title> | |
<style id="jsbin-css"> | |
#cyto{ | |
width:300px;height:300px; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>Angular JS</title> | |
</head> | |
<body ng-app="jsbin"> | |
<div ng-controller="DemoCtrl as demo"> | |
<h1>Hello {{demo.name}}</h1> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
div.file-header::before { | |
width: 4em; | |
top: -40px; | |
height: 4em; | |
transform-origin: 50% 50%; | |
transform: rotate(-29deg); | |
position: relative; | |
z-index: 10000000; | |
content: url("data:image/svg+xml;utf8,<svg height='100%' viewBox='-8 -8 16 16' width='100%' xmlns='http://www.w3.org/2000/svg'><g><rect fill='white' height='5' stroke-width='0.25' stroke='black' transform='rotate(45) translate(8,8)' width='5' x='-10.5' y='-10.5'></rect><rect fill='white' height='5' stroke-width='0.25' stroke='black' width='15' x='-7.5' y='0'></rect><text font-family='monospace' font-size='2.5' x='-5' y='3.25'>CHEESE</text></g></svg>"); | |
opacity: 0.8; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html> | |
<head> | |
<meta name="description" content="Mine Versions"> | |
<style id="jsbin-css"> | |
body { font-family:sans-serif; color:#333;} | |
.note { background:rgba(150,200,250,0.2); padding:1em; border:solid 1px cornflowerblue; border-radius:2px; | |
margin-top:0.5em;} | |
.note pre {display:inline} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(ns redgenes.routes | |
(:require [compojure.core :refer [GET POST defroutes context ANY]] | |
[compojure.route :refer [resources]] | |
[hiccup.page :refer [include-js include-css html5]] | |
[redgenes.api.modelcount :refer [modelcount modelcount-children cache cacheall]] | |
[redgenes.index :as index] | |
[ring.util.response :refer [response resource-response]])) | |
(defroutes routes | |
(GET "/" [] |
Thanks to Vivek for his great proposal! https://gist.github.com/vivekkrish/2e5e4128efbbf2014c194aae6b83d245
- js Dependencies are bundled into the app (requirejs, browserify, webpack)
Our justification is that sharing dependencies between third party tools introduces levels of complexity that are expensive (time consuming) and can be challenging to developers. If we find that third party apps are truly to large then we'll reconsider a more complicated approach.