Skip to content

Instantly share code, notes, and snippets.

@dongtong
dongtong / DropZone.jsx
Created September 6, 2016 02:42 — forked from pizzarob/01_DropZone.jsx
HTML5 Drag and Drop File Upload React Component
import React, {PropTypes} from 'react';
import classNames from 'classnames';
const ANIMATION_DURATION = 1000;
class BatchDropZone extends React.Component {
static propTypes = {
// function that recieves an array of files
@dongtong
dongtong / index.html
Created December 3, 2016 02:23 — forked from d3noob/index.html
Adding links to objects in v4
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<!-- load the d3.js library -->
<script src="https://d3js.org/d3.v4.min.js"></script>
<script>
@dongtong
dongtong / data2.csv
Created December 3, 2016 02:25 — forked from d3noob/data2.csv
Graph and table with tricks in v4
date close open
1-May-12 68.13 34.12
30-Apr-12 63.98 45.56
27-Apr-12 67.00 67.89
26-Apr-12 89.70 78.54
25-Apr-12 99.00 89.23
24-Apr-12 130.28 99.23
23-Apr-12 166.70 101.34
20-Apr-12 234.98 122.34
19-Apr-12 345.44 134.56
@dongtong
dongtong / data.csv
Created December 3, 2016 02:27 — forked from d3noob/data.csv
Simple graph with table in v4
date close
1-May-12 58.13
30-Apr-12 53.98
27-Apr-12 67.00
26-Apr-12 89.70
25-Apr-12 99.00
24-Apr-12 130.28
23-Apr-12 166.70
20-Apr-12 234.98
19-Apr-12 345.44
@dongtong
dongtong / index.html
Created December 3, 2016 02:27 — forked from d3noob/index.html
Input acting on two elements in v4
<!DOCTYPE html>
<meta charset="utf-8">
<title>Input test</title>
<p>
<label for="nAngle"
style="display: inline-block; width: 240px; text-align: right">
angle = <span id="nAngle-value">…</span>
</label>
<input type="range" min="0" max="360" id="nAngle">
@dongtong
dongtong / index.html
Created December 3, 2016 03:07 — forked from d3noob/index.html
Number input in v4
<!DOCTYPE html>
<meta charset="utf-8">
<title>Input (number) test</title>
<p>
<label for="nValue"
style="display: inline-block; width: 240px; text-align: right">
angle = <span id="nValue-value"></span>
</label>
<input type="number" min="0" max="360" step="5" value="0" id="nValue">
@dongtong
dongtong / index.html
Created December 3, 2016 03:07 — forked from d3noob/index.html
Dual html inputs in v4
<!DOCTYPE html>
<meta charset="utf-8">
<title>Double Input Test</title>
<p>
<label for="nHeight"
style="display: inline-block; width: 240px; text-align: right">
height = <span id="nHeight-value">…</span>
</label>
<input type="range" min="1" max="280" id="nHeight">
@dongtong
dongtong / index.html
Created December 3, 2016 03:08 — forked from d3noob/index.html
Range input with v4
<!DOCTYPE html>
<meta charset="utf-8">
<title>Input test (circle)</title>
<p>
<label for="nRadius"
style="display: inline-block; width: 240px; text-align: right">
radius = <span id="nRadius-value"></span>
</label>
<input type="range" min="1" max="150" id="nRadius">
@dongtong
dongtong / data4.csv
Created December 3, 2016 03:08 — forked from d3noob/data4.csv
Toggling element visibility in v4
date close open
1-May-12 58.13 3.41
30-Apr-12 53.98 4.55
27-Apr-12 67.00 6.78
26-Apr-12 89.70 7.85
25-Apr-12 99.00 8.92
24-Apr-12 130.28 9.92
23-Apr-12 166.70 10.13
20-Apr-12 234.98 12.23
19-Apr-12 345.44 13.45
@dongtong
dongtong / data.csv
Created December 3, 2016 03:09 — forked from d3noob/data.csv
Area graph with gradient in v4
1-May-12 58.13
30-Apr-12 53.98
27-Apr-12 67.00
26-Apr-12 89.70
25-Apr-12 99.00
24-Apr-12 130.28
23-Apr-12 166.70
20-Apr-12 234.98
19-Apr-12 345.44