A graphical toolkit for visualization
Protovis
Overview
Examples
Documentation
Download
Index
« Previous / Next »

Brush + Link

View full screen.

Here we add interactivity to the earlier scatterplot matrix of Edgar Anderson’s data on Iris flowers. Click and drag with the mouse (brushing) to create a selection. Matching samples in the other views will be highlighted (linking). This method of interaction is used heaviy by statistical tools such as GGobi.

Next: Tooltips

Source

<html>
  <head>
    <title>Brush + Link</title>
    <link type="text/css" rel="stylesheet" href="ex.css?3.2"/>
    <script type="text/javascript" src="../protovis-r3.2.js"></script>
    <script type="text/javascript" src="flowers.js"></script>
    <style type="text/css">

#fig {
  width: 680px;
  height: 705px;
}

    </style>
  </head>
  <body><div id="center"><div id="fig">
    <script type="text/javascript+protovis">

/* Size parameters. */
var size = 150,
    padding = 20;

/* Interaction state. */
var s;

/* Scales for color and position. */
var grey = pv.rgb(144, 144, 144, .2),
    color = pv.colors(
        "rgba(50%, 0%, 0%, .5)",
        "rgba(0%, 50%, 0%, .5)",
        "rgba(0%, 0%, 50%, .5)"),
    position = pv.dict(traits, function(t)
        pv.Scale.linear(flowers, function(d) d[t])
        .range(0, size));

/* Root panel. */
var vis = new pv.Panel()
    .width((size + padding) * traits.length)
    .height((size + padding) * traits.length + padding)
    .left(10)
    .top(5);

/* One cell per trait pair. */
var cell = vis.add(pv.Panel)
    .data(traits)
    .top(function() this.index * (size + padding) + padding / 2)
    .height(size)
  .add(pv.Panel)
    .data(function(y) traits.map(function(x) ({px:x, py:y})))
    .left(function() this.index * (size + padding) + padding / 2)
    .width(size);

/* Framed dot plots not along the diagonal. */
var plot = cell.add(pv.Panel)
    .visible(function(t) t.px != t.py)
    .strokeStyle("#aaa");

/* X-axis ticks. */
var xtick = plot.add(pv.Rule)
    .data(function(t) position[t.px].ticks(5))
    .left(function(d, t) position[t.px](d))
    .strokeStyle("#eee");

/* Bottom label. */
xtick.anchor("bottom").add(pv.Label)
    .visible(function() (cell.parent.index == traits.length - 1) && !(cell.index & 1))
    .text(function(d, t) position[t.px].tickFormat(d));

/* Top label. */
xtick.anchor("top").add(pv.Label)
    .visible(function() (cell.parent.index == 0) && (cell.index & 1))
    .text(function(d, t) position[t.px].tickFormat(d));

/* Y-axis ticks. */
var ytick = plot.add(pv.Rule)
    .data(function(t) position[t.py].ticks(5))
    .bottom(function(d, t) position[t.py](d))
    .strokeStyle("#eee");

/* Left label. */
ytick.anchor("left").add(pv.Label)
    .visible(function() (cell.index == 0) && (cell.parent.index & 1))
    .text(function(d, t) position[t.py].tickFormat(d));

/* Right label. */
ytick.anchor("right").add(pv.Label)
    .visible(function() (cell.index == traits.length - 1) && !(cell.parent.index & 1))
    .text(function(d, t) position[t.py].tickFormat(d));

/* Frame and dot plot. */
var dot = plot.add(pv.Dot)
    .data(flowers)
    .left(function(d, t) position[t.px](d[t.px]))
    .bottom(function(d, t) position[t.py](d[t.py]))
    .size(10)
    .strokeStyle(null)
    .fillStyle(function(d) s
        && ((d[s.px] < s.x1) || (d[s.px] > s.x2)
        || (d[s.py] < s.y1) || (d[s.py] > s.y2))
        ? grey : color(d.species));

/* Interaction: new selection and display and drag selection */
plot.add(pv.Panel)
   .data([{x:20, y:20, dx:100, dy:100}])
   .cursor("crosshair")
   .events("all")
   .event("mousedown", pv.Behavior.select())
   .event("selectstart", function() (s = null, vis))
   .event("select", update)
 .add(pv.Bar)
   .visible(function(d, k, t) s && s.px == t.px && s.py == t.py)
   .left(function(d) d.x)
   .top(function(d) d.y)
   .width(function(d) d.dx)
   .height(function(d) d.dy)
   .fillStyle("rgba(0,0,0,.15)")
   .strokeStyle("white")
   .cursor("move")
   .event("mousedown", pv.Behavior.drag())
   .event("drag", update);

