| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- <html>
- <head>
- <title>My God, it's full of eyes!</title>
- <link rel="stylesheet" type="text/css" href="../ex.css"/>
- <script type="text/javascript" src="../../protovis-r3.2.js"></script>
- <style type="text/css">
- body {
- background: #222;
- }
- #fig {
- width: 200px;
- height: 200px;
- }
- </style>
- </head>
- <body><div id="center"><div id="fig">
- <script type="text/javascript+protovis">
- var vis = new pv.Panel()
- .width(200)
- .height(200)
- .fillStyle("#666")
- .strokeStyle("#ccc");
- vis.add(pv.Panel)
- .data([{x:50, y:16, r:40},
- {x:64, y:85, r:20},
- {x:90, y:200, r:60},
- {x:150, y:44, r:20},
- {x:175, y:120, r:40}])
- .left(function(d) d.x)
- .top(function(d) d.y)
- .add(pv.Dot)
- .fillStyle("#fff")
- .strokeStyle(null)
- .radius(function(d) d.r)
- .add(pv.Dot)
- .def("v", function(d) this.mouse().norm().times(d.r / 2))
- .fillStyle("#aaa")
- .left(function(d) this.v().x)
- .top(function(d) this.v().y)
- .radius(function(d) d.r / 2);
- vis.render();
- pv.listen(window, "mousemove", function() vis.render());
- </script>
- </div></div></body>
- </html>
|