| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113 |
- <html>
- <head>
- <title>Antibiotic Effectiveness</title>
- <link type="text/css" rel="stylesheet" href="../ex.css"/>
- <script type="text/javascript" src="../../protovis-r3.2.js"></script>
- <script type="text/javascript" src="antibiotics.js"></script>
- <style type="text/css">
- #fig {
- height: 638px;
- width: 608px;
- }
- </style>
- </head>
- <body><div id="center"><div id="fig">
- <script type="text/javascript+protovis">
- var s = 180,
- p = 20,
- z = pv.Scale.log(0.001, 1000).range(0, s),
- color = pv.colors("darkred", "darkblue").by(function(d) d.gram),
- ticks = pv.range(-2, 3).map(function(e) Math.pow(10, e));
- /* Root panel. */
- var vis = new pv.Panel()
- .height(s * antibiotics.length + p * (antibiotics.length - 1))
- .width(function() this.height())
- .top(14.5)
- .left(14.5)
- .bottom(44)
- .right(14);
- /* Cell for each antibiotic pair. */
- var cell = vis.add(pv.Panel)
- .data(antibiotics)
- .width(s)
- .left(function() (s + p) * this.index)
- .add(pv.Panel)
- .data(antibiotics)
- .height(s)
- .top(function() (s + p) * this.index);
- /* Label. */
- cell.anchor("center").add(pv.Label)
- .visible(function(d, y, x) x == y)
- .font("bold 14px sans-serif")
- .text(function(d, y, x) x);
- /* Dot plot and frame. */
- var plot = cell.add(pv.Panel)
- .data(function(y, x) [x])
- .visible(function(x, y) x != y)
- .strokeStyle("#aaa");
- /* Ticks. */
- var tick = new pv.Rule()
- .visible(function(d, x, y) x != y)
- .data(ticks)
- .strokeStyle("#ddd");
- /* X-axis ticks. */
- var xtick = plot.add(pv.Rule)
- .extend(tick)
- .left(z);
- /* Bottom and top labels. */
- xtick.anchor("bottom").add(pv.Label)
- .visible(function() cell.index == antibiotics.length - 1);
- xtick.anchor("top").add(pv.Label)
- .visible(function() cell.index == 0);
- /* Y-axis ticks. */
- var ytick = plot.add(pv.Rule)
- .extend(tick)
- .bottom(z);
- /* Bottom and top labels. */
- ytick.anchor("right").add(pv.Label)
- .visible(function() cell.parent.index == antibiotics.length - 1)
- .textAngle(Math.PI / 2)
- .textBaseline("bottom")
- .textAlign("center");
- ytick.anchor("left").add(pv.Label)
- .visible(function() cell.parent.index == 0)
- .textAngle(-Math.PI / 2)
- .textBaseline("bottom")
- .textAlign("center");
- /* Dot plot. */
- var dot = plot.add(pv.Dot)
- .data(bacteria)
- .strokeStyle(color)
- .fillStyle(function() this.strokeStyle().alpha(.2))
- .left(function(d, x, y) z(d[x]))
- .bottom(function(d, x, y) z(d[y]))
- .title(function(d) d.name);
- /* Legend. */
- vis.add(pv.Dot)
- .extend(dot)
- .data([{gram:"positive"}, {gram:"negative"}])
- .bottom(-30)
- .left(function() this.index * 100)
- .title(null)
- .anchor("right").add(pv.Label)
- .text(function(d) "Gram-" + d.gram);
- vis.render();
- </script>
- </div></div></body>
- </html>
|