Skip to content

Instantly share code, notes, and snippets.

View mwdchang's full-sized avatar

Daniel Chang mwdchang

21 followers · 20 following
View GitHub Profile
@mwdchang
mwdchang / index.html
Created July 13, 2016 14:28
D3 zoom behaviour offset
<!DOCTYPE HTML>
<html>
<head>
<script src="https://d3js.org/d3.v3.min.js"></script>
<style>
#div1 {
width: 500px;
height: 500px;
background: #CCC;
}
@mwdchang
mwdchang / index.html
Created July 12, 2016 19:08
FF and Chrome absolute element event positions
<!DOCTYPE HTML>
<html>
<head>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.js"></script>
<style>
#d1 {
width: 600px;
height: 600px;
background: #CCC;
@mwdchang
mwdchang / index.html
Last active August 12, 2016 02:59
Grid Test
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
<script src="stckr.js"></script>
<link rel="stylesheet" href="stckr.css">
<style>
body {
margin: 1rem;
font-family: Tahoma;
}
@mwdchang
mwdchang / index.html
Created March 24, 2016 20:53
Zoomable Calendar
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.12/d3.js"></script>
<style>
body {
font-family: Tahoma;
font-size: 0.7rem;
}
@mwdchang
mwdchang / index.html
Created July 31, 2015 15:10
reactome input diff
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>diff</title>
<meta name="Generator" content="Vim/7.4">
<meta name="plugin-version" content="vim7.4_v1">
<meta name="settings" content="number_lines,whole_filler,use_css,no_foldcolumn,expand_tabs,line_ids,prevent_copy=">
<meta name="colorscheme" content="desert">
<style type="text/css">
@mwdchang
mwdchang / index.html
Created June 19, 2015 13:47
Demoing the lens technique. The lens is used to focus, and reveal another dimension on the dataset.
<html>
<head>
<!--
<script src="d3.js" charset="utf-8"></script>
<script src="lodash.js"></script>
-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.9.3/lodash.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
<style>
@mwdchang
mwdchang / index.html
Created June 9, 2015 04:39
Comparing ICGC donor dimensions
<html data-ng-app="ICGCPlotter">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.9.3/lodash.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3-tip/0.6.3/d3-tip.min.js"></script>
<link rel="stylesheet" href="//rawgithub.com/Caged/d3-tip/master/examples/example-styles.css">
<style>
body {
margin: 0.5rem;
@mwdchang
mwdchang / index.html
Created May 5, 2015 01:12
ICGC Table modeller demo
<!DOCTYPE html>
<html data-ng-app="Test">
<head>
<title>Test Modeller</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<link href="https://dcc.icgc.org/styles/18e3f501.styles.css" rel="stylesheet" type="text/css"></link>
<link href="https://dcc.icgc.org/styles/54e20491.vendor.css" rel="stylesheet" type="text/css"></link>
</head>
<body>
@mwdchang
mwdchang / index.html
Created April 21, 2015 05:34
Scroll Demo
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
</head>
<body>
<span> Mouse over letters to hightlight list, unviewable items are indicated with top/bottom bar:</span><br>
<svg id="blahblah" width="200" height="50"></svg>
<div id="list1"></div>
</body>
@mwdchang
mwdchang / index.html
Created April 16, 2015 20:23
Home Test
<!DOCTYPE HTML>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<style>
body {
font-family: Tahoma;
font-size: 0.85rem;
margin: 0;