Skip to content

Instantly share code, notes, and snippets.

@eli-s-goldberg
eli-s-goldberg / index.html
Created November 10, 2015 15:47
Color Sankey based on some examples to illustrate ENM data gaps.
<!doctype HTML>
<meta charset = 'utf-8'>
<html>
<head>
<link rel='stylesheet' href='http://timelyportfolio.github.io/rCharts_d3_sankey//css/sankey.css'>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/d3.v3.js' type='text/javascript'></script>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/sankey.js' type='text/javascript'></script>
<style>
<!doctype HTML>
<meta charset = 'utf-8'>
<html>
<head>
<link rel='stylesheet' href='http://timelyportfolio.github.io/rCharts_d3_sankey//css/sankey.css'>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/d3.v3.js' type='text/javascript'></script>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/sankey.js' type='text/javascript'></script>
<style>
@eli-s-goldberg
eli-s-goldberg / index.html
Created November 10, 2015 17:52
sunburts plot?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sequences sunburst</title>
<script src="http://d3js.org/d3.v3.min.js"></script>
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Open+Sans:400,600">
<link rel="stylesheet" type="text/css" href="sequences.css"/>
</head>
@eli-s-goldberg
eli-s-goldberg / index.html
Created November 10, 2015 17:54
boxPlotHoldout
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.axis path,
.axis line {
fill: none;
stroke: #000;
shape-rendering: crispEdges;
}
@eli-s-goldberg
eli-s-goldberg / index.html
Created November 10, 2015 17:55
colorSankey
<!doctype HTML>
<meta charset = 'utf-8'>
<html>
<head>
<link rel='stylesheet' href='http://timelyportfolio.github.io/rCharts_d3_sankey//css/sankey.css'>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/d3.v3.js' type='text/javascript'></script>
<script src='http://timelyportfolio.github.io/rCharts_d3_sankey//js/sankey.js' type='text/javascript'></script>
<style>
.rChart {
@eli-s-goldberg
eli-s-goldberg / index.html
Created November 11, 2015 15:39
ENM_sunburst Gist
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sequences sunburst</title>
<script src="http://d3js.org/d3.v3.min.js"></script>
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Open+Sans:400,600">
<link rel="stylesheet" type="text/css" href="sequences.css"/>
</head>
@eli-s-goldberg
eli-s-goldberg / README.md
Created November 11, 2015 15:40
SunburstPlotGist

This example shows how it is possible to use a D3 sunburst visualization (partition layout) with data that describes sequences of events.

A good use case is to summarize navigation paths through a web site, as in the sample synthetic data file (visit_sequences.csv). The visualization makes it easy to understand visits that start directly on a product page (e.g. after landing there from a search engine), compared to visits where users arrive on the site's home page and navigate from there. Where a funnel lets you understand a single pre-selected path, this allows you to see all possible paths.

Features:

  • works with data that is in a CSV format (you don't need to pre-generate a hierarchical JSON file, unless your data file is very large)
  • interactive breadcrumb trail helps to emphasize the sequence, so that it is easy for a first-time user to understand what they are seeing
  • percentages are shown explicitly, to help overcome the distortion of the data that occurs wh
@eli-s-goldberg
eli-s-goldberg / README.md
Created November 13, 2015 11:32
QCM-D alpha parameter literature

This example shows how it is possible to use a D3 sunburst visualization (partition layout) with data that describes sequences of events.

A good use case is to summarize navigation paths through a web site, as in the sample synthetic data file (visit_sequences.csv). The visualization makes it easy to understand visits that start directly on a product page (e.g. after landing there from a search engine), compared to visits where users arrive on the site's home page and navigate from there. Where a funnel lets you understand a single pre-selected path, this allows you to see all possible paths.

Features:

  • works with data that is in a CSV format (you don't need to pre-generate a hierarchical JSON file, unless your data file is very large)
  • interactive breadcrumb trail helps to emphasize the sequence, so that it is easy for a first-time user to understand what they are seeing
  • percentages are shown explicitly, to help overcome the distortion of the data that occurs w
@eli-s-goldberg
eli-s-goldberg / enmExperimentalData.csv
Created November 13, 2015 11:37
QCM-D experimental data visualization
We can make this file beautiful and searchable if this error is corrected: It looks like row 3 should actually have 2 columns, instead of 1 in line 2.
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-10_20nm-10mgNM/L-6.0-25C-0.1_1,1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-10_20nm-10mgNM/L-8.0-25C-0.01_0.1,1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-1_10nm-10mgNM/L-6.0-25C-0.1_1-3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-1_10nm-10mgNM/L-8.0-25C-0.1_1-3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-6.0-25C-0.01_0.1-2
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-6.0-25C-0.1_1-2
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-8.0-25C-0.01_0.1-3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-8.0-25C-0.1_1,1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-<1nm-10mgNM/L-6.0-25C-0.1_1,1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-<1nm-10mgNM/L-8.0-25C-0.1_1,1
@eli-s-goldberg
eli-s-goldberg / enmExperimentalData.csv
Created November 13, 2015 11:47
qcm-d experimental conditions and results data visualization
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-10_20nm-10mgNM/L-6.0-25C-0.1_1 1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-10_20nm-10mgNM/L-8.0-25C-0.01_0.1 1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-1_10nm-10mgNM/L-6.0-25C-0.1_1 3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-CaCl2-1_10nm-10mgNM/L-8.0-25C-0.1_1 3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-6.0-25C-0.01_0.1 2
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-6.0-25C-0.1_1 2
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-8.0-25C-0.01_0.1 3
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-1_10nm-10mgNM/L-8.0-25C-0.1_1 1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-<1nm-10mgNM/L-6.0-25C-0.1_1 1
BL21RNA-ellipsoid-none-none-0mgNOM/L-stock-NaCl-<1nm-10mgNM/L-8.0-25C-0.1_1 1