jebeck

/*!
 * Bootstrap v3.3.4 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 *//*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{margin:.67em 0;font-size:2em}mark{color:#000;background:#ff0}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{height:0;-webkit-box-sizing:content-box

jebeck

Zipline-style virtual rendering on scroll

A toy example to demonstrate the scrolling with virtual rendering implemented in zipline.

jebeck

Tideline-style virtual scrolling

A toy example to demonstrate the virtual scrolling implemented in tideline.

jebeck

Browser-zoom robust foreignObject tooltips in SVG

Based on this previous gist, but robust to changes in browser zoom level (text inside tooltip doesn't get cut off when zoom < 100%).

jebeck

Curved Text in SVG

Curved text in SVG isn't too hard, as long as you understand how to define different kinds of curved <path> elements in SVG. When you have a curved <path> defined in a <defs> elements (usually just inside your root <svg>), to make the text inside a <text> element follow that <path>, all that's required is to insert a <textPath> inside the <text>, with an xlink:href attribute that links to the id of the defined <path>. The actual text for display also gets added inside the <textPath>, like so:

<text>
  <textPath xlink:href="#yourPath">
    Your text
  </textPath>

jebeck

The Zipfian desert of Homeric vocabulary.

A visualization to demonstrate how the frequency of vocabulary items (lemmas) in Homer follows a Zipfian distribution (at least for all open, non-functional cateogories). Here lemmas occuring 25 times or less are excluded for performance reasons.

For more information, see Zipf's Law.

jebeck

node_modules/

jebeck

Horizontal Histogram of Blood Glucose Data

This horizontal histogram provides a quick summary view of an entire week's worth of blood glucose values (acquired from a Dexcom continuous glucose monitor), where each bar represents a 20-point range of blood glucose values (in mg/dL).

jebeck

Heatmap of Blood Glucose Data by Hour of Day

This heat map shows the distribution of a week's worth of blood glucose values (acquired from a Dexcom continuous glucose monitor) according to the hour of the day and by bin, where each bin represents a 20-point range of blood glucose values.

jebeck

Heatmap of Blood Glucose Data by Day of Week

This heat map shows the distribution of a week's worth of blood glucose values (acquired from a Dexcom continuous glucose monitor) according to the day of the week and by bin, where each bin represents a 20-point range of blood glucose values.