/* Labels along the diagonal. */
cell.anchor("center").add(pv.Label)
    .visible(function(t) t.px == t.py)
    .font("bold 14px sans-serif")
    .text(function(t) t.px.replace(/([WL])/, " $1").toLowerCase());

/* Legend. */
vis.add(pv.Dot)
    .data(species)
    .bottom(10)
    .left(function() 15 + this.index * 65)
    .size(8)
    .strokeStyle(null)
    .fillStyle(color)
  .anchor("right").add(pv.Label);

vis.render();

/* Interaction: update selection. */
function update(d, t) {
  s = d;
  s.px = t.px;
  s.py = t.py;
  s.x1 = position[t.px].invert(d.x);
  s.x2 = position[t.px].invert(d.x + d.dx);
  s.y1 = position[t.py].invert(size - d.y - d.dy);
  s.y2 = position[t.py].invert(size - d.y);
  dot.context(null, 0, function() this.render());
}

    </script>
  </div></div></body>
</html>

Data

var species = ["setosa", "versicolor", "virginica"];
var traits = ["sepalLength", "sepalWidth", "petalLength", "petalWidth"];
var flowers = [
  {sepalLength: 5.1, sepalWidth: 3.5, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.9, sepalWidth: 3.0, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.7, sepalWidth: 3.2, petalLength: 1.3, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.6, sepalWidth: 3.1, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.6, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.4, sepalWidth: 3.9, petalLength: 1.7, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 4.6, sepalWidth: 3.4, petalLength: 1.4, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.4, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.4, sepalWidth: 2.9, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.9, sepalWidth: 3.1, petalLength: 1.5, petalWidth: 0.1, species: "setosa"},
  {sepalLength: 5.4, sepalWidth: 3.7, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.8, sepalWidth: 3.4, petalLength: 1.6, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.8, sepalWidth: 3.0, petalLength: 1.4, petalWidth: 0.1, species: "setosa"},
  {sepalLength: 4.3, sepalWidth: 3.0, petalLength: 1.1, petalWidth: 0.1, species: "setosa"},
  {sepalLength: 5.8, sepalWidth: 4.0, petalLength: 1.2, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.7, sepalWidth: 4.4, petalLength: 1.5, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 5.4, sepalWidth: 3.9, petalLength: 1.3, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.5, petalLength: 1.4, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 5.7, sepalWidth: 3.8, petalLength: 1.7, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.8, petalLength: 1.5, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 5.4, sepalWidth: 3.4, petalLength: 1.7, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.7, petalLength: 1.5, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 4.6, sepalWidth: 3.6, petalLength: 1.0, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.3, petalLength: 1.7, petalWidth: 0.5, species: "setosa"},
  {sepalLength: 4.8, sepalWidth: 3.4, petalLength: 1.9, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.0, petalLength: 1.6, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.4, petalLength: 1.6, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 5.2, sepalWidth: 3.5, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.2, sepalWidth: 3.4, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.7, sepalWidth: 3.2, petalLength: 1.6, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.8, sepalWidth: 3.1, petalLength: 1.6, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.4, sepalWidth: 3.4, petalLength: 1.5, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 5.2, sepalWidth: 4.1, petalLength: 1.5, petalWidth: 0.1, species: "setosa"},
  {sepalLength: 5.5, sepalWidth: 4.2, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.9, sepalWidth: 3.1, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.2, petalLength: 1.2, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.5, sepalWidth: 3.5, petalLength: 1.3, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.9, sepalWidth: 3.6, petalLength: 1.4, petalWidth: 0.1, species: "setosa"},
  {sepalLength: 4.4, sepalWidth: 3.0, petalLength: 1.3, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.4, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.5, petalLength: 1.3, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 4.5, sepalWidth: 2.3, petalLength: 1.3, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 4.4, sepalWidth: 3.2, petalLength: 1.3, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.5, petalLength: 1.6, petalWidth: 0.6, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.8, petalLength: 1.9, petalWidth: 0.4, species: "setosa"},
  {sepalLength: 4.8, sepalWidth: 3.0, petalLength: 1.4, petalWidth: 0.3, species: "setosa"},
  {sepalLength: 5.1, sepalWidth: 3.8, petalLength: 1.6, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 4.6, sepalWidth: 3.2, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.3, sepalWidth: 3.7, petalLength: 1.5, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 5.0, sepalWidth: 3.3, petalLength: 1.4, petalWidth: 0.2, species: "setosa"},
  {sepalLength: 7.0, sepalWidth: 3.2, petalLength: 4.7, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 6.4, sepalWidth: 3.2, petalLength: 4.5, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 6.9, sepalWidth: 3.1, petalLength: 4.9, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 5.5, sepalWidth: 2.3, petalLength: 4.0, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.5, sepalWidth: 2.8, petalLength: 4.6, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 5.7, sepalWidth: 2.8, petalLength: 4.5, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.3, sepalWidth: 3.3, petalLength: 4.7, petalWidth: 1.6, species: "versicolor"},
  {sepalLength: 4.9, sepalWidth: 2.4, petalLength: 3.3, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 6.6, sepalWidth: 2.9, petalLength: 4.6, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.2, sepalWidth: 2.7, petalLength: 3.9, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 5.0, sepalWidth: 2.0, petalLength: 3.5, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 5.9, sepalWidth: 3.0, petalLength: 4.2, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 6.0, sepalWidth: 2.2, petalLength: 4.0, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 6.1, sepalWidth: 2.9, petalLength: 4.7, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 5.6, sepalWidth: 2.9, petalLength: 3.6, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.7, sepalWidth: 3.1, petalLength: 4.4, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 5.6, sepalWidth: 3.0, petalLength: 4.5, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 5.8, sepalWidth: 2.7, petalLength: 4.1, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 6.2, sepalWidth: 2.2, petalLength: 4.5, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 5.6, sepalWidth: 2.5, petalLength: 3.9, petalWidth: 1.1, species: "versicolor"},
  {sepalLength: 5.9, sepalWidth: 3.2, petalLength: 4.8, petalWidth: 1.8, species: "versicolor"},
  {sepalLength: 6.1, sepalWidth: 2.8, petalLength: 4.0, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.3, sepalWidth: 2.5, petalLength: 4.9, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 6.1, sepalWidth: 2.8, petalLength: 4.7, petalWidth: 1.2, species: "versicolor"},
  {sepalLength: 6.4, sepalWidth: 2.9, petalLength: 4.3, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.6, sepalWidth: 3.0, petalLength: 4.4, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 6.8, sepalWidth: 2.8, petalLength: 4.8, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 6.7, sepalWidth: 3.0, petalLength: 5.0, petalWidth: 1.7, species: "versicolor"},
  {sepalLength: 6.0, sepalWidth: 2.9, petalLength: 4.5, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 5.7, sepalWidth: 2.6, petalLength: 3.5, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 5.5, sepalWidth: 2.4, petalLength: 3.8, petalWidth: 1.1, species: "versicolor"},
  {sepalLength: 5.5, sepalWidth: 2.4, petalLength: 3.7, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 5.8, sepalWidth: 2.7, petalLength: 3.9, petalWidth: 1.2, species: "versicolor"},
  {sepalLength: 6.0, sepalWidth: 2.7, petalLength: 5.1, petalWidth: 1.6, species: "versicolor"},
  {sepalLength: 5.4, sepalWidth: 3.0, petalLength: 4.5, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 6.0, sepalWidth: 3.4, petalLength: 4.5, petalWidth: 1.6, species: "versicolor"},
  {sepalLength: 6.7, sepalWidth: 3.1, petalLength: 4.7, petalWidth: 1.5, species: "versicolor"},
  {sepalLength: 6.3, sepalWidth: 2.3, petalLength: 4.4, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.6, sepalWidth: 3.0, petalLength: 4.1, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.5, sepalWidth: 2.5, petalLength: 4.0, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.5, sepalWidth: 2.6, petalLength: 4.4, petalWidth: 1.2, species: "versicolor"},
  {sepalLength: 6.1, sepalWidth: 3.0, petalLength: 4.6, petalWidth: 1.4, species: "versicolor"},
  {sepalLength: 5.8, sepalWidth: 2.6, petalLength: 4.0, petalWidth: 1.2, species: "versicolor"},
  {sepalLength: 5.0, sepalWidth: 2.3, petalLength: 3.3, petalWidth: 1.0, species: "versicolor"},
  {sepalLength: 5.6, sepalWidth: 2.7, petalLength: 4.2, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.7, sepalWidth: 3.0, petalLength: 4.2, petalWidth: 1.2, species: "versicolor"},
  {sepalLength: 5.7, sepalWidth: 2.9, petalLength: 4.2, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.2, sepalWidth: 2.9, petalLength: 4.3, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 5.1, sepalWidth: 2.5, petalLength: 3.0, petalWidth: 1.1, species: "versicolor"},
  {sepalLength: 5.7, sepalWidth: 2.8, petalLength: 4.1, petalWidth: 1.3, species: "versicolor"},
  {sepalLength: 6.3, sepalWidth: 3.3, petalLength: 6.0, petalWidth: 2.5, species: "virginica"},
  {sepalLength: 5.8, sepalWidth: 2.7, petalLength: 5.1, petalWidth: 1.9, species: "virginica"},
  {sepalLength: 7.1, sepalWidth: 3.0, petalLength: 5.9, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 6.3, sepalWidth: 2.9, petalLength: 5.6, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.5, sepalWidth: 3.0, petalLength: 5.8, petalWidth: 2.2, species: "virginica"},
  {sepalLength: 7.6, sepalWidth: 3.0, petalLength: 6.6, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 4.9, sepalWidth: 2.5, petalLength: 4.5, petalWidth: 1.7, species: "virginica"},
  {sepalLength: 7.3, sepalWidth: 2.9, petalLength: 6.3, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.7, sepalWidth: 2.5, petalLength: 5.8, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 7.2, sepalWidth: 3.6, petalLength: 6.1, petalWidth: 2.5, species: "virginica"},
  {sepalLength: 6.5, sepalWidth: 3.2, petalLength: 5.1, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 6.4, sepalWidth: 2.7, petalLength: 5.3, petalWidth: 1.9, species: "virginica"},
  {sepalLength: 6.8, sepalWidth: 3.0, petalLength: 5.5, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 5.7, sepalWidth: 2.5, petalLength: 5.0, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 5.8, sepalWidth: 2.8, petalLength: 5.1, petalWidth: 2.4, species: "virginica"},
  {sepalLength: 6.4, sepalWidth: 3.2, petalLength: 5.3, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 6.5, sepalWidth: 3.0, petalLength: 5.5, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 7.7, sepalWidth: 3.8, petalLength: 6.7, petalWidth: 2.2, species: "virginica"},
  {sepalLength: 7.7, sepalWidth: 2.6, petalLength: 6.9, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 6.0, sepalWidth: 2.2, petalLength: 5.0, petalWidth: 1.5, species: "virginica"},
  {sepalLength: 6.9, sepalWidth: 3.2, petalLength: 5.7, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 5.6, sepalWidth: 2.8, petalLength: 4.9, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 7.7, sepalWidth: 2.8, petalLength: 6.7, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 6.3, sepalWidth: 2.7, petalLength: 4.9, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.7, sepalWidth: 3.3, petalLength: 5.7, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 7.2, sepalWidth: 3.2, petalLength: 6.0, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.2, sepalWidth: 2.8, petalLength: 4.8, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.1, sepalWidth: 3.0, petalLength: 4.9, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.4, sepalWidth: 2.8, petalLength: 5.6, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 7.2, sepalWidth: 3.0, petalLength: 5.8, petalWidth: 1.6, species: "virginica"},
  {sepalLength: 7.4, sepalWidth: 2.8, petalLength: 6.1, petalWidth: 1.9, species: "virginica"},
  {sepalLength: 7.9, sepalWidth: 3.8, petalLength: 6.4, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 6.4, sepalWidth: 2.8, petalLength: 5.6, petalWidth: 2.2, species: "virginica"},
  {sepalLength: 6.3, sepalWidth: 2.8, petalLength: 5.1, petalWidth: 1.5, species: "virginica"},
  {sepalLength: 6.1, sepalWidth: 2.6, petalLength: 5.6, petalWidth: 1.4, species: "virginica"},
  {sepalLength: 7.7, sepalWidth: 3.0, petalLength: 6.1, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 6.3, sepalWidth: 3.4, petalLength: 5.6, petalWidth: 2.4, species: "virginica"},
  {sepalLength: 6.4, sepalWidth: 3.1, petalLength: 5.5, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.0, sepalWidth: 3.0, petalLength: 4.8, petalWidth: 1.8, species: "virginica"},
  {sepalLength: 6.9, sepalWidth: 3.1, petalLength: 5.4, petalWidth: 2.1, species: "virginica"},
  {sepalLength: 6.7, sepalWidth: 3.1, petalLength: 5.6, petalWidth: 2.4, species: "virginica"},
  {sepalLength: 6.9, sepalWidth: 3.1, petalLength: 5.1, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 5.8, sepalWidth: 2.7, petalLength: 5.1, petalWidth: 1.9, species: "virginica"},
  {sepalLength: 6.8, sepalWidth: 3.2, petalLength: 5.9, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 6.7, sepalWidth: 3.3, petalLength: 5.7, petalWidth: 2.5, species: "virginica"},
  {sepalLength: 6.7, sepalWidth: 3.0, petalLength: 5.2, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 6.3, sepalWidth: 2.5, petalLength: 5.0, petalWidth: 1.9, species: "virginica"},
  {sepalLength: 6.5, sepalWidth: 3.0, petalLength: 5.2, petalWidth: 2.0, species: "virginica"},
  {sepalLength: 6.2, sepalWidth: 3.4, petalLength: 5.4, petalWidth: 2.3, species: "virginica"},
  {sepalLength: 5.9, sepalWidth: 3.0, petalLength: 5.1, petalWidth: 1.8, species: "virginica"}
];
Copyright 2010 Stanford Visualization Group