-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
41 lines (40 loc) · 1.99 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!doctype html>
<html>
<head>
<title>Reproduction of Anderson's Iris census visualization</title>
<meta charset='utf-8' />
<link rel='stylesheet' href='andersons_iris.css' />
<script src='https://d3js.org/d3.v7.min.js'></script>
</head>
<body>
<div id='introduction'></div>
<h1>A reproduction of Anderson's (1936) Iris visualization</h1>
<p>A reproduction of <em>Iris Virginica</em>, <em>Iris Setosa</em>
and <em>Iris Versicolor</em> census visualization, as seen Anderson's botany paper <a href='http://biostor.org/reference/11559'>The Species Problem in Iris</a>. <em>Annals of the Missouri Botanical Garden</em> Vol. 23, No. 3 (Sep., 1936).</p>
<img src='https://pbs.twimg.com/media/Dc0r-tdX4AAOE5z.jpg'>
<p>There would be many ways to organize the items, with CSS, Bootstrap, translations etc., but for now I am just doing a full-on D3 matrix with index calculations.</p>
<p>I am using <a href='http://scikit-learn.org/stable/auto_examples/datasets/plot_iris_dataset.html'>iris data from scikit-learn</a>, like so in Python</p>
<code>
<pre>
import pandas as pd
import sklearn.datasets
iris = sklearn.datasets.load_iris()
df = pd.DataFrame(iris.data, columns=iris.feature_names)
with open('iris.json', 'w') as fd:
fd.write(df.to_json(orient='records'))
</pre>
</code>
<p>The data has following characteristics, with <code>df.describe().round(2).loc[['mean', 'std', 'min', 'max']]</code>
<code>
<pre>
sepal length (cm) sepal width (cm) petal length (cm) petal width (cm)
mean 5.84 3.05 3.76 1.20
std 0.83 0.43 1.76 0.76
min 4.30 2.00 1.00 0.10
max 7.90 4.40 6.90 2.50
</pre>
</code>
<div id='viz'></div>
<script src='andersons_iris.js'></script>
</body>
</html